# 📱 Todo Project

**메모 → 수신함 → Todo 관리**의 간단하고 직관적인 워크플로우

## 🎯 핵심 워크플로우

```
📝 메모 작성 → 📥 수신함 확인 → ✅ Todo 변환 → 📋 Todo 관리
```

### 3개 페이지로 완성되는 심플한 구조:
1. **📝 새 메모** (`/upload.html`) - 빠른 메모 작성
2. **📥 수신함** (`/inbox.html`) - 메모 확인 & Todo 변환  
3. **📋 Todo 목록** (`/todo-list.html`) - 오늘 할 일 관리

## ✨ 주요 기능

- 🖊️ **빠른 메모 작성**: 텍스트 + 이미지 (최대 5장)
- 📅 **시작일 기반 Todo**: 해야 할 시점이 된 Todo만 표시
- 🏷️ **스마트 상태 관리**: 오늘 시작 / 진행 중 자동 구분
- 📱 **모바일 최적화**: 카메라/갤러리 업로드 지원
- 🔄 **지연 관리**: +3일, +5일, 날짜 선택 연장
- 🎨 **빈티지 UI**: 양피지 테마의 아름다운 인터페이스

## 🚀 빠른 시작

```bash
# 프로젝트 클론
git clone https://git.hyungi.net/hyungi/Todo-Project.git
cd Todo-Project

# Docker로 실행
docker-compose up -d

# 접속
open http://localhost:4000
```

**기본 계정**: `hyungi` / `admin`

## 🏗️ 기술 스택

### Frontend
- **HTML5/CSS3/JavaScript**: 바닐라 JS로 가벼운 구현
- **Tailwind CSS**: 빠른 스타일링
- **PWA**: 홈화면 추가 지원
- **Nginx**: 정적 파일 서빙 & API 프록시

### Backend  
- **FastAPI**: 고성능 Python API
- **SQLAlchemy**: 비동기 ORM
- **PostgreSQL**: 안정적인 데이터베이스
- **Pydantic**: 데이터 검증

### Infrastructure
- **Docker Compose**: 컨테이너 오케스트레이션
- **Nginx**: 리버스 프록시
- **Volume**: 데이터 영속성

## 📊 데이터베이스 구조

### 📋 todos 테이블
```sql
Column       | Type                     | 설명
-------------|--------------------------|------------------
id           | uuid                     | 고유 ID
user_id      | uuid                     | 사용자 ID
title        | varchar(200)             | 제목 (메모는 선택사항)
description  | text                     | 내용 (필수)
category     | enum                     | MEMO | TODO
status       | enum                     | pending | completed
start_date   | timestamp                | Todo 시작일
image_urls   | text                     | 이미지 URLs (JSON)
created_at   | timestamp                | 생성일
updated_at   | timestamp                | 수정일
completed_at | timestamp                | 완료일
```

### 🚀 성능 최적화 인덱스
- `idx_todos_workflow`: 복합 워크플로우 조회 최적화
- `idx_todos_start_date`: 시작일 기준 조회
- `idx_todos_category_status`: 카테고리별 상태 조회

## 🔄 API 엔드포인트

### 인증
- `POST /api/auth/login` - 로그인
- `GET /api/auth/me` - 사용자 정보

### Todo/메모 관리
- `POST /api/todos` - 메모/Todo 생성
- `GET /api/todos?category=memo` - 메모 목록 (수신함)
- `GET /api/todos?category=todo` - Todo 목록
- `PUT /api/todos/{id}` - Todo 수정 (카테고리 변환, 상태 변경)
- `POST /api/todos/upload-image` - 이미지 업로드

## 📱 모바일 지원

### PWA 기능
- 홈화면 추가 가능
- 오프라인 지원 (예정)
- 푸시 알림 (예정)

### 모바일 최적화
- 터치 친화적 UI
- 카메라/갤러리 접근
- 키보드 대응 스크롤
- 이미지 자동 압축

## 🎨 UI/UX 특징

### 빈티지 양피지 테마
- 따뜻한 세피아 색상
- 손글씨 느낌의 폰트
- 그림자와 테두리 효과
- 직관적인 아이콘

### 반응형 디자인
- 데스크톱: 넓은 레이아웃
- 모바일: 세로 최적화
- 터치 제스처 지원

## 🔧 개발 환경 설정

### 로컬 개발
```bash
# 백엔드 개발
cd backend
pip install -e .
uvicorn src.main:app --reload --port 9000

# 프론트엔드 개발  
cd frontend
python -m http.server 8000
```

### 환경 변수
```env
# 데이터베이스
DATABASE_URL=postgresql+asyncpg://todo_user:todo_password@localhost:5432/todo_db

# JWT 설정
SECRET_KEY=your-secret-key
ACCESS_TOKEN_EXPIRE_MINUTES=30

# 파일 업로드
UPLOAD_DIR=/data/uploads
MAX_FILE_SIZE=5242880  # 5MB
```

## 📈 성능 최적화

### 데이터베이스
- 복합 인덱스로 쿼리 최적화
- 카테고리별 분리로 효율적 조회
- 이미지 URL JSON 저장으로 정규화 최소화

### 프론트엔드
- 바닐라 JS로 번들 크기 최소화
- 이미지 클라이언트 압축
- 불필요한 로깅 제거
- Nginx 정적 파일 캐싱

## 🚀 배포

### Docker Compose (권장)
```bash
docker-compose up -d
```

### 시놀로지 NAS
자세한 설치 가이드: [SYNOLOGY_INSTALL.md](SYNOLOGY_INSTALL.md)

## 📖 추가 문서

- [📚 종합 개발 가이드](COMPREHENSIVE_GUIDE.md) - 상세한 개발 가이드
- [🏠 시놀로지 설치](SYNOLOGY_INSTALL.md) - NAS 설치 방법

## 🤝 기여하기

1. Fork the Project
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the Branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request

## 📄 라이선스

이 프로젝트는 MIT 라이선스 하에 배포됩니다.

## 📞 문의

프로젝트 링크: [https://git.hyungi.net/hyungi/Todo-Project](https://git.hyungi.net/hyungi/Todo-Project)