# todos2 - 전략 기획안 (Strategic Plan)

> 버전: 1.0.0 | 작성일: 2026-02-10 | 상태: 기획 완료

## 1. 프로젝트 개요

**todos2**는 단순 할일 관리를 넘어, 카테고리/태그/우선순위/마감일/검색/대시보드 기능을 갖춘 확장형 할일 관리 애플리케이션이다.

### 1.1 목표
- 할일의 체계적 분류 및 관리 (카테고리, 태그, 우선순위)
- 마감일 기반 일정 관리 및 시각적 알림
- 검색 및 필터링을 통한 빠른 할일 탐색
- 대시보드를 통한 진행 현황 한눈에 파악
- 일괄 작업을 통한 효율적인 다중 할일 처리

### 1.2 대상 사용자
- 개인 할일 관리가 필요한 사용자
- 프로젝트별/카테고리별 작업 분류가 필요한 사용자

---

## 2. 핵심 기능

| # | 기능 | 설명 | 우선순위 |
|---|------|------|---------|
| 1 | 할일 CRUD | 할일 생성, 조회, 수정, 삭제 | Must |
| 2 | 카테고리 관리 | 카테고리 CRUD, 할일별 카테고리 분류 | Must |
| 3 | 태그 시스템 | 할일에 다중 태그 부여, 태그별 필터링 | Must |
| 4 | 우선순위 | 높음/중간/낮음 3단계 우선순위 설정 | Must |
| 5 | 마감일 관리 | 마감일 설정, 임박/초과 알림 표시 | Must |
| 6 | 검색 | 제목/내용/태그 기반 전문 검색 | Should |
| 7 | 대시보드 | 완료율, 카테고리별/우선순위별 통계 차트 | Should |
| 8 | 일괄 작업 | 다중 선택 후 완료/삭제/카테고리 변경 | Should |

---

## 3. 기술 스택

### 3.1 백엔드
| 기술 | 버전 | 용도 |
|------|------|------|
| Python | 3.11 | 런타임 |
| FastAPI | >= 0.104 | REST API 프레임워크 |
| Motor | >= 3.3 | MongoDB 비동기 드라이버 |
| Pydantic v2 | >= 2.5 | 데이터 검증 및 직렬화 |
| Uvicorn | >= 0.24 | ASGI 서버 |
| Redis (aioredis) | >= 2.0 | 캐싱 (대시보드 통계) |

### 3.2 프론트엔드
| 기술 | 버전 | 용도 |
|------|------|------|
| Next.js | 15 (App Router) | React 프레임워크 |
| TypeScript | 5.x | 타입 안정성 |
| Tailwind CSS | 4.x | 유틸리티 기반 스타일링 |
| shadcn/ui | latest | UI 컴포넌트 라이브러리 |
| Recharts | 2.x | 대시보드 차트 |
| Tanstack Query | 5.x | 서버 상태 관리 및 캐싱 |
| Zustand | 5.x | 클라이언트 상태 관리 |

### 3.3 인프라
| 기술 | 용도 |
|------|------|
| MongoDB 7.0 | 메인 데이터베이스 |
| Redis 7 | 캐싱 레이어 |
| Docker Compose | 로컬 개발 환경 |

---

## 4. 프로젝트 구조

```
todos2/
├── docker-compose.yml
├── CLAUDE.md
├── PLAN.md
├── FEATURE_SPEC.md
├── SCREEN_DESIGN.pptx
├── SCREEN_DESIGN.md
│
├── backend/
│   ├── Dockerfile
│   ├── requirements.txt
│   └── app/
│       ├── __init__.py
│       ├── main.py              # FastAPI 앱 진입점
│       ├── database.py          # MongoDB 연결 설정
│       ├── models/
│       │   ├── __init__.py
│       │   ├── todo.py          # Todo 모델
│       │   ├── category.py      # Category 모델
│       │   └── tag.py           # Tag 모델
│       ├── routers/
│       │   ├── __init__.py
│       │   ├── todos.py         # 할일 CRUD API
│       │   ├── categories.py    # 카테고리 API
│       │   ├── tags.py          # 태그 API
│       │   ├── search.py        # 검색 API
│       │   ├── dashboard.py     # 대시보드 통계 API
│       │   └── batch.py         # 일괄 작업 API
│       └── services/
│           ├── __init__.py
│           ├── todo_service.py
│           ├── category_service.py
│           ├── tag_service.py
│           ├── search_service.py
│           └── dashboard_service.py
│
└── frontend/
    ├── Dockerfile
    ├── package.json
    ├── next.config.ts
    ├── tailwind.config.ts
    ├── tsconfig.json
    └── src/
        ├── app/
        │   ├── layout.tsx           # 루트 레이아웃
        │   ├── page.tsx             # 대시보드 (메인)
        │   ├── todos/
        │   │   └── page.tsx         # 할일 목록
        │   ├── categories/
        │   │   └── page.tsx         # 카테고리 관리
        │   └── search/
        │       └── page.tsx         # 검색 결과
        ├── components/
        │   ├── layout/
        │   │   ├── Header.tsx
        │   │   ├── Sidebar.tsx
        │   │   └── MainLayout.tsx
        │   ├── todos/
        │   │   ├── TodoCard.tsx
        │   │   ├── TodoForm.tsx
        │   │   ├── TodoList.tsx
        │   │   ├── TodoFilter.tsx
        │   │   └── BatchActions.tsx
        │   ├── categories/
        │   │   ├── CategoryList.tsx
        │   │   └── CategoryForm.tsx
        │   ├── tags/
        │   │   ├── TagBadge.tsx
        │   │   ├── TagSelect.tsx
        │   │   └── TagManager.tsx
        │   ├── dashboard/
        │   │   ├── StatsCards.tsx
        │   │   ├── CompletionChart.tsx
        │   │   ├── CategoryChart.tsx
        │   │   └── PriorityChart.tsx
        │   └── search/
        │       ├── SearchBar.tsx
        │       └── SearchResults.tsx
        ├── hooks/
        │   ├── useTodos.ts
        │   ├── useCategories.ts
        │   ├── useTags.ts
        │   ├── useDashboard.ts
        │   └── useSearch.ts
        ├── lib/
        │   ├── api.ts               # API 클라이언트
        │   └── utils.ts             # 유틸리티 함수
        ├── store/
        │   └── uiStore.ts           # UI 상태 (사이드바, 필터 등)
        └── types/
            └── index.ts             # TypeScript 타입 정의
```

---

## 5. 데이터 모델

### 5.1 Todo
```json
{
  "_id": "ObjectId",
  "title": "string (필수, 1~200자)",
  "content": "string (선택, 최대 2000자)",
  "completed": "boolean (기본: false)",
  "priority": "enum: high | medium | low (기본: medium)",
  "category_id": "ObjectId | null",
  "tags": ["string"],
  "due_date": "datetime | null",
  "created_at": "datetime",
  "updated_at": "datetime"
}
```

### 5.2 Category
```json
{
  "_id": "ObjectId",
  "name": "string (필수, 1~50자, 고유)",
  "color": "string (hex color, 기본: #6B7280)",
  "order": "integer (정렬 순서)",
  "created_at": "datetime"
}
```

### 5.3 Tag (인라인)
태그는 별도 컬렉션 없이 Todo 문서 내 배열로 관리한다.
태그 목록은 todos 컬렉션에서 distinct 쿼리로 추출한다.

---

## 6. 개발 우선순위 (Phase별)

### Phase 1: 핵심 기반 (MVP)
> 목표: 기본 할일 관리가 가능한 최소 기능 제품

1. 프로젝트 초기 세팅 (백엔드/프론트엔드 스캐폴딩)
2. MongoDB 연결 및 데이터 모델 정의
3. 할일 CRUD API + UI
4. 카테고리 CRUD API + UI
5. 기본 레이아웃 (Header, Sidebar, MainLayout)

### Phase 2: 확장 기능
> 목표: 분류/필터/우선순위로 할일 관리 고도화

6. 태그 시스템 (태그 입력, 표시, 필터링)
7. 우선순위 설정 (높음/중간/낮음)
8. 마감일 설정 및 임박/초과 알림 UI
9. 검색 기능 (제목/내용/태그)

### Phase 3: 분석 및 효율
> 목표: 통계 및 일괄 작업으로 생산성 향상

10. 대시보드 통계 API
11. 대시보드 차트 UI (완료율, 카테고리별, 우선순위별)
12. 일괄 작업 (다중 선택, 일괄 완료/삭제/카테고리 변경)

---

## 7. API 설계 요약

| Method | Endpoint | 설명 |
|--------|----------|------|
| GET | `/api/todos` | 할일 목록 (필터/페이지네이션) |
| POST | `/api/todos` | 할일 생성 |
| GET | `/api/todos/{id}` | 할일 상세 |
| PUT | `/api/todos/{id}` | 할일 수정 |
| DELETE | `/api/todos/{id}` | 할일 삭제 |
| POST | `/api/todos/batch` | 일괄 작업 |
| GET | `/api/categories` | 카테고리 목록 |
| POST | `/api/categories` | 카테고리 생성 |
| PUT | `/api/categories/{id}` | 카테고리 수정 |
| DELETE | `/api/categories/{id}` | 카테고리 삭제 |
| GET | `/api/tags` | 사용 중인 태그 목록 |
| GET | `/api/search` | 검색 |
| GET | `/api/dashboard/stats` | 대시보드 통계 |

---

## 8. 비기능 요구사항

| 항목 | 기준 |
|------|------|
| API 응답 시간 | 95% 요청 200ms 이내 |
| 페이지네이션 | 기본 20건, 최대 100건 |
| 검색 | MongoDB text index 활용 |
| 캐싱 | 대시보드 통계 Redis 캐시 (TTL 60초) |
| CORS | 프론트엔드 도메인 허용 |
| 에러 처리 | 표준 HTTP 상태 코드 + JSON 에러 응답 |