# 기술 스택

Zellyy Finance 프로젝트 개발에 사용된 전체 기술 스택을 정리합니다.

## Frontend

- 언어: TypeScript, JavaScript
- 프레임워크: React 18.x
- 번들러/빌드 도구: Vite
- UI 라이브러리: Shadcn UI, Radix UI
- 스타일링: Tailwind CSS
- 라우팅: React Router DOM
- 상태 관리: React Context, @tanstack/react-query
- 폼 관리: React Hook Form (@hookform/resolvers)
- 알림: Radix UI Toast, 사용자 정의 토스트 훅

## Backend

- Backend-as-a-Service: Supabase (Cloud)
- 인증/인가: Supabase Auth
- 데이터베이스: Supabase Database (PostgreSQL)
- 스토리지: Supabase Storage
- API: Supabase Client Library (PostgREST, Realtime)

## Mobile (Cross-platform)

- 플랫폼: Capacitor
- 패키지: @capacitor/core, @capacitor/cli, @capacitor/android, @capacitor/ios
- 플러그인: Keyboard, Splash Screen 등

## Utilities & Tools

- 코드 스타일 및 검사: ESLint
- HTTP 클라이언트: @supabase/supabase-js, fetch
- 데이터 페칭: @tanstack/react-query
- UUID 생성: uuid (@types/uuid)

## 배포 및 운영

- 개발 서버: Vite dev server
- 패키지 매니저: npm

## 개발 환경 및 도구

- IDE: Visual Studio Code
- 버전 관리: Git (GitHub)

## 테스트 및 품질 관리

- Unit/Integration 테스트: Jest + React Testing Library 또는 Vitest
- E2E 테스트: Cypress 또는 Playwright

## 코드 품질 및 포맷팅

- Prettier
- Husky + lint-staged + commitlint
- TypeScript strict 모드

## CI/CD

- GitHub Actions 또는 Gitea Actions: lint → test → build → deploy 자동화
- Drone CI (Gitea 연동): CI/CD 파이프라인 자동화
- 커버리지 리포트 업로드

## 문서화

- Storybook (UI 컴포넌트 카탈로그)
- OpenAPI/Swagger (API 문서 자동 생성)

## 보안

- Dependabot, Snyk (dependency 스캔)
- 환경변수 관리: dotenv, Vault

## 성능 및 PWA

- Lighthouse 성능 측정
- Service Worker (오프라인, 푸시 지원)

## 국제화 (i18n)

- react-i18next 등

## 컨테이너화

- Dockerfile, docker-compose (개발/테스트 환경)