DEV Community ๐Ÿ‘ฉโ€๐Ÿ’ป๐Ÿ‘จโ€๐Ÿ’ป

Cover image for Welcome to my website
William Iommi
William Iommi

Posted on

Welcome to my website

I did it!!! My website is live and I'm happy to share it with you all!
I hosted it on Vercel and you can reach it at the following URL:

williamiommi.me

I consider it other than a personal side project, a place where to share who am I and my beautiful pictures too ๐Ÿ˜‚ ๐Ÿ˜‡.
Iโ€™m happy with the current status and it is definitely a version 1.0 but Iโ€™m already thinking of adding some extra sections soon.

The design is simple and minimal. Iโ€™m not a designer, but it was fun using Figma during the design process.


The Stack

Let's talk about what we have under the hood...

I used Next.js (w/ Typescript) as React framework. I like this product and I thought it was the right place to put my current knowledge into practice. Except for the gallery page, which is Server Side Rendered, all the other pages are statically generated and one of them has Incremental Static Regeneration too.

For styling, I used Tailwind CSS, and well...it's amazing. I know, this topic could open a discussion about pros and cons but with my personal experience (a.k.a. my 2 cents) and If I see this tool applied in my daily job, I think the pros are greater than the cons.

Apart from these 2 'pillars', for animations I'm using Framer Motion, Lodash for some utility methods and react-masonry-css for the gallery grid.


Special mentions

The writing page uses the api provided by dev.to to retrieve all my posts. This is the page that uses Incremental Static Regeneration.

I host my pictures on Google Photos at the moment and the gallery pages are Server Side Rendered.
In the beginning, also these pages were statically generated and optimized with the Image optimization provided by Next. But I had some โ€˜data usageโ€™ issues with Vercel because of my basic plan, so I removed the Image optimization and switch to SSR because of another issue related to Google Photos. They cache the URLs of every image for 1 hour and then the URL change, so I always need a fresh version of the image.
The cons, of course, is that I have to give up on a fast page load.

Last but (definitely) not least, a special thanks ๐Ÿ™๐Ÿป to Lee Robinson Spotify's Snippet that I used in the footer with a custom UI. The snippet shows your current song playing on Spotify...Thanks, Lee ๐Ÿ˜ƒ


What Next?

As mentioned before, I would like to add a few extra sections but apart from that, the idea is to move all the copy to a CMS, improve performance on the gallery section and add also the Italian language, which is my native language ๐Ÿ˜ƒ.

That's all folks! Thanks for reading!

Ciao / See ya ๐Ÿค™

Top comments (0)

Head to your account's Settings to...

๐ŸŒš Enable dark mode
๐Ÿ”  Change your default font
๐Ÿ“š Adjust your experience level to see more relevant content