This is my personal website to showcase my projects, write technical blogs using MDX, and share development resources. It's built with a modern frontend stack and designed with performance, accessibility, and scalability in mind.
Users should be able to:
- Explore a responsive personal site with light/dark mode
- Read technical blog posts powered by MDX
- View project case studies with live demos and source code
- Access a curated list of development resources
- Contact me via a validated, accessible form
- Live Site URL: https://gshukla.vercel.app
- Repository URL: https://github.com/heygauravshukla/personal-website
- Semantic JSX markup
- Mobile-first responsive design
- Next.js 15 (App Router)
- TypeScript
- Tailwind CSS
- shadcn/ui
- Motion
- MDX
- react-hook-form
- Zod
- EmailJS
- Sonner
- pnpm
- How to set up MDX in a Next.js project for blog content
- Implementing smooth page transitions using the
next-view-transitions
package - Adding micro interactions and subtle animations using Motion library
- Creating accessible forms with real-time validation using
react-hook-form
andZod
- Building reusable components with shadcn/ui and Tailwind CSS
- Structuring a scalable Next.js project using the App Router
- Add code syntax highlighting using Shiki or rehype-prism
- Introduce filtering/tag system for blog and project content
- Generate dynamic OG images for SEO
- Integrate full-featured analytics dashboard
- Automate RSS feed and sitemap
- Building a Portfolio with Next.js & Motion – Manu Arora – Helpful for animations and layout
- MDX in Next.js – Colby Fayock – Clear walkthrough on using MDX
- Next.js App Router Docs – Essential reference for the new routing system
- shadcn/ui – Component library used for UI patterns
- Squoosh – Image optimization tool
- RedKetchup - Favicon Generator
- Website – gshukla.vercel.app
- GitHub – @heygauravshukla
- Twitter – @heygauravshukla
Huge thanks to the content creators who inspired this build — especially Manu Arora and Colby Fayock.