Portfolio Ideas - An open-source repository for inspiration

One of the biggest challenges I faced and I know a lot of developers go through when building their portfolio site is a lack of inspiration or direction regarding how they want their site to look and feel like, at least that was my own experience. I found Edidiong Asikpo 's article titled: "30 Web Developer Portfolios to Inspire You" to be immensely helpful in this regard, so I thought it would be a great idea to create a similar list that could be updated and people can contribute to.

This led to the creation of "Portfolio Ideas" —an open-source collection of personal sites curated to provide developers and designers inspiration to build their own digital garden.

Overview

There isn't much going on in this project; it's a table that shows a list of portfolios and their details consisting of the following:

1. Author: Name of the portfolio owner, ensuring proper attribution to the creators are featured in the repository.
2. Screenshot: An image capturing the homepage of the portfolio website, eliminating the need to access the link before knowing what each site looks like.
3. Live URL: URL leading to the actual portfolio website.
4. Repository Link: Link to the source file or code of the portfolio. This is not a mandatory field because we understand that not all creators would publicly make their code repository available on GitHub or Gitlab
5. Tech Stack: A list of only the fundamental or primary technologies used in building the project.

How to Contribute?

If you just built your own personal site or you know a site you think should be on portfolio ideas, follow this guide to learn to do so.

Note: If you are familiar with a basic contribution workflow, please skip to the third step.

Step 1. Fork the repository

Visit the repository on GitHub, on the top right section, you'll see the fork icon, click it to create a copy in your account.

Step 2. Add Portfolio Details

The portfolio examples are enclosed between two comments: These comments are just markers that depict where the table starts and ends.

To add a new portfolio, simply create a new line at the end of the list and add the following content:

Author Name:

Start a new line below the latest portfolio and add the author or creator of the portfolio website, like so: | Jemima Abu

Screenshot:

Visit the portfolio website and take a screenshot of the homepage, and drag and drop it into the screenshot column. Make sure you use services like tinypng.com or compressor.io to optimize the image sizes first.

Live URL:

Add the live link to the portfolio website. PS: Omit the https:// protocol in the square brackets [] and add it in the normal brackets ()

Repository:

If the portfolio is available on GitHub, add the repository link, if not, just write "None"

[GitHub](https://github.com/jemimaabu/portfolio)

Tech Stack:

The next and final thing to add is the tech stack of the portfolio website. You can use wappalyzer , or any other service you know to detect the technologies.

If the portfolio is available on GitHub, use the languages auto-detected by GitHub Linguist . Don't worry about trying to add the complete stack, just the primary language/tools are fine. Example HTML, CSS, JavaScript

Step 4. Preview and Create Pull Request:

Now we are done adding all the portfolio information, preview the portfolio added and make sure it corresponds with the table, then raise a pull request.

Congratulations! You have successfully added a portfolio to this project. Now sit back, relax and your PR will be merged as soon as it has been reviewed. If you have any ideas that can improve the project, feel free to contact me on Twitter , or raise an issue in the repository to discuss it.

Want to see a portfolio added but you can't do it yourself, mention the portfolio in this issue and it will be picked up by the community.

Conclusion

Do you like this project and will like to show your support, you can star the project or buy me a coffee to keep the project going. I sincerely hope you build an outstanding portfolio website that will blow the recruiter or visitor's mind and when you do create one, add it to the list to inspire others. Good luck. 💜

UPDATE!! At the time of writing this article, portfolio ideas was only 22 stars and 7 forks on GitHub. As of today 21 Aug 2023, portfolio ideas has crossed over 2000+ stars, 400+ forks with well over 100 contributors on GitHub.

I wrote an article on how I hit this milestone within a short time period, do give it a read. How my open source project got 1000 stars on GitHub in 4 months .