A screenshot of Personal portfolio in a desktop viewport
A screenshot of Personal portfolio in a mobile viewport

Personal portfolio

I decided to create my personal portfolio manily as a training ground to teach myself Vue.js, which I had just discovered and quickly grew to love. This has been my first real project in vue, and the first "personal" small-scale activity in quite some time.

This was mainly a fun project I undertook to get myself comfortable with how Vue, and modern frameworks in general, work.

It was the first solo project in a some time so I paid extra attention to all the aspects I have little control over in the context of bigger projects.

I worked in particular to improve the pages perfomance in the Core Web Vitals, implement different techniques to minimize the cumulative layout shift (CLS) and optimize the overall perceived loading times. The effort was rewarded by a full Lighthouse score (100 in all categories in desktop when tested in production).

I also tried to fully implement accessibility authoring practices in all components, following the WAI-ARIA official recommendations for each interactive pattern.

It was also a great opportunity to see my baselining mixins and functions in full swing: I applied the vertical rythm approach to all elements (including images, with a little js), something that I didn't have the opportunity to do in so much detail before.