Files: - STACK.md - FEATURES.md - ARCHITECTURE.md - PITFALLS.md - SUMMARY.md Key findings: - Stack: React, Node.js, PostgreSQL, Prisma - Architecture: Layered with clear component boundaries - Critical pitfall: Inconsistent calendar sync behavior
76 lines
3.0 KiB
Markdown
76 lines
3.0 KiB
Markdown
# Technology Stack
|
|
|
|
**Project:** Weekly Task Management App
|
|
**Researched:** January 24, 2026
|
|
|
|
## Recommended Stack
|
|
|
|
### Core Framework
|
|
| Technology | Version | Purpose | Why |
|
|
|------------|---------|---------|-----|
|
|
| React | 18.x | Frontend UI framework | Component-based architecture, strong ecosystem, excellent for UI-heavy applications |
|
|
| Node.js | 18.x | Backend runtime | Mature ecosystem, good performance, large community support |
|
|
| Express.js | 4.x | Web framework | Lightweight, flexible API development, widely adopted |
|
|
|
|
### Database
|
|
| Technology | Version | Purpose | Why |
|
|
|------------|---------|---------|-----|
|
|
| PostgreSQL | 14+ | Relational database | ACID compliance, strong data integrity, excellent for structured data like tasks |
|
|
| Prisma | 5.x | ORM | Type-safe database access, migration management, reduces boilerplate |
|
|
|
|
### Infrastructure
|
|
| Technology | Version | Purpose | Why |
|
|
|------------|---------|---------|-----|
|
|
| Vercel | Latest | Deployment platform | Seamless React deployment, automatic CI/CD, global CDN |
|
|
| Supabase | Latest | Backend-as-a-Service | Provides auth, storage, and database as managed services |
|
|
| GitHub Actions | Latest | CI/CD pipeline | Integrated with GitHub, reliable deployment automation |
|
|
|
|
### Supporting Libraries
|
|
| Library | Version | Purpose | When to Use |
|
|
|---------|---------|---------|-------------|
|
|
| Zustand | 4.x | State management | For global state like user preferences and task data |
|
|
| React Query | 5.x | Data fetching | For server state management and API data synchronization |
|
|
| Tailwind CSS | 3.x | Styling framework | Rapid UI development with utility-first approach |
|
|
| date-fns | 2.x | Date manipulation | Lightweight, functional date utilities |
|
|
| react-beautiful-dnd | 14.x | Drag-and-drop | Excellent for implementing drag-and-drop functionality |
|
|
|
|
## Alternatives Considered
|
|
|
|
| Category | Recommended | Alternative | Why Not |
|
|
|----------|-------------|-------------|---------|
|
|
| Frontend Framework | React | Vue.js | While Vue is great, React has stronger ecosystem and community support for this type of application |
|
|
| Database | PostgreSQL | MongoDB | MongoDB is document-based and less suitable for structured relational data like task relationships |
|
|
| Backend Framework | Express.js | NestJS | NestJS adds overhead for this application's simpler requirements |
|
|
| State Management | Zustand | Redux | Redux has more boilerplate and complexity for a single-user task manager |
|
|
|
|
## Installation
|
|
|
|
```bash
|
|
# Core
|
|
npm install react react-dom react-router-dom
|
|
npm install @tanstack/react-query zustand
|
|
|
|
# Backend
|
|
npm install express cors helmet morgan
|
|
|
|
# Database
|
|
npm install prisma @prisma/client
|
|
npx prisma init
|
|
|
|
# Styling
|
|
npm install tailwindcss postcss autoprefixer
|
|
npx tailwindcss init -p
|
|
|
|
# Date handling
|
|
npm install date-fns
|
|
|
|
# Drag and drop
|
|
npm install react-beautiful-dnd
|
|
```
|
|
|
|
## Sources
|
|
|
|
- Current web development trends and best practices (2025)
|
|
- Popular task management application technologies
|
|
- Developer survey results on preferred frameworks and tools
|
|
- Technical documentation for recommended libraries |