AI Code App

React + Vite + TypeScript 기반의 문서/샘플 허브 애플리케이션입니다. 현재 저장소는 공통 컴포넌트, 위젯 샘플, Markdown 문서 뷰어, Plan 게시판을 하나의 앱에서 탐색할 수 있도록 구성되어 있습니다.

임시 운영 메모

• 현재 저장소는 당분간 로컬 전용 작업 모드로 사용합니다.
• Git 원격 동기화, 브랜치 운영, 자동 병합/자동화는 잠시 중지한 상태로 간주합니다.
• Codex나 자동화 도구는 기본적으로 Git 작업 없이 현재 프로젝트 루트의 main 작업본을 바로 수정합니다.
• 채팅, Codex Live, 일반 작업메모, 메모 반영 요청도 같은 기준으로 해석합니다.
• 자동화 접수된 작업메모도 별도 브랜치 흐름을 이 문서에 고정하지 않고, 실제 운영 설정과 요청 문맥을 기준으로 처리합니다.
• 채팅 리소스와 첨부 파일은 public/.codex_chat/<chat-session-id>/resource/... 기준으로 제공하며, 업로드 파일은 public/.codex_chat/<chat-session-id>/resource/uploads/... 아래를 사용합니다.

시작하기

npm install
npm run dev

확인용 Preview 컨테이너

실제 반영 화면을 확인할 때는 바인드 마운트 없이 별도 이미지로 빌드하는 docker-compose.preview.yml을 사용합니다.

docker compose -f docker-compose.preview.yml up -d --build

• 기본 접속 주소: http://127.0.0.1:4173
• 소스 코드는 이미지 빌드 시점에 복사되므로, 로컬 파일 변경이 컨테이너에 바로 섞이지 않습니다.
• API 프록시는 기본적으로 호스트의 3100 포트를 host.docker.internal로 바라봅니다.
• 포트나 API 대상 변경이 필요하면 PREVIEW_APP_PORT, WORK_SERVER_URL 환경변수를 사용합니다.

테스트용 컨테이너 운영 기준

• 테스트용 컨테이너는 현재 ai-code-app-preview 하나만 유지합니다.
• 이 컨테이너는 채팅 전용 테스트가 아니라 현재 프로젝트 루트 기준 화면/기능 확인용 테스트 컨테이너로 사용합니다.
• https://test.sm-home.cloud/ 운영 기준은 화면 / -> 5174 앱 테스트 서버, /api/ 및 /ws/chat -> 127.0.0.1:3100 work-server 입니다.
• 위 프록시 기준은 임의로 바꾸지 말고, 변경이 필요하면 반드시 운영 목적을 먼저 문서에 남깁니다.
• 임시 테스트 컨테이너를 추가로 띄우지 말고, 필요 시 기존 ai-code-app-preview만 재기동합니다.
• 재기동은 다른 서비스까지 건드리지 않고 아래 명령으로 해당 컨테이너만 처리합니다.

docker compose -f docker-compose.preview.yml up -d --build --force-recreate --no-deps preview-app

• 저장소 설정에 없는 임시 테스트 컨테이너가 남아 있으면 정리 대상입니다.

PhotoPrism

루트 docker-compose.yml에는 PhotoPrism와 MariaDB 서비스가 포함되어 있습니다.

cp .env.example .env
docker compose up -d photoprism photoprism-db

• 기본 접속 포트: 127.0.0.1:2342
• 기본 사이트 URL: https://photo.sm-home.cloud/
• 원본 사진 경로: /mnt/usb/photos
• 원본 경로는 읽기 전용으로 마운트됩니다.
• /mnt/usb/photos가 호스트에 없으면 bind mount를 자동 생성하지 않고 기동이 실패합니다.

주요 스크립트

npm run dev
npm run build
npm run build:lib
npm run build:app
npm run preview
npm run docs:daily
npm run capture:component
npm run capture:menu
npm run capture:feature
npm run capture:fullscreen
npm run capture:plan-mobile
npm run plan:codex:once

프로젝트 구조

src/
├─ app/
│  ├─ main/                # 메인 레이아웃과 상단/사이드 UI
│  └─ manifests/           # 문서/샘플 로딩 매니페스트
├─ components/
│  ├─ markdownPreview/     # Markdown 문서 목록/카드 렌더링
│  ├─ navigation/          # 섹션 메뉴와 폴더 트리
│  ├─ previewer/           # text/json/code/image/markdown 미리보기
│  ├─ search/              # 통합 검색 모달
│  ├─ status-badge/        # 상태 표현 UI
│  └─ window/              # 드래그/리사이즈 가능한 윈도우 UI
├─ features/
│  ├─ dashboard/           # 프로젝트 전용 대시보드 샘플
│  ├─ layout/              # 프로젝트 전용 레이아웃 문서
│  ├─ markdownPreview/     # 기능 레벨 Markdown 카드
│  └─ planBoard/           # Plan 게시판 화면과 API 연동
├─ layer/                  # 제스처/검색 레이어
├─ samples/                # 샘플 엔트리 레지스트리
├─ store/                  # 앱 전역 상태
└─ widgets/                # 위젯 단위 샘플과 공통 셸
docs/
├─ components/             # 컴포넌트 문서
├─ features/               # 기능 문서
├─ templates/              # 문서 템플릿
└─ worklogs/               # 날짜별 작업일지

앱 구성

• APIs / Components: 공통 컴포넌트 샘플 탐색
• APIs / Widgets: 위젯 샘플 탐색
• Docs: docs/**/*.md와 일부 src/features/**/*.md 문서 탐색
• Plans: 작업 항목, 조치 이력, 이슈 이력을 관리하는 Plan 게시판

문서 위치

• 전체 문서 가이드: docs/README.md
• 작업일지: docs/worklogs
• 기능 문서: docs/features
• 컴포넌트 문서: docs/components

운영 메모

• 앱 문서는 Vite import.meta.glob으로 Markdown 파일을 수집합니다.
• 작업일지는 날짜별 파일로 누적하며 캡처 이미지는 docs/assets/worklogs/YYYY-MM-DD/ 기준으로 관리합니다.
• Plan 자동화 스크립트는 scripts/run-plan-codex-once.mjs를 사용합니다.
• command runner는 별도 명시적 요청이 있을 때만 npm run server-command:runner로 직접 기동하거나 재기동합니다.
• 문서/작업일지 일일 정리는 npm run docs:daily와 .github/workflows/daily-docs-maintenance.yml 기준으로 실행합니다.

프로젝트 현황

• 기준 일자: 2026-04-07 (Asia/Seoul)
• 작업일지: 9개
• 기능 문서: 2개
• 컴포넌트 문서: 8개
• 스크린샷 보관 폴더: 7개

최근 작업일지

• 2026-04-07 작업일지
• 2026-04-06 작업일지
• 2026-04-05 작업일지
• 2026-04-04 작업일지
• 2026-04-03 작업일지
• 2026-04-02 작업일지
• 2026-04-01 작업일지