Portfolio Website '21

Overview

This was my previous personal portfolio website, built from scratch using Gatsby.js, GraphQL, and Bootstrap. The website was created to introduce myself, showcase my projects, and document my work and experience.

A significant focus of the project was web performance and SEO. I optimized the website structure, metadata, and implementation with search engine visibility and Lighthouse performance in mind. The site achieved a 90+ Lighthouse SEO score.

This project is now archived as my previous portfolio website. It has since been replaced by my current portfolio website, with a completely new architecture and design.

Technical approach

I built the website with:

• Gatsby.js for the static site and page generation
• GraphQL for querying project and content data
• Bootstrap for responsive layouts and styling
• Parallax effects to experiment with interactive scrolling
• SEO-friendly metadata, page structure, and URLs
• Netlify for deployment

Preview

Lessons learned

It was a lot of fun building this website. It gave me hands-on experience with building and maintaining a complete portfolio using Gatsby.js. I also learned how much SEO, accessibility, performance, responsive design, and content structure matter when building a website for real users. It ended up becoming the foundation for the portfolio I built later, which eventually replaced this version.