
Irfan Portfolio – Next.js + MongoDB Full Stack Web + Mobile
Complete documentation for the Irfan Portfolio project built using Next.js and MongoDB and Flutter
Live Demo
️ Live Screenshots
Click images to preview full size
Mobile View
Project Overview
This is a portfolio website built using Next.js and MongoDB. It includes a full-featured admin panel to manage content dynamically, including sections like About, Skills, Projects, and more.
️ Tech Stack
- Frontend: Next.js 15.1.6, React 19.0.0, TailwindCSS, Shadcn UI / Radix UI, Framer Motion, Dark/Light Theme (next-themes)
- Backend: MongoDB + Mongoose, JWT Authentication, bcryptjs for password hashing, Next.js API Routes
️ Project Structure
- /app: App Router pages
- /components: Shared React components
- /contexts: React Contexts
- /data: Static site data
- /hooks: Custom hooks
- /lib: Utility logic
- /models: Mongoose models
- /public: Static assets
- /types: TypeScript types
Security
- JWT token-based access control
- Hashed passwords with bcrypt
- Protected routes for admin-only actions
Admin Panel
- Admin authentication with JWT
- Dashboard with summary
- Add/Edit/Delete functionality for all sections
- Theme & Profile management






