Fullstack task list application with a REST API in NestJS and a Next.js interface.
Backend
- NestJS — Node.js framework in TypeScript
- Prisma — ORM with automatic typing
- SQLite — local database (PostgreSQL in production)
- Zod + nestjs-zod — DTO validation
Frontend
- Next.js — React framework with App Router
- Tailwind CSS v4 — utility-first CSS with dark mode
- TanStack Query v5 — server cache and synchronization
- React Hook Form + Zod — forms with validation
- Zustand — UI state management
- next-themes — dark/light theme without flash
- Create, edit, and delete tasks
- Mark tasks as completed / pending
- Filter by status (all, pending, completed)
- Dark/light theme with persistence
- Responsive layout
to-do-project/
├── backend/ # NestJS API
└── frontend/ # Next.js App
Backend
cd backend
cp .env.example .env
npm install
npx prisma migrate dev
npm run start:devFrontend
cd frontend
cp .env.example .env.local
npm install
npm run devEnvironment Variables
backend/.env
DATABASE_URL="file:./dev.db"
PORT=3001
ALLOWED_ORIGIN=http://localhost:3000frontend/.env.local
NEXT_PUBLIC_API_URL=http://localhost:3001Base URL: http://localhost:3001
| Method | Route | Description |
|---|---|---|
| GET | /tasks | List tasks |
| GET | /tasks/:id | Get task by id |
| POST | /tasks | Create task |
| PATCH | /tasks/:id | Update task |
| DELETE | /tasks/:id | Delete task |
GET /tasks accepts query param completed=true or completed=false to filter.