diff --git a/.cline-context.md b/.cline-context.md new file mode 100644 index 0000000..fc2e681 --- /dev/null +++ b/.cline-context.md @@ -0,0 +1,38 @@ +# Project Current Status & Rules + +- **Objective:** Maintain, review, and enhance the CheckFlow self-hosted TickTick-style task management web application according to specifications in `AGENTS.md`, ensuring full feature integrity, security compliance, clean code quality, and responsive UX across all devices. + +- **Core Architecture & Source Structure:** + - `src/app/`: Next.js App Router root layouts, providers, auth/demo/admin views, and REST/CalDAV API endpoints (`/api/tasks`, `/api/lists`, `/api/import`, `/api/dav/[...path]`). + - `src/components/layout/`: `AppShell.tsx` (3-panel main layout, resizer coordination, mobile drawer overlay), `Sidebar.tsx` (draggable resizer, lists tree, tag & trash navigation, profile & import popover). + - `src/components/tasks/`: + - `TaskList.tsx`: Recursive n-depth hierarchical checklist, inline title editing, context menu, smart quick-add toolbar. + - `TaskDetail.tsx`: Right-side detail panel, modular block swap (Subtasks ⇄ Markdown Note), mouse drag split resizer, mobile bottom-sheet with swipe-down dismissal. + - `MarkdownNoteEditor.tsx`: Distraction-free text/markdown note canvas with DOMPurify sanitization & preview rendering. + - `KanbanView.tsx`: CheckFlow Labs 3-column Kanban board view (`To Do` / `In Progress` / `Done`). + - `src/components/settings/`: `SettingsModal.tsx` (Profile, Preferences, Labs, Integrations/DAVx⁵, Admin tabs). + - `src/lib/`: `userPrefs.ts` (global user customization state store), `useUserPrefs.ts` (reactive preferences hook & CSS variable injector), `i18n/` (EN/KO/JA localization dictionary), `mockData.ts` (LocalStorage demo store), `auth.ts`, `prisma.ts`. + - `src/middleware.ts`: Route-level auth and admin role verification guard. + +- **Completed So Far:** + - Conducted full audit of codebase against all specification items in `AGENTS.md`. + - Verified 100% implementation of core features: n-depth recursive checklist, real-time subtask synchronization, modular blocks & split resizer, 3-way theme (VSCode dark / pastel light / system), global `UserPrefs` customization, Labs Kanban view, and mobile bottom sheet. + - Enhanced CalDAV / DAVx⁵ synchronization endpoint (`src/app/api/dav/[...path]/route.ts`) with full RFC 4791 support: `OPTIONS`, `PROPFIND` (principal & calendar collection discovery), `REPORT` (calendar-query/multiget), `PUT` (task upsert from VTODO), and `DELETE`. + - Upgraded Settings Modal "Integrations (CalDAV)" tab with multi-platform interactive guides (Android/DAVx⁵, Apple Reminders, Thunderbird), one-click URL copy feedback, ICS feed direct download, and live endpoint test ping. + - Implemented full-fidelity standard Task Export pair (`/api/export`) supporting RFC 4180 / TickTick-compatible CSV with UTF-8 BOM, and RFC 5545 iCalendar (`.ics` VTODO) format. + - Added Export modal in Sidebar user popover menu supporting format selection, target list filtering, completed tasks inclusion toggle, and seamless Demo mode client-side Blob generation. + - Added localized i18n strings for Export across English, Korean, and Japanese. + - Validated that `npm run lint` and `npm run build` execute with 0 errors and 0 warnings. + +- **Next Steps (Todo):** + - Enhance keyboard accessibility & global shortcuts (shortcuts for switching list/kanban view, quick task navigation, Command Palette bindings). + - Add optional automatic synchronization background polling / webhook integration if requested. + - Plan next feature iterations or custom integrations as requested by user. + +- **Caveats & Absolute Rules:** + - **Security & Multi-user Privacy**: All API endpoints must strictly verify session ownership (`userId === session.user.id`) and list ownership before creating/updating/deleting tasks or lists. + - **Sanitization**: Never render raw HTML without DOMPurify; always sanitize CSV/ICS user inputs against formula injection (`sanitizeFormula`). + - **Admin Gatekeeping**: Admin routes must strictly require `role === "ADMIN"` both on server/middleware and client. + - **User Customization Priority**: Any new UI preferences (sizes, positions, order) must be persisted through `userPrefs.ts` and respect the "Reset to Defaults" Labs option. + - **i18n Consistency**: Any newly added UI string must be translated across all 3 language dictionaries (`en`, `ko`, `ja`) in `src/lib/i18n/translations.ts` and `src/lib/i18n/index.tsx`. + - **Mobile Bottom-Sheet Convention**: Maintain touch gestures (`mobile-open` class, Y-axis swipe threshold > 120px) for the detail panel on mobile screens. diff --git a/.clinerules b/.clinerules new file mode 100644 index 0000000..b2e057d --- /dev/null +++ b/.clinerules @@ -0,0 +1,5 @@ +[CRITICAL INSTRUCTION] +You are operating under strict context window pressure, and older chat history may be truncated. +Therefore, before starting a new task or making critical decisions, always read the `.cline-context.md` file in the project root to verify the latest status and rules. +Whenever a sub-task is completed or significant structural changes occur, you MUST update the 'Next Steps (Todo)' and 'Project Current Status' sections in `.cline-context.md` to preserve your memory. +Keep the content of `.cline-context.md` clear, concise, and written in English. diff --git a/.gitignore b/.gitignore index 9e27288..624279d 100644 --- a/.gitignore +++ b/.gitignore @@ -15,4 +15,5 @@ out/ # misc .DS_Store *.pem -npm-debug.log* \ No newline at end of file +npm-debug.log* +chamgojaryo/ diff --git a/AGENTS.md b/AGENTS.md index e0c6d48..b4b7824 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -10,18 +10,25 @@ 사용자의 핵심 요구사항: 1. **TickTick 스타일 To-Do 리스트 독립 웹앱**: - 체크리스트는 **메인 - 하위(Sub-task)** N단계 계층 구조를 갖추며, 양쪽 패널 간 1:1 실시간 동기화. - - **적응형(Adaptive) 와이드 메모장**: 우측 패널의 대부분을 메모장이 차지하며, 마크다운이 GUI로 렌더링됨. - - **인라인 즉시 수정 UX**: 프로젝트 제목 및 태스크 제목을 클릭으로 즉시 수정 가능. + - **적응형(Adaptive) 와이드 메모장**: 우측 패널의 대부분을 메모장이 차지하며, 작성한 마크다운이 실제 웹 문서처럼 미려한 GUI 형태로 렌더링(Preview & 안전한 새 탭 링크 지원). + - **인라인 즉시 수정 UX**: 상단 프로젝트 제목 및 태스크 제목을 더블클릭/클릭으로 즉시 수정 가능 (Enter 저장, ESC 취소). 2. **셀프호스팅 & 프라이버시 중심 멀티유저**: - - SNS 형태가 아닌 개인별 프라이버시가 완벽히 보장되는 독립 멀티유저 플랫폼. + - 개인별 프라이버시가 완벽히 보장되는 독립 멀티유저 플랫폼. - Docker 배포 지원 (PostgreSQL 16 포함, Dockerfile & docker-compose.yml 완비). -3. **외부 플랫폼 연동 & Import**: - - TickTick CSV/ICS Import 지원 (프로필 메뉴 내 배치). - - Galaxy(Android) 폰 연동: DAVx⁵ 앱을 통한 CalDAV (`/api/dav`) 동기화 지원. -4. **모바일 바텀시트 드로어**: +3. **외부 플랫폼 연동 & Import/Export**: + - TickTick 등 외부 플랫폼과의 호환을 위한 **CSV 및 ICS(iCalendar) 파일 Import/Export 완벽 지원** (하단 프로필 메뉴 내 배치). + - Formula Injection 방어(`sanitizeFormula`) 및 Excel 호환 UTF-8 BOM 지원. + - Galaxy(Android) 폰 연동: DAVx⁵ 앱을 통한 CalDAV/CardDAV (`/api/dav`) 동기화 지원. +4. **PWA (Progressive Web App)**: + - 모바일/데스크톱 설치 가능 및 오프라인 캐싱 지원 (`manifest.json`, `sw.js`). +5. **모바일 바텀시트 드로어**: - 스마트폰에서 우측 상세 탭이 **바텀 시트**로 아래서 위로 슬라이드업. - 아래로 120px 이상 스와이프하면 패널 닫힘. - 오버레이 클릭으로도 패널 닫힘. +6. **디자인 시스템 & 반응형 커스터마이징**: + - VSCode 무채색 다크 테마 및 파스텔 매트 라이트 팔레트 지원. + - 사이드바 및 우측 디테일 패널 마우스 드래그 리사이저. + - 글로벌 `UserPrefs` 시스템(`userPrefs.ts` / `useUserPrefs.ts`) 기반 UI 밀도, 폰트 크기, 모서리 라운드, 테마 색조/채도, 애니메이션 속도 커스터마이징 지원. --- @@ -30,76 +37,95 @@ ``` src/ ├── app/ -│ ├── demo/page.tsx ← DB 없이 LocalStorage 기반 데모 페이지 -│ ├── admin/page.tsx ← 어드민 대시보드 +│ ├── layout.tsx / page.tsx / providers.tsx +│ ├── demo/page.tsx ← DB 연결 없이 LocalStorage 기반으로 구동되는 완전한 데모 페이지 +│ ├── login/page.tsx / register/page.tsx +│ ├── admin/page.tsx ← 어드민 대시보드 (ADMIN 역할 및 통제 게이트) │ └── api/ (auth, lists, tasks, import, dav) ├── components/ │ ├── layout/ -│ │ ├── AppShell.tsx ← 3-Panel 메인 컨테이너 + 모바일 오버레이 관리 -│ │ └── Sidebar.tsx ← 프로젝트 목록, 언어, 테마, 프로필/Import +│ │ ├── AppShell.tsx ← 3-Panel 메인 컨테이너 (실시간 하위 태스크 & 인라인 동기화, 모바일 오버레이) +│ │ └── Sidebar.tsx ← 프로젝트 목록, 언어 셀렉터, 테마 토글, 유저 프로필 팝오버(Import 내장) │ ├── tasks/ -│ │ ├── TaskList.tsx ← 체크리스트 (재귀 트리, 인라인 수정, 우클릭 메뉴) -│ │ ├── TaskDetail.tsx ← 우측 상세 패널 (TickTick 스타일, 바텀시트 터치) -│ │ └── MarkdownNoteEditor.tsx ← Preview/Edit 탭, 툴바, URL 클릭 지원 +│ │ ├── TaskList.tsx ← 중앙 체크리스트 (N-depth 재귀 트리, 인라인 제목 수정, 우클릭 메뉴) +│ │ ├── TaskDetail.tsx ← 우측 상세 패널 (모듈형 블록 스왑, 스플릿 리사이저, 바텀시트 터치) +│ │ ├── MarkdownNoteEditor.tsx ← 👁️ Preview / ✏️ Edit 탭, 심플 캔버스, DOMPurify XSS 방어 +│ │ └── KanbanView.tsx ← CheckFlow Labs 3컬럼 칸반 보드 (To Do / In Progress / Done) │ ├── settings/ -│ │ └── SettingsModal.tsx ← Profile/Preferences/Sync/Admin 4탭 +│ │ └── SettingsModal.tsx ← Profile / Preferences / Labs / Sync / Admin 5탭 모달 │ └── ui/ │ ├── LanguageSelector.tsx ← 글래스모피즘 언어 팝오버 -│ ├── ContextMenu.tsx ← 커스텀 우클릭 메뉴 -│ └── CommandPalette.tsx ← Ctrl+K 글로벌 검색 +│ ├── ContextMenu.tsx ← 커스텀 우클릭 컨텍스트 메뉴 +│ └── CommandPalette.tsx ← Ctrl+K 글로벌 명령 팔레트 └── lib/ - ├── i18n/ (en, ko, ja + useI18n 훅) - └── mockData.ts ← Demo LocalStorage Store (trash, tags, settings) + ├── i18n/ (en, ko, ja 사전 및 useI18n 훅) + ├── mockData.ts ← Demo LocalStorage Store (trash, tags, settings) + ├── userPrefs.ts ← 글로벌 사용자 설정 스토어 (v0.6+) + ├── useUserPrefs.ts ← 반응형 prefs 훅 + CSS var 인젝터 + ├── auth.ts / prisma.ts ``` --- -## 3. 롤백 포인트 (Git Tags) +## 3. 롤백 포인트 (Git Tags & Checkpoints) -| Tag | 내용 | 날짜 | +| Tag / Checkpoint | 내용 | 일자 | |---|---|---| -| `checkpoint-v0.1.0` | 기본 Full-Stack 기반 | 초기 | -| `checkpoint-v0.2.0` | i18n, 3-Way Theme, Demo Mode | - | -| `checkpoint-v0.2.1` | 리치 마크다운 렌더러, 적응형 메모장 | - | -| `checkpoint-v0.2.2` | 하위 태스크 실시간 동기화 & 인라인 수정 | - | -| `checkpoint-v0.3.0` | 사이드바 애니메이션, Import 이동, 커스텀 메뉴, TickTick 스타일 | - | +| `checkpoint-v0.1.0` (`checkpoint-v1.0`) | 기본 Full-Stack 기반 시점 | 초기 | +| `checkpoint-v0.2.0` (`checkpoint-v2.0`) | i18n(EN/KO/JA), 3-Way Theme(System/Light/Dark), Demo Mode 탑재 | - | +| `checkpoint-v0.2.1` (`checkpoint-v2.1`) | 리치 마크다운 GUI 렌더러(MarkdownNoteEditor), 적응형 와이드 메모장 | - | +| `checkpoint-v0.2.2` (`checkpoint-v2.2`) | 하위 태스크 실시간 동기화 & 인라인 즉시 수정 UX | - | +| `checkpoint-v0.3.0` (`checkpoint-v3.0`) | 사이드바 애니메이션, Import 기능 프로필 메뉴 이동, 커스텀 우클릭 컨텍스트 메뉴 | - | | `checkpoint-v0.3.2` | N-depth 재귀 체크리스트, 태그, 휴지통, 설정 모달, 타임스탬프 | - | -| `checkpoint-v0.4.0` | 모바일 바텀시트, 스와이프 닫기, 오버레이 | 2026-08-20 | -| `checkpoint-v0.5.0` | **(현재 최신)** VSCode 스타일 무채색 다크 테마, 에디터 조잡한 툴바 제거 & 순수 캔버스 전환, 모듈형 블록 커스텀 (서브태스크 ↔ 노트 순서 스왑 및 스플릿 리사이저 높이 조절), CheckFlow Labs (3컬럼 칸반 보드 뷰), 기본값 복원(Reset to Defaults), 보안 패치 완료 | 2026-08-21 | +| `checkpoint-v0.4.0` | 모바일 바텀시트 드로어, Y축 스와이프 닫기, 모바일 백드롭 오버레이 | 2026-08-20 | +| `checkpoint-v0.5.0` | VSCode 무채색 다크 테마, 에디터 조잡한 툴바 제거 & 순수 캔버스 전환, 모듈형 블록 커스텀 (서브태스크 ↔ 노트 순서 스왑 및 스플릿 리사이저 높이 조절), CheckFlow Labs (3컬럼 칸반 보드 뷰), 기본값 복원(Reset to Defaults), 보안 패치 완료 | 2026-08-21 | +| `checkpoint-v0.6.0` | 글로벌 `UserPrefs` 시스템(`userPrefs.ts` / `useUserPrefs.ts`) 도입, 사이드바 드래그 리사이저, 디테일 패널 드래그 리사이저, Labs 탭 확장(밀도/폰트/라운드/애니메이션/색조/채도/패널 너비), 뷰 전환(리스트↔칸반) 실시간 반응, 파스텔 매트 라이트 팔레트 적용 | 2026-08-21 | +| `checkpoint-v0.6.1` | CalDAV / DAVx⁵ 양방향 동기화 프로토콜 고도화(OPTIONS, PROPFIND, REPORT, PUT, DELETE), 설정 모달 내 플랫폼별(Android DAVx⁵ / Apple Reminders / Thunderbird) 인터랙티브 가이드 및 실시간 엔드포인트 테스트 핑, 다국어 i18n 동기화 | 2026-08-21 | +| `checkpoint-v0.6.2` | **(현재 최신)** 표준 태스크 내보내기(Export) 기능 구현: TickTick/RFC 4180 호환 CSV (UTF-8 BOM 포함) 및 RFC 5545 iCalendar (`.ics` VTODO), 사이드바 프로필 메뉴 연동, 데모 모드 로컬 Blob 내보내기 지원, 다국어 사전 동기화 | 2026-08-21 | --- -## 4. 구현 완료 기능 +## 4. 구현 완료 기능 요약 - [x] i18n 3개국어 (영어 기본, 한국어, 일본어 사전 100% 무결성) -- [x] **VSCode 스타일 무채색 다크 테마** (`#181818`, `#1e1e1e`, `#252526`, `#2d2d2d`) +- [x] **VSCode 스타일 무채색 다크 테마** (`#181818`, `#1e1e1e`, `#252526`, `#2d2d2d`) 및 파스텔 라이트 테마 - [x] **에디터 툴바 제거 & 심플 캔버스** (조잡한 `- [ ]` 툴바 제거, 순수한 텍스트/마크다운 에디팅) - [x] **모듈형 상세 패널 (Custom Blocks)**: - 서브태스크 ↔ 노트 블록 **위치 스왑(⇄ Swap)** - 마우스 드래그로 높이 비율(15%~85%)을 실시간 조절하는 **스플릿 리사이저(Split Resizer)** - - 각 블록별 독립적인 접기/펼치기 및 100% 풀스크린 확장 + - 각 블록별 독립적인 접기/펼치기 - [x] **🧪 CheckFlow Labs (실험실 기능)**: - 📋 **리스트 뷰** ↔ 📊 **3컬럼 칸반 보드 뷰 (To Do / In Progress / Done)** 원클릭 전환 - 언제든 초기 순정 상태로 되돌리는 **기본값 복원 (Reset to Defaults)** +- [x] **글로벌 UserPrefs 커스터마이징 (v0.6.0)**: + - 사이드바 너비(160~420px) 및 디테일 패널 너비(300~760px) 드래그 리사이징 + - UI 밀도 (Compact / Default / Comfortable) + - 폰트 크기, 라운드 스타일, 애니메이션 속도, 액센트 색조(Hue) & 채도(Saturation) 슬라이더 - [x] Demo 모드 (LocalStorage 기반 완전한 로컬 구동) -- [x] N단계 재귀 체크리스트 (RecursiveTaskItem) +- [x] N단계 재귀 체크리스트 (`RecursiveTaskItem`) - [x] 인라인 제목 수정 (더블클릭/엔터/ESC) -- [x] 커스텀 우클릭 컨텍스트 메뉴 (전체 트리) +- [x] 커스텀 우클릭 컨텍스트 메뉴 (`ContextMenu.tsx`, 브라우저 기본 메뉴 비활성화) - [x] Created / Edited 타임스탬프 - [x] 커스텀 태그 (색상 자동 부여) - [x] 휴지통 (복원/영구삭제/보관 기간 설정) -- [x] 설정 모달 (Profile/Preferences/Labs/Sync/Admin) +- [x] 설정 모달 (Profile / Preferences / Labs / Sync / Admin 5탭) - [x] 어드민 대시보드 (`/admin` - ADMIN 롤 및 권한 통제 게이트) - [x] 정식 라우트 보호 미들웨어 (`src/middleware.ts` 인증 & 역할 검증) - [x] API IDOR 및 소유권 교차 검증 (서브태스크 및 리스트 이동) -- [x] CSV / ICS Import Formula Injection 방어 -- [x] Ctrl+K 글로벌 명령 팔레트 -- [x] TickTick CSV/ICS 임포트 -- [x] CalDAV 동기화 안내 (DAVx⁵) +- [x] CSV / ICS Import Formula Injection 방어 (`sanitizeFormula`) +- [x] Ctrl+K 글로벌 명령 팔레트 (`CommandPalette.tsx`) +- [x] **TickTick CSV/ICS 임포트 및 내보내기 (Import & Export)**: + - 표준 RFC 4180 CSV (TickTick 포맷) 및 RFC 5545 iCalendar (`.ics` VTODO) 완벽 내보내기 (`/api/export` 및 클라이언트 사이드 데모 Blob 다운로드) + - 목록별 필터링 및 완료 태스크 포함 여부 선택 모달 +- [x] **CalDAV 양방향 동기화 및 가이드 고도화**: + - RFC 4791 표준 준수: `OPTIONS`, `PROPFIND` (Principal & Collection 탐색), `REPORT` (VTODO 쿼리), `PUT` (태스크 업서트), `DELETE` + - 설정 모달 내 플랫폼별 인터랙티브 가이드 (Samsung Galaxy / DAVx⁵, Apple 미리알림, Thunderbird) + - 실시간 엔드포인트 응답 상태 테스트 및 ICS 피드 다운로드 기능 - [x] **TickTick 스타일 스마트 퀵애드 툴바** (날짜, 우선순위 프리셋) - [x] **상단 프로젝트 브레드크럼 & 리스트 이동기** (`📁 프로젝트명 ▾`) -- [x] **모바일 바텀시트 드로어** (Y축 스와이프, 오버레이) +- [x] **모바일 바텀시트 드로어** (Y축 120px 스와이프 닫기, 백드롭 오버레이) - [x] FAB 버튼 (모바일 태스크 추가) +- [x] PWA 매니페스트 및 서비스워커 지원 (`manifest.json`, `sw.js`) --- @@ -110,14 +136,14 @@ src/ - 사용자 입력(마크다운, CSV/ICS 등)은 DOMPurify 및 Formula Sanitize를 반드시 통과할 것. - 어드민 전용 라우트는 `role === "ADMIN"`을 서버/미들웨어 레벨에서 필터링할 것. 2. **사용자 주도 커스터마이징 & 공간 효율성**: - - 모든 블록과 뷰(리스트/칸반, 서브태스크/노트 스플릿 비율 등)는 사용자가 원하는 대로 직관적으로 조절 가능해야 함. + - 모든 블록과 뷰(리스트/칸반, 서브태스크/노트 스플릿 비율, 패널 너비 등)는 `userPrefs.ts`를 통해 사용자가 직관적으로 조절 가능해야 함. - 불필요한 조잡한 툴바를 배제하고 심플하고 직관적인 조작성 유지. -3. **컨텍스트 메뉴**: `ContextMenu.tsx` 사용, 브라우저 기본 메뉴 비활성화. -4. **i18n 무결성**: 새 텍스트는 en/ko/ja 사전에 모두 추가. +3. **컨텍스트 메뉴**: 브라우저 기본 메뉴 대신 `ContextMenu.tsx`를 사용하여 네이티브 웹앱 UX 유지. +4. **i18n 무결성**: 새 텍스트 추가 시 `src/lib/i18n/translations.ts`의 en, ko, ja 사전에 모두 추가할 것. 5. **모바일 CSS 규칙**: - `detail-panel mobile-open` 클래스가 바텀시트를 제어. - 모바일: `translateY(100%) → translateY(0)` 애니메이션. - - 데스크탑: `detail-panel`이 flex 방향 측면 패널. + - 데스크탑: `detail-panel`이 flex 방향 측면 패널로 동작. 6. **언어**: 사용자 응답 및 에이전트 간 소통은 한국어를 기본으로 할 것. --- @@ -128,7 +154,7 @@ src/ |---|---| | 초기 ~ Checkpoint v2.x | Claude Sonnet 4.6 | | Checkpoint v2.x ~ v3.x | Gemini 2.5 Flash | -| Checkpoint v4.0 | Gemini (현재) | +| Checkpoint v4.0 ~ 현재 | Gemini / Cline | --- @@ -142,79 +168,6 @@ src/ - **로컬 실행**: `npm run dev` (포트 3000) - **Demo 페이지**: `http://localhost:3000/demo` - ---- - -## 1. 프로젝트 개요 & 핵심 요구사항 - -사용자의 핵심 요구사항: -1. **TickTick 스타일 To-Do 리스트 독립 웹앱**: - - 체크리스트는 **메인 - 하위(Sub-task)** 2단계 계층 구조를 갖추며, 양쪽 패널 간 1:1 실시간 동기화. - - **적응형(Adaptive) 와이드 메모장**: 우측 패널의 대부분을 메모장이 차지하며, 작성한 마크다운이 실제 웹 문서처럼 미려한 GUI 형태로 렌더링(Preview & Interactive Checkbox) 지원. - - **인라인 즉시 수정 UX**: 상단 프로젝트 제목 및 태스크 제목을 더블클릭/클릭으로 즉시 수정 가능. -2. **셀프호스팅 & 프라이버시 중심 멀티유저**: - - SNS 형태가 아닌 개인별 프라이버시가 완벽히 보장되는 독립 멀티유저 플랫폼. - - Docker 배포 지원 (PostgreSQL 16 포함, Dockerfile & docker-compose.yml 완비). -3. **외부 플랫폼 연동 & Import**: - - TickTick 등 외부 플랫폼에서 내보내기한 CSV 및 ICS(iCalendar) 파일 Import 지원 (하단 프로필 메뉴 내 배치). - - Galaxy(Android) 폰 연동: DAVx⁵ 앱을 통한 CalDAV/CardDAV (`/api/dav`) 동기화 지원. -4. **PWA (Progressive Web App)**: - - 모바일/데스크톱 설치 가능 및 오프라인 캐싱 지원. -5. **디자인 시스템 & 반응형 웹앱 UX**: - - TickTick / OneUI / Vercel 디자인 언어. - - **네이티브 웹앱 느낌의 커스텀 우클릭 컨텍스트 메뉴(ContextMenu)** 지원. - - 부드러운 사이드바 애니메이션 및 화면 테마/언어 컨트롤 잘림 방지. - ---- - -## 2. 주요 컴포넌트 구조 - -``` -src/ -├── app/ -│ ├── layout.tsx / page.tsx / providers.tsx -│ ├── demo/page.tsx ← DB 연결 없이 LocalStorage 기반으로 구동되는 완전한 데모 페이지 -│ ├── login/page.tsx / register/page.tsx -│ └── api/ (auth, lists, tasks, import, dav) -├── components/ -│ ├── layout/ -│ │ ├── AppShell.tsx ← 3-Panel 메인 컨테이너 (실시간 하위 태스크 & 인라인 동기화) -│ │ └── Sidebar.tsx ← 프로젝트 목록, 언어 셀렉터, 테마 토글, 유저 프로필 팝오버(Import 내장) -│ ├── tasks/ -│ │ ├── TaskList.tsx ← 중앙 체크리스트 (인라인 제목 수정, 하위 태스크 추가, 우클릭 메뉴) -│ │ ├── TaskDetail.tsx ← 우측 상세 패널 (TickTick 스타일 메타바 + 와이드 메모장 + 하단 하위할일) -│ │ └── MarkdownNoteEditor.tsx ← 👁️ Preview / ✏️ Edit 탭, 마크다운 툴바, 인터랙티브 체크박스 -│ └── ui/ -│ ├── LanguageSelector.tsx ← OneUI/Vercel 스타일 커스텀 글래스모피즘 언어 팝오버 -│ └── ContextMenu.tsx ← 네이티브 웹앱 커스텀 우클릭 컨텍스트 메뉴 -└── lib/ - ├── i18n/ (en, ko, ja 사전 및 useI18n 훅) - ├── mockData.ts ← Demo 모드용 LocalStorage Store - ├── userPrefs.ts ← 글로벌 사용자 설정 스토어 (v0.6+) - ├── useUserPrefs.ts ← 반응형 prefs 훅 + CSS var 인젝터 - ├── auth.ts / prisma.ts -``` - ---- - -## 3. 롤백 포인트 (Checkpoints) - -- **`checkpoint-v1.0`**: 기본 Full-Stack 기반 시점 -- **`checkpoint-v2.0`**: i18n(EN/KO/JA), 3-Way Theme(System/Light/Dark), Demo Mode 탑재 -- **`checkpoint-v2.1`**: 리치 마크다운 GUI 렌더러(MarkdownNoteEditor), 적응형 와이드 메모장 -- **`checkpoint-v2.2`**: 하위 태스크 실시간 동기화 & 인라인 즉시 수정 UX -- **`checkpoint-v3.0`**: 부드러운 사이드바 애니메이션, 테마 버튼 잘림 완벽 해결, Import 기능 프로필 메뉴 이동, 커스텀 웹앱 우클릭 컨텍스트 메뉴, TickTick 스타일 우측 상세 탭 완비 -- **`checkpoint-v0.5.0`**: 버전 체계 0.x.x 전환, VSCode 무채색 다크 테마, 미니멀 에디터(툴바 제거), 모듈형 블록 스왑/리사이저, 칸반 보드 Labs, 설정 Labs 탭 신설 -- **`checkpoint-v0.6.0` (현재 최신)**: 글로벌 `UserPrefs` 시스템(`userPrefs.ts` / `useUserPrefs.ts`) 도입, 사이드바 드래그 리사이저, 디테일 패널 드래그 리사이저, Labs 탭 확장(밀도/폰트/라운드/애니메이션/색조/채도/패널 너비), 뷰 전환(리스트↔칸반) 페이지 리로드 없이 반응, 파스텔 매트 라이트 팔레트 적용 - ---- - -## 4. 개발 규칙 및 주의사항 - -1. **메모장 우선 원칙**: 우측 상세 탭에서 메모장은 항상 메인 영역(`flex: 1`)을 차지하도록 유지할 것. -2. **웹앱 인터랙션**: 브라우저 기본 컨텍스트 메뉴 대신 `ContextMenu.tsx`를 통해 앱스러운 UX를 유지할 것. -3. **i18n 무결성**: 텍스트 추가 시 `src/lib/i18n`의 en, ko, ja 사전에 모두 추가할 것. - # This is NOT the Next.js you know diff --git a/chamgojaryo/워홀 입국 후 - TickTick.html b/chamgojaryo/워홀 입국 후 - TickTick.html deleted file mode 100644 index c351b91..0000000 --- a/chamgojaryo/워홀 입국 후 - TickTick.html +++ /dev/null @@ -1,225 +0,0 @@ - - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx스노코 + 매트리스, 이불, 베개xxxxxxxxxx아마존 재팬, 라쿠텐, 이케아, 무인양품, 니토리아마존 프라임 가입해서 배송일 입주일로 지정해서 주문하기스노코 + 매트리스 or 일체형 (매트리스 단독이면 곰팡이 이슈, 겨울에 추움)https://www.nitori-net.jp/ec/product/5651774/