BugPocket is a mini SaaS-style bug tracking application built with Next.js full-stack concepts. Users authenticate, report bugs, manage severity and status, and track issues from a dashboard and personal library.
Built for the Next.js Full Stack Project – Web Dev Cohort 2026.
Users can:
- Create bug reports with reproduction steps, severity, environment, snippets, and solutions
- Track bug severity and status
- View and manage bugs in a library
- Authenticate securely with JWT HttpOnly cookies
Demonstrates:
- File-based App Router + route groups
- Layouts
- API Route Handlers
- Server Actions
- Prisma + PostgreSQL (Neon)
- SSR for protected pages
- Full CRUD
Frontend: Next.js 16, React, TypeScript, Tailwind CSS, React Hook Form, Zod, shadcn/ui
Backend: Next.js Route Handlers, Server Actions, JWT auth
Database: Prisma ORM, PostgreSQL / Neon
Deploy: Vercel
- Signup / login
- JWT access + refresh tokens
- HttpOnly cookies
- Protected routes (
proxy.ts) - Logout
- Create, view, update, delete
- Severity: LOW · MEDIUM · HIGH · CRITICAL
- Status: OPEN · IN_PROGRESS · RESOLVED · CLOSED
- Total / open / critical stats
- Recent bugs
- Full bug listing and detail editing
- Profile summary
| Path | Description |
|---|---|
/ |
Landing |
/login |
Login |
/signin |
Redirects to /login |
/signup |
Signup |
/about |
About |
| Path | Description |
|---|---|
/dashboard |
Stats + recent bugs |
/library |
Bug list |
/library/new |
Create bug |
/library/[id] |
View / update / delete |
/profile |
Account summary |
List bugs for the authenticated user.
Create a bug (JSON body matching create schema).
Fetch one bug owned by the user.
Update fields (title, status, severity, etc.).
Delete a bug owned by the user.
All bug API routes require the accessToken cookie.
bun install # or npm install
cp .env.example .env # set DATABASE_URL and JWT_SECRET_KEY
bunx prisma migrate deploy
bunx prisma generate
bun run dev