Web App
Portfolio Application
Stack: Next.js 16, React 19, TypeScript, Tailwind CSS 4, PostgreSQL (Drizzle ORM)
Project details
What It Is
A portfolio site with an admin dashboard for managing content, projects, skills, reviews, and contact messages. Built for developers and creatives who want a modern, secure, and editable portfolio.
Main Features
Public site
- Hero, About, Skills, Expertise, Projects, Reviews, Contact
- Responsive layout with animations (GSAP, Lenis)
- Optional 3D scene (Three.js/React Three Fiber)
- Contact form with email notifications
- PWA support (service worker, offline page)
- Maintenance mode (admins can still access)
Admin panel
- Credentials-based login (NextAuth v5)
- Content management (sections, copy)
- Projects (CRUD, categories, featured)
- Skills (proficiency, colors)
- Expertise (ordered list)
- Reviews (approve/reject)
- Messages (contact form submissions)
- Users (admin accounts)
- Settings (maintenance mode, brand)
- Performance metrics
Tech Stack
LayerTechnologyFrameworkNext.js 16 (App Router, Turbopack)UIReact 19, Tailwind CSS 4, Radix UI, shadcnDatabasePostgreSQL via Drizzle ORMAuthNextAuth v5 (Credentials)CacheRedis (Upstash) for rate limiting and optional cachingEmailNodemailer (SMTP)AnimationsGSAP, Lenis3DThree.js, React Three FiberSecurity
- Role-based access (admin)
- Rate limiting (contact, reviews, admin)
- Input validation (Zod)
- CSRF protection
- Security headers (CSP, HSTS, X-Frame-Options)
- bcrypt password hashing
- Session validation against DB
Gallery
