Over the past weekend I decided to redo my portfolio website, michaelsolati.com, 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 dev.to 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 dev.to profile picture and saves it, as well as generates PWA icons from the profile picture.
- Updates the
manifest.webmanifestfile. - Saves all the cover image or social image from my dev.to 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...
IT IS ALL CUSTOMIZABLE!
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 dev.to. If you’re thinking, “Show me the code!” you can find me on GitHub.
Top comments (8)
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!
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
@nipodemos I checked the repo. There is no license specified. That means that you can't reuse the project
I'll add that in the morning, it's meant for reuse! (Good catch)
Very nicely done! 🌟
oh yes, portfolio is such a must thing.
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!
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