Code Monkey home page Code Monkey logo

portfolio's Introduction

Please give a star and link to this repo in your website, so that the project can grow.

Demo

To view a live demo, click here

Toggle Theme

How to use

  • Remove <meta http-equiv="refresh" content="0;url=https://tasin5541.github.io/" /> in the index.html file

  • You'll need Git and Node.js (which comes with npm) installed on your computer

  • Create a repository in github named username.github.io (your github username in place of username)

  • Open up cmd/powershell in admin mode and enter the following line to download this repository

    •  git clone https://github.com/Tasin5541/portfolio.git
  • Then go to C:\Windows\System32\portfolio in your File Explorer

  • Delete the .git file

  • Open package.json and add your repository name ("https://your_github_username.github.io") to the homepage section

    •  "homepage": "https://username.github.io"
  • Create a file called .env in the root directory of your project, type the following in cmd/powershell

    • cp env.example .env
  • Inside the .env file, add key REACT_APP_GITHUB_TOKEN and assign your github token like this.

    •  // .env
        REACT_APP_GITHUB_TOKEN = "YOUR GITHUB TOKEN HERE"

You can get a github token as described here. Give all permissions while generating token. Also add your githubUserName in the correct field inside git_data_fetcher.js.

  • You will find git_data_fetcher.js file in the main directory of the repository. This file is used to fetch the data (Pull requests, Issues, Organizations, Pinned projects etc.) from your github. If you open the file, you will see below component at the top of the file. You need to change only that component.

    • const openSource = {
        githubUserName: "Your Github Username Here.",
      };
  • Navigate to C:\Windows\System32\portfolio\src and open the portfolio.js file to change your information

  • Type the following lines in cmd/powershell one by one and press enter after each line

    •  cd portfolio
       
       npm install
       
       node git_data_fetcher.js
       
       npm run build
       
       #To view the website in localhost before deploying
       npm start
       #press ctrl+c in cmd to stop the localhost if you executed the last command
       
       #Deploy to github
       cd build
       
       git init
       
       #Use your github username
       git remote add origin https://github.com/username/username.github.io.git
       
       git add .
       
       git commit -m 'deploy'
       
       git push -u origin master
  • You're all set, now visit "username.github.io" to see your website

  • Note: You'll need to copy the .git file inside build folder and save it elsewhere. Everytime you update any information run npm build and copy the .git back into build folder before continuing with git add . and the rest of the commands. Remember to copy the .git everytime you run npm build

References ๐Ÿ‘๐Ÿป

portfolio's People

Contributors

tasin5541 avatar werayootk avatar

Watchers

 avatar

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.