Skip to content

Latest commit

 

History

History
125 lines (80 loc) · 3.66 KB

README.md

File metadata and controls

125 lines (80 loc) · 3.66 KB
Raw

Automatically generate a beautiful, responsive site to display your GitHub projects.
Live demo at shaansubbaiah.github.io
If you find Portfolio useful, make sure to 🌟 the repository!

Features

  • Website features
    • Responsive
    • Dark Mode
    • SEO score of 100 on Lighthouse
    • Customizable colors, no. of repos, social, links, etc
    • Supports displaying repository social preview images
    • Display GitHub profile README.md
    • To-do: GitHub Gists support using iframe embeds
    • To-do: Blurry/Frosted glass styled repo cards
  • Deploy to GitHub pages directly from Portfolio
  • Uses ViteJS under the hood fu=or building, live preview on development

Getting Started

Install

  1. Clone the repo or download the latest release
git clone [email protected]:shaansubbaiah/Portfolio.git
  1. Install dependencies
cd Portfolio

npm install
  1. Run Portfolio
node portfolio.js
  1. Set the Github token, edit the config and then build!

See Configuration

A token can be created at https://github.com/settings/tokens/new

Make sure you have selected atleast public_repo, read:user permissions while creating the token!

  1. You can deploy the website to your github pages site (generally https://<your_username>.github.io) from Portfolio. OR Manually copy contents in dist/ to your github pages repository.

  2. Done

Development

Portfolio now uses ViteJS which significantly improves over the previosuly existing development workflow.

The website files are in src/

To view the site with hot-reload on changes, run:

npm run dev

If there's data missing, you might have to build the site once so it writes the GitHub data to ./github-data.json

Building

Run Portfolio and select the build option.

Under the hood, Portfolio runs vite build which reads the config from vite.config.js and the build files are at dist/

Configuration

username: String - your Github username

repos: Integer - number of repositories to display, MAX 100

avatar: String - path(local/remote) to an image for the avatar and favicon. If not specified, uses your GitHub avatar.

linkedinURL: String - your LinkedIn profile link. Set to null in config.json to disable it / press enter while setting it up.

twitterId: String - your Twitter profile id. Set to null in config.json to disable it / press enter while setting it up. (Portfolio will automatically get your Twitter ID if you have added it to your GitHub profile)

gitlabId: String - your GitLab profile id. Set to null in config.json to disable it / press enter while setting it up.

navLinks: Object Array - adds navigation links at the top. DON'T EXCEED 3

where,
name: String - Text to display
link: String - URL the text links to

infoLinks: Object Array - adds additional links in the information section.

where,
name: String - Text to display
link: String - URL the text links to

socialPreviewImage: String - displays repo's social preview image in the card. To enable, set value = "enabled".

Contributing

See CONTRIBUTING.md

Related

Gitfolio

Dev Portfolio

License

MIT Copyright (c) 2022 Shaan Subbaiah