Personal Website

Overview

This is my personal portfolio and blog website, built with Next.js and TypeScript. The site allows me to showcase my projects, post technical blogs, and share my work with the world. It includes a Projects section for my portfolio items and a Posts section for my blogs.

The site is hosted on Vercel for seamless deployment and fast performance, with Cloudflare providing security, caching, and reliability.

Project Screenshot

Project Goals

The main goal of this project was to create a simple, modern, and responsive personal portfolio and blog site. I wanted a platform to share my projects and document my learning journey.

Tech Stack

This project was built using Next.js, TypeScript and Tailwind CSS.

Learning and Takeaways

Through this project, I gained practical experience in building a modern web application using Next.js, TypeScript, and Tailwind CSS. I learned how to work with MDX files to dynamically write, structure, and render blog content, which enabled flexible and interactive posts within Next.js. Implementing SEO best practices, including meta tags, Open Graph data, and structured content, taught me how to enhance both search engine visibility and social sharing.

I also learned to integrate Giscus to leverage GitHub Discussions as a commenting system, allowing visitors to leave comments that sync with a GitHub repository. Using Tailwind CSS, I developed a responsive, clean, and visually consistent design, gaining insight into rapid styling and layout management.

On the security front, integrating Cloudflare Turnstile showed me how to protect forms from bots without compromising user experience. Additionally, implementing Resend for email management helped me understand how to reliably handle form submissions and communications.