# Phase 1: 프로젝트 초기화 + Electron 뼈대 + 마이크 캡처 ## 목표 프로젝트 기본 구조를 세우고, Electron 앱이 실행되며, 마이크에서 오디오를 캡처할 수 있는 상태까지. ## 태스크 ### 1.1 프로젝트 초기화 - `npm init` + package.json 설정 - TypeScript 설정 (tsconfig.json, strict mode) - Vite + Electron 개발 환경 설정 (electron-vite 또는 vite-plugin-electron) - ESLint + Prettier 설정 - vitest 테스트 환경 설정 - .gitignore, README.md ### 1.2 Electron 기본 구조 - `src/main/index.ts` — 앱 진입점 - Speakly 패턴: app.whenReady → 서비스 초기화 → createWindow → IPC 등록 - 단일 인스턴스 잠금 - before-quit / will-quit 리소스 정리 - `src/preload/index.ts` — contextBridge 기본 구조 - `src/renderer/main.tsx` — React 앱 진입점 - `src/shared/ipc-channels.ts` — IPC 채널 중앙 정의 - `src/shared/types.ts` — 공통 타입 - `src/shared/errors.ts` — 에러 코드 체계 (Speakly NXError 패턴) ### 1.3 메인 윈도우 - BrowserWindow 생성 (1104x816, hiddenInset titleBar) - contextIsolation: true, nodeIntegration: false - 기본 React App 컴포넌트 (빈 대시보드) ### 1.4 시스템 트레이 - Tray 아이콘 + 메뉴 (표시/숨기기, 종료) - Windows: closeToTray 옵션 ### 1.5 마이크 캡처 서비스 - `src/main/services/AudioCaptureService.ts` - Web Audio API 또는 node-record-lpcm16 - 24kHz mono PCM16 (또는 16kHz for Whisper) - noiseSuppression: false, echoCancellation: false - EventEmitter 패턴: 'audio-data', 'audio-level', 'started', 'stopped' - IPC: `audio:startCapture`, `audio:stopCapture`, `audio:getDevices` ### 1.6 오디오 디바이스 관리 - 마이크 디바이스 목록 조회 - 디바이스 변경 감지 - 선택된 디바이스 저장 (electron-store) ## Speakly RE 참조 - NativeHelper.dll MicrophoneCapture: WASAPI 이벤트 구동, 24kHz mono - AudioService: EventEmitter 패턴, 구독자 레퍼런스 카운팅 - main/index.js: 22단계 초기화 순서 ## 완료 조건 - [ ] `npm run dev` 로 Electron 앱 실행됨 - [ ] 마이크에서 오디오 데이터 캡처 가능 - [ ] 시스템 트레이에 아이콘 표시 - [ ] `npm run typecheck` 통과 - [ ] `npm run test` 통과