GithubHelp home page GithubHelp logo

vimal-verma / master-portfolio Goto Github PK

View Code? Open in Web Editor NEW
46.0 2.0 20.0 7.83 MB

A clean, beautiful, responsive and 100% customizable portfolio template for Developers!

Home Page: https://master-portfolio.js.org/

License: MIT License

HTML 3.47% CSS 12.09% JavaScript 84.44%
hacktoberfest master-portfolio react portfolio-website netlify gh-pages vercel template portfolio portfolio-site

master-portfolio's Introduction

Master-Portfolio

Netlify Status GitHub forks GitHub Repo stars GitHub GitHub top language GitHub repo size GitHub issues Website GitHub package.json dependency version (prod) GitHub package.json dependency version (prod) GitHub commit activity GitHub contributors Run on Repl.it

Open in Gitpod Website Website

Master-Portfolio

  • A clean, beautiful, responsive and 100% customizable portfolio template for Developers!
  • It can List your all Projects & Certificate
  • it can Also list your All Dev.to articles Using Api (if you have set BlogData.show_Blog: true in src/Name.js)
  • The website is completely built on react-js framework of javascript๐Ÿ”ฅ.
  • In this project, there are basically Personal Information that you need to change to customize this to anyone else's portfolio
  • You will find src/Name.js file which contains the complete information about the user. The file looks something like below
  • const greeting = {
        title: "Hi, I'm Your Name",
        logo_name: "Name",
        logo_img_show: false, // if true than show image(logo) in home page instant of text(logo)
        logo_img: "https://master-portfolio.js.org/src/assets/img/mplogo.png",
        full_name: "your name",
        email: "email id",
        subTitle:
        "I'm a student pursuing {Course} in {department} from {university}. I'm a passionate learner who's always willing to learn and work across technologies and domains. I love to explore new technologies and leverage. Apart from that I also love to guide and mentor newbies. I'm currently into Web Development and working on my MERN Website",
        Programming: true,  // if true, Show 'Programming' section in home page, if false than not show
        developer: true,  // if true, Show 'Full Stack Development' section in home page, if false than not show
        designer: true,  // if true, Show 'designer' section in home page, if false than not show
        cloud_infra_architecture:true,  // if true, Show 'cloud_infra_architecture' section in home page, if false than not show
        data_Science: true,  // if true, Show 'data_Science' section in home page, if false than not show
        ml_ai: true,  // if true, Show 'ml_ai' section in home page, if false than not show
        Robotic: true,  // if true, Show 'Robotic' section in home page, if false than not show
        gamedev: true,  // if true, Show 'gamedev' section in home page, if false than not show
    };
    const BlogData = {
        // this show your dev.to blog in your Portfolio blog
        show_Blog: true,  // if true it Show your DEV.to article in Blog Section, if false than Blog Section(nav) convert to skill Section(nav).
        devto_username: "vimal"
    };
    const socialMedia = {
        facebook: "Your facebook link",
        twitter: "Your twitter link",
        instagram: "Your instagram link",
        github: "Your github link",
        gitlab: "Your gitlab link",
        devto: "Your devto link",
        mailto: "mailto:Your mail"
    };
    const about = {
        School: "Your School Name",
        College: "Your College Name",
        university: "Your university Name",
        Home: "Your Home city"
    };
    const projects = [
    {
        id: "1",
        name: "project 1",
        Description: "this is Description",
        Code_Link: "this is code link",
        Live_link: "this is Live link",
        tool_used: "html,css,js", 
        img: "https://master-portfolio.js.org/src/assets/img/mplogo.png"
    },
    .........
    ]
    

Master-Portfolio Website Website

You can Customize it to make your own portfolio by Three Method โœ๏ธ

github

Using Template

  • Click on Use this template โ˜๏ธ
  • clone git clone https://github.com/{your github username}/{repository name}
  • To download required dependencies to your system, navigate to the directory where the cloned repository resides and execute following command: npm install
  • change "homepage " to https://{your github username}.github.io/{repository name} in package.json
  • Edit src/Name.js
  • You can check it using npm start, it will open the website locally on your browser.
  • Commit change and push.
  • Once you are done with your setup and have successfully completed all steps above,
  • Now you have to deploy that portfolio website

    • You can use Netlify, Vercel & gh-pages
    • To deploy by gh-pages
      • Run npm run deploy to build and create a branch called gh-pages. It will push the build files to that branch.
      • ๐ŸŽ‰ Your Portfolio website is ready.๐Ÿฅณ And live at https://{your github username}.github.io/{repository name}.

Using Netlify deploy

Deploy to Netlify

  • Click on Deploy button โ˜๏ธ
  • Click on connect to Github m1
  • Click on Authorize netlify m2
  • Chose a github repository name and click on Save and Deploy m3
  • Your portfolio website is live ๐Ÿš€ m4
  • Those step โ˜๏ธ create a repository in your github account, go to that repository
  • Edit src/Name.js
  • Commit change and push ๐ŸŽ‰ Your Portfolio website is ready.๐Ÿฅณ

Using Vercel deploy

Deploy with Vercel

  • Click on Deploy button โ˜๏ธ
  • Type a Project name and click on continue m1
  • Install Vercel for Github(If not already) m2
  • Chose a github repository name and click on continue m3
  • Verify Framework preset is Create React App and Click on Deploy m4
  • Your portfolio website is live ๐Ÿš€ m4
  • Those step โ˜๏ธ create a repository in your github account, go to that repository
  • Edit src/Name.js
  • Commit change and push ๐ŸŽ‰ Your Portfolio website is ready.๐Ÿฅณ

Contributing

Please see our contributing.md.

Awesome contributors โœจ

References ๐Ÿ‘๐Ÿป

  • Master-Portfolio logo Design by Vimal.
  • Art Customized by Vimal and icon by icon8
  • contributors image Made with contributors-img.
  • MIT License

master-portfolio's People

Contributors

abhishekkr93 avatar codernibba avatar dependabot[bot] avatar namish25 avatar vikasshah0 avatar vimal-verma avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

master-portfolio's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.