Redesigning My Website
Updated on 2022-09-18
I recently rewrote my website using Gatsby, a static site generator that lets you build component-based websites and write pages in Markdown. I remade my website because I wanted to try my hand at blogging and to make maintaining and updating my website easier.
Before Redesign
I built my previous website with plain HTML, CSS, and a little JavaScript for animating in-page navigation. It had two pages; home and projects, external links to LinkedIn and GitHub, a few paragraphs about myself, an online resume, and some icons to make it look less boring.
However, I didn't update it for over a year because it wasn't fun. I had two pages repeating the same code because I didn't have a templating system. If I wanted to add a project, I would need to add additional code to both pages; It was a hassle to maintain and update.
The landing page of my old website The experience section of my old websiteRedesigning My Website
The new website is brightly colored compared to the previous one, which was very dark, and uses various shades of teal as the primary color. I used Tailwind CSS to style it, which works wonderfully with React components.
It has two main pages: home and blog. It also has external links, a resume, and an about section like the previous website. MDX is used to create blog post pages, which lets me write React JSX in Markdown content.
I've finished version 1 of the website. But I have plans to add a few things, such as a Table of Contents on blog post pages, a button for toggling between light and dark themes, and some animation for a more pleasant user experience.
The landing page of my new website The projects section of my new website