This portfolio showcases my projects, technical articles written in MDX, and curated development resources. It's designed with a focus on performance, accessibility, and scalability.
Users should be able to:
- Explore the site with light/dark mode
- Read technical articles powered by MDX
- Browse a curated list of development bookmarks
- Contact me via a validated, accessible form
- Live Site URL: https://gshukla.vercel.app
- Repository URL: https://github.com/heygauravshukla/portfolio
- 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 content
- Implementing smooth page transitions using the
next-view-transitionspackage - Adding micro-interactions and subtle animations using the Motion library
- Creating accessible forms with real-time validation using
react-hook-formandZod - Building reusable components with shadcn/ui and Tailwind CSS
- Structuring a scalable Next.js project using the App Router
- Add code syntax highlighting
- Generate dynamic OG images for SEO
- Automate RSS feed and sitemap
- MDX in Next.js – A YouTube video by Colby Fayock – Clear walkthrough on using MDX
- Inter font GitHub repo – Resource to download Inter font
- IBM Plex font GitHub repo – Resource to download IBM Plex fonts
- shadcn/ui – Component library used for UI patterns
- tweakcn – Helpful for customizing the shadcn/ui theme
- Squoosh – Image optimization tool
- RedKetchup – Favicon Generator
- Website – gshukla.vercel.app
- GitHub – @heygauravshukla
- Twitter – @heygauravshukla
The GitHub repository of Tailwind CSS docs helped me a lot to get insights into how to self-host fonts, and their Spotlight template was the first inspiration for building this site.