A modern, high-performance, fully responsive developer portfolio built with Next.js App Router, TypeScript, and Tailwind CSS, showcasing my projects, skills, and experience with a strong focus on performance, accessibility, and SEO.
🌐 Live Site: https://portfolio-sand-beta-23.vercel.app
⚡ Next.js App Router (v16+)
🌙 Dark / Light Theme Toggle (Tailwind CSS v4 custom variant)
📱 Fully Responsive (Mobile & Desktop)
🎯 Scroll-based section animations
🧭 Active section highlight in navbar
📊 Vercel Analytics integration
🔍 SEO optimized (Metadata, Sitemap, Robots.txt, Open Graph)
🧪 Lighthouse scores: Performance 99, Accessibility 96, Best Practices 96, SEO 100
🧩 Reusable components & clean architecture
🗂 Dynamic project detail pages
🖼 Optional project images support
🧠 GitHub contribution graph
📄 Resume download
🔗 Social links (GitHub, LinkedIn, X, Instagram)
Framework: Next.js (App Router)
Language: TypeScript
Styling: Tailwind CSS v4
Animations: Framer Motion
Analytics: Vercel Analytics
SEO: Next.js Metadata API
Deployment: Vercel
app/
├─ layout.tsx
├─ page.tsx
├─ projects/
│ └─ [slug]/
│ └─ page.tsx
components/
├─ Navbar.tsx
├─ ProjectCard.tsx
├─ RightPanel.tsx
├─ ThemeToggle.tsx
sections/
├─ About.tsx
├─ Skills.tsx
├─ Education.tsx
├─ Contact.tsx
public/
├─ logo.svg
├─ resume.pdf
Clone the repository:
git clone https://github.com/username/portfolio.git
cd portfolio
Install dependencies:
npm install
Run the development server:
npm run dev
Open in browser:
This portfolio follows real-world best practices including optimized images using next/image, optimized fonts using next/font, reduced motion support for accessibility, clean semantic HTML, minimal JavaScript usage, and proper indexing through sitemap and robots.txt. The site achieves Lighthouse scores above 95 across all categories.
The project is deployed on Vercel with automatic CI/CD from GitHub, HTTPS enabled by default, global CDN delivery, Vercel Analytics, and production-grade performance optimizations.
I’m Chandra Pratap Singh, a Computer Applications student passionate about building modern, scalable web applications using Next.js, TypeScript, and clean frontend architecture. I enjoy turning ideas into fast, accessible, and user-friendly web experiences.
Portfolio: https://portfolio-sand-beta-23.vercel.app
LinkedIn: https://www.linkedin.com/in/chandra-pratap-singh-13a99a282/
GitHub: https://github.com/smttomar
X (Twitter): https://x.com/smttomarr
Instagram: https://instagram.com/smttomar
If you like this project, feel free to star the repository or reach out for collaboration opportunities.