Kris H

A React Portfolio Template for GitHub

GitHub Repo stars GitHub Repo Forks X (formerly Twitter) URL

A performant, accessible, progressive React portfolio template that uses the GitHub REST API.

Add your GitHub username once and all of your info will automatically be updated. Deploy to GitHub pages in a few simple steps.

Live Demo

Google PageSpeed Insights

Page Speed

Light And Dark Themes

Hero Light

Hero Dark

Getting Started

  1. Create a repository from this template
  2. Clone your new repository
  3. Make sure Node is installed
  4. Open your project and install the dependencies

    npm install
    
  5. Navigate to the src directory and open src/config.js
  6. Add your GitHub username (src/config.js line 18)

    /* START HERE
    ************************************************************** 
      Add your GitHub username (string - "YourUsername") below.
    */
    export const githubUsername = "Your GitHub username here";
    
  7. Start the development server to view the results

    npm start
    

Updating the Contact section

Projects

  1. The contact form uses Formspree, create an account and add your endpoint URL (src/config.js line 114)

    /* Contact Info
    ************************************************************** 
      Add your formspree endpoint below.
      https://formspree.io/
    */
    export const formspreeUrl = "https://formspree.io/f/YourEndpoint";
    

Deploy

A helpful guide for Create React App deployments with GitHub Pages can be found here.

  1. Update the homepage value (package.json line 3)

    "homepage": "https://YourUserName.github.io/your-repo/",
    
  2. Run the deploy command

    npm run deploy
    

Customization Options

Checkout the Wiki for additional customization options:

Back to top :top:

License

MIT