DEV Community

Cover image for My Portfolio Site... For You!
Michael Solati
Michael Solati

Posted on

My Portfolio Site... For You!

Over the past weekend I decided to redo my portfolio website,, a task which I was dragging my feet on. As a Developer πŸ₯‘ (Advocate) I speak at events, write blog posts, and maintain some libraries. When re-doing my portfolio I wanted to showcase all of that without ever needing to update the site. The new site does all that and a more, such as:

  • It rips my work experience from LinkedIn via Puppeteer and shows it on /.
  • Articles I've written on are shown on /articles.
  • My most starred and recent GitHub repos are shown on /code.
  • Recorded talks are fetched from a YouTube playlist and shown on /talks.
  • Two themes are available, one for devices using light mode and one for dark mode.
  • It works when JavaScript is disabled thanks to SSR running on Firebase Functions.
  • It also works offline thanks to a service worker.
  • It grabs my profile picture and saves it, as well as generates PWA icons from the profile picture.
  • Updates the manifest.webmanifest file.
  • Saves all the cover image or social image from my posts.
  • Saves all the previews images of the YouTube videos in the playlist.
  • Generate screenshots that can be used for sites like Twitter of Facebook.
  • GitHub Actions will update all the data and images then deploy to Firebase once a week.

It honestly does a lot, but here's the exciting part...


Meaning you can fork it and only need to update the environment.general.ts file in order to have the site completely customized for you.

The project is available on GitHub, just checkout the README to get started.

Enjoy y'all!

To keep up with everything I’m doing, follow me on Twitter and If you’re thinking, β€œShow me the code!” you can find me on GitHub.

Top comments (8)

ben profile image
Ben Halpern

Really neat approach. I could definitely see this becoming a pretty standard way for developers to build personal sites because we do our work and reach community in so many places. Automatically pulling from those sources definitely makes sense!

nipodemos profile image

i'm a lazy person, and i absolutely love when things i must do repeatedly are automated 😁
Love even more when someone makes for me πŸ˜‚πŸ˜‚
i know that's lame, but thank you very much for releasing this for everyone

a1300 profile image

@nipodemos I checked the repo. There is no license specified. That means that you can't reuse the project

michaelsolati profile image
Michael Solati

I'll add that in the morning, it's meant for reuse! (Good catch)

terkwood profile image
Felix Terkhorn

Very nicely done! 🌟

zuchers profile image

oh yes, portfolio is such a must thing.

freddyhm profile image
Freddy Hidalgo-Monchez

I really like your approach of centralizing the content you've created in other places. I'm currently rethinking my portfolio site so your design is definitely giving me ideas. Great share, Michael!

prosperdoescode profile image
Prosper Nglazi

Hey Michael, very clean and cool site. The cards tend to lose their alignment in mobile landscape mode though, but I love it very much