The Beginning: HTML, CSS, and JavaScript

My journey into web development began during the unprecedented times of the COVID-19 pandemic. Like millions of people around the world, I had found myself with time to kill and a desire to learn something new. And I had seen some of my friends in college build impressive projects in the prior semesters. Web-dev was the term that I had heard thrown around in my circles and beyond during those days. That's when I decided I want to explore the web-dev side of the world.

The Basics

I had heard of web development framework(s), well just React, in college and what they are supposed to do. But upon looking online, I started with the holy trinity of web development: HTML, CSS, and JavaScript. These three technologies form the foundation of any website, and I was eager to master them. Although I had some prior knowledge of HTML, which I had learnt in school and I knew what CSS does at a high level, I would say I was a total noob.

My First Personal Website

Armed with these new skills, I created my first personal website. I followed a video series of building a personal portfolio in vanilla HTML-CSS-Javascript and I cannot seem to find it now. It was a long drawn out video series which I followed for many days, encountering so many errors, learning and falling in love with CSS, which to this day is true.

I remember the sense of accomplishment I felt when I first saw my name and a brief bio displayed on a webpage I had created from scratch.

I had also deployed the website on Netlify which one of my senior had suggested. I barely understood the concept of deploying a website, but at least I knew, if I type an address, it takes me to my own site. And as of today, October 10th, 2024, it is still up at https://advait-l.netlify.app. Thanks to Netlify for keeping an unmaintained project up for so many years. Looking back at it, it still does look very good and I am impressed by my past self.

Fast Forward to 2024

As my skills grew and web technologies evolved, I found myself drawn to more advanced frameworks and libraries. This brings us to the present day, where I'm rebuilding my personal website using Next.js. I have experience in using React, Angular and Next for building web development projects and I chose Next for building my own website.

Why Next.js?

Next.js, a React framework, offers several advantages that make it perfect for a personal website:

Server-Side Rendering (SSR): This improves the initial load time and is great for SEO.
Static Site Generation (SSG): Perfect for a portfolio site with content that doesn't change frequently.
Built-in Routing: Simplifies navigation between pages.
API Routes: Allows for easy backend functionality if needed.

The Rebuild Process

Rebuilding my website with Next.js has been an exciting journey. I took inspiration from this particular starter NextJS blog template and build further on top of that. It comes out of the box with the following features and more :

A blog section with markdown support
A projects showcase with dynamic routing
Optimized images and fonts for better performance
Dark mode toggle with persistent user preference

Reflection

Looking back, it's amazing to see how far I've come. From those first lines of HTML during lockdown to now working with a powerful framework like Next.js, each step has been a learning experience.

Building and continuously improving my personal website has not only been a great way to showcase my skills but also a constant source of learning. It's a living project that grows with me as I continue my journey in web development.

As we move further into 2024, I'm excited to see what new technologies and techniques I'll be able to incorporate into my site. The world of web development is ever-evolving, and I'm thrilled to be part of it.