gatsby-portfolio-dev icon indicating copy to clipboard operation
gatsby-portfolio-dev copied to clipboard

A portfolio for developers

Portfolio for developers

Deploy with Vercel

Powered by Vercel

Next js version?

There you go

Theme

Gatsby-theme-portfolio

Features

  • Eslint/Prettier configured
  • Scores 100% on a11y / Performance / PWA / SEO
  • PWA (desktop & mobile)
  • Easy to customize
  • Nice project structure
  • Amazing illustrations by Undraw.co
  • Tablet & mobile friendly
  • Continuous deployment with Vercel
  • Or with Netlify, check Netlify branch
  • A contact form protected by Google Recaptcha
  • Can be deployed with one click
  • Functional components with ~~Recompose~~ React Hooks! ~~ready to migrate to React hooks!~~
  • Fetches your Github pinned projects with most stars (You could customize this if you wish)
  • One click deployment to Vercel

Design

Project on Behance

Structure

.
├── data
│   └── config              # SEO related tags
├── src
│   └── assets              # Assets
│   │   │── icons             # icons
│   │   │── illustrations     # illustrations from (undraw.co)
│   │   └── thumbnail         # cover of your website when it's shared to social media
│   ├── components          # Components
│   │   │── common            # Common components
│   │   │── landing           # Components used on the landing page
│   │   └── theme             # Header & Footer
│   └── pages               # Pages
└── static                  # favicon & Netlify redirects

Prerequisites

Online

  1. Create an account at Formium and grab your form endpoint url
  2. Grab a Google recaptcha key from Google Recaptcha

Make sure to select V2 checkbox

  1. Grab your Github token from GitHub
  2. Click Deploy with Vercel and pass in your:
  • Formium form endpoint
  • Google recaptcha public key
  • Github token

To Env variables section.

For the contact form to work, you will need to update the url in here

Locally

  1. Create an account at Formium
  2. Grab a Google recaptcha key from Google Recaptcha
  3. Grab your Github token from GitHub
  4. Run cp .env.development.template .env.development
  5. Run npm i && npm start

You could run vercel env pull to get your env variables from Vercel.

Deploying locally to Vercel

I highly recommend that you push to GitHub/GitLab and deploy your repository to Vercel instead or just hit the Deploy button.

Clean the cache

This removes the .cache/ & public/ folders

yarn reset

Built with

  • Adobe XD
  • Gatsby
  • React & GraphQL
  • Formium
  • Google recaptcha
  • VSCode
  • And these useful of JavaScript libraries & Gatsby plugins package.json

License

This project is licensed under the MIT License - see the LICENSE.md file for more details

Contributors

  • Ajay NS https://github.com/smakosh/gatsby-portfolio-dev/pull/3
  • Ryan Lee https://github.com/smakosh/gatsby-portfolio-dev/pull/6
  • David https://github.com/smakosh/gatsby-portfolio-dev/pull/8
  • Léu Almeida https://github.com/smakosh/gatsby-portfolio-dev/pull/21
  • Kudakwashe Mupeni https://github.com/smakosh/gatsby-portfolio-dev/pull/20
  • sasannnn https://github.com/smakosh/gatsby-portfolio-dev/pull/22
  • Michael Seifarth https://github.com/smakosh/gatsby-portfolio-dev/pull/27
  • Hugo https://github.com/smakosh/gatsby-portfolio-dev/pull/34 https://github.com/smakosh/gatsby-portfolio-dev/pull/35
  • manula thejan https://github.com/smakosh/gatsby-portfolio-dev/pull/38
  • Benjamin Lo https://github.com/smakosh/gatsby-portfolio-dev/pull/40
  • Yassine Rais https://github.com/smakosh/gatsby-portfolio-dev/pull/41
  • Juan Manuel Combetto https://github.com/smakosh/gatsby-portfolio-dev/pull/54
  • Smakosh

Support

If you love this Gatsby template and want to support me, you can do so through my GitHub profile.