Skip to content

Latest commit

 

History

History
125 lines (83 loc) · 6 KB

README.md

File metadata and controls

125 lines (83 loc) · 6 KB
Raw

📓 GitHub Portfolio

GitHub Portfolio lets you create your own portfolio + blogging website in 1 minute. GitHub Portfolio uses your GitHub repos to create a personalized website for you. Here's a live demo.

🪄 How does it work?

GitHub Portfolio uses the following to generate your portfolio website:

  • Your GitHub profile README.md

  • A repo with a folder named posts in the main directory, which will be used to store your blog posts

  • It uses Vercel to deploy a client app that will fetch the information from your GitHub account.

So everything on your portfolio comes directly from your GitHub account activity. The more you use GitHub, the richer your portfolio becomes!

🌟 Why use it?

GitHub Portfolio provides a simple way to create a portfolio that showcases your work on GitHub. Here are some of the benefits:

  • Easy setup - It takes less than 60 seconds to create your portfolio

  • Always in sync - Your portfolio updates automatically as your GitHub profile updates. No need to rebuild every time

  • Hackable - It's completely open source and can be easily customized or extended

  • Free hosting - Your site gets deployed on Vercel and you get a free domain. No server maintenance needed!

  • Write blog posts - Write blog posts in an instant, by making a new markdown file inside a repo

  • Automatic SEO - Your site is optimized for search engines

  • Social links - Add links to your social profiles

  • Automatic Site Map - Your site map is automatically generated and updated

  • RSS Feed Support - Your RSS files are automatically generated and updated

In short, GitHub Portfolio lets you focus on your projects while it handles the portfolio generation and hosting. The perfect solution for developers and makers!

🚧 Getting Started

  1. Create a new GitHub token. The token only needs access to your public repositories. You can create one here: https://github.com/settings/tokens

  2. Create a public repo with whatever name you want. This will be used to store your blog posts. Inside the repo, create a folder named posts. This is where your blog posts will be stored.

  3. You will need your github token, username and the name of the repo you just created. Click the following button to deploy to Vercel, it will ask for these three things.

Deploy with Vercel

That's it! Your site will be deployed and you will be able to see it. You can continue to customize it by adding the following environment variables in Vercel.

✨ Personalizing your site

Required

Environment Variable Description
GITHUB_TOKEN The GitHub token to use for fetching repos
NEXT_PUBLIC_GITHUB_USERNAME Your GitHub username
NEXT_PUBLIC_GITHUB_POSTS_REPO The name of the repo to use for blog posts
SITE_URL The URL of your site. You will need this for SEO and RSS.

Site configuration

Environment Variable Description
GITHUB_EXCLUDE_LIST A comma-separated list of repos to exclude from your projects list.
NEXT_PUBLIC_SITE_TITLE The title of your site (Tab title)
NEXT_PUBLIC_SITE_DESCRIPTION The description of your site
NEXT_PUBLIC_FOOTER The footer to use at the bottom of the site

Social links

Environment Variable Description
NEXT_PUBLIC_EMAIL Your email address
NEXT_PUBLIC_GITHUB_PROFILE Your GitHub profile URL
NEXT_PUBLIC_LINKEDIN_PROFILE Your LinkedIn profile URL
NEXT_PUBLIC_THREADS_PROFILE Your Threads profile URL
NEXT_PUBLIC_X_PROFILE Your X profile URL

RSS Feed

Environment Variable Description
RSS_FEED_TITLE The title for your feed
RSS_FEED_DESCRIPTION The description for it
AUTHOR_NAME Your name
AUTHOR_EMAIL Your email address, if you want to include it in the feed

✍ Publishing blog posts

To publish a blog post all you need to do is add a markdown file to the posts folder in your blog posts repo.

We use a simple name format for the markdown files. The format is YYYY-MM-DD-post-title.md. This date will be used as the publish date of the post in your site. The file name will also be used as the URL slug for the post. For example, if you create a file named 2023-10-19 hello world.md, the URL for the post will be https://your-site.com/posts/2023-10-19%20hello%20world.

Once you create the file, it will be automatically added to your site. You can edit the file and commit it to update the post.

🤝 Contributing

You can contribute to this project by creating a pull request. If you have any questions, feel free to open an issue or reach out to me on via email or social.

📝 License

GitHub Portfolio is licensed under the MIT License. See the LICENSE file for more information.