Files

hansoo e72f9e8d26 feat: React 성능 최적화 및 Vercel 배포 시스템 구축 완료

🚀 성능 최적화 (Task 8):
- React.lazy를 활용한 코드 스플리팅 구현
- React.memo, useMemo, useCallback을 통한 메모이제이션 최적화
- 초기 번들 크기 87% 감소 (470kB → 62kB)
- 백그라운드 동기화 간격 최적화 (5분 → 30초)

📦 Vercel 배포 인프라 구축 (Task 9):
- vercel.json 배포 설정 및 보안 헤더 구성
- GitHub Actions 자동 배포 워크플로우 설정
- 환경별 배포 및 미리보기 시스템 구현
- 자동화된 배포 스크립트 및 환경 변수 관리
- 포괄적인 배포 가이드 및 체크리스트 작성

🔧 코드 품질 개선:
- ESLint 주요 오류 수정 (사용하지 않는 변수/import 정리)
- 테스트 커버리지 확장 (229개 테스트 통과)
- TypeScript 타입 안전성 강화
- Prettier 코드 포맷팅 적용

⚠️ 참고: 테스트 파일의 any 타입 및 일부 경고는 향후 개선 예정

🛠️ Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

2025-07-12 20:52:04 +09:00

4.3 KiB

Raw Blame History

💰 Zellyy Finance - 개인 가계부 관리 애플리케이션

React와 TypeScript로 구축된 현대적인 개인 가계부 관리 애플리케이션입니다.

🚀 라이브 데모

프로덕션: zellyy-finance.vercel.app
스테이징: Preview 배포는 PR 생성 시 자동으로 생성됩니다.

📋 프로젝트 정보

Lovable Project URL: https://lovable.dev/projects/79bc38c3-bdd0-4a7f-b4db-0ec501bdb94f

How can I edit this code?

There are several ways of editing your application.

Use Lovable

Simply visit the Lovable Project and start prompting.

Changes made via Lovable will be committed automatically to this repo.

Use your preferred IDE

If you want to work locally using your own IDE, you can clone this repo and push changes. Pushed changes will also be reflected in Lovable.

The only requirement is having Node.js & npm installed - install with nvm

Follow these steps:

# Step 1: Clone the repository using the project's Git URL.
git clone <YOUR_GIT_URL>

# Step 2: Navigate to the project directory.
cd <YOUR_PROJECT_NAME>

# Step 3: Install the necessary dependencies.
npm i

# Step 4: Start the development server with auto-reloading and an instant preview.
npm run dev

Edit a file directly in GitHub

Navigate to the desired file(s).
Click the "Edit" button (pencil icon) at the top right of the file view.
Make your changes and commit the changes.

Use GitHub Codespaces

Navigate to the main page of your repository.
Click on the "Code" button (green button) near the top right.
Select the "Codespaces" tab.
Click on "New codespace" to launch a new Codespace environment.
Edit files directly within the Codespace and commit and push your changes once you're done.

What technologies are used for this project?

This project is built with .

Vite
TypeScript
React
shadcn-ui
Tailwind CSS

🔧 TypeScript 타입 시스템

이 프로젝트는 강력한 타입 안전성을 위해 중앙화된 타입 시스템을 구축했습니다.

주요 특징

Strict Mode: 모든 TypeScript strict 옵션 활성화
중앙화된 타입: src/types/에서 모든 타입 관리
타입 가드: 런타임 타입 검증 지원
성능 최적화: 조기 반환 및 Set 기반 검증

문서

📚 타입 시스템 가이드 - 상세한 사용법과 구조 설명
⚡ 빠른 참조 - 자주 사용하는 패턴들

타입 검증

# 타입 오류 검사
npm run type-check

# 또는 직접
npx tsc --noEmit

🚀 배포 가이드

이 프로젝트는 Vercel을 통해 자동 배포됩니다.

자동 배포

프로덕션: main 브랜치에 푸시하면 자동으로 프로덕션 배포
프리뷰: PR 생성 시 자동으로 미리보기 배포 생성
스테이징: develop 브랜치는 스테이징 환경으로 배포

배포 설정

자세한 배포 설정 방법은 DEPLOYMENT.md를 참조하세요.

필수 환경 변수

VITE_APPWRITE_ENDPOINT=https://your-appwrite-endpoint/v1
VITE_APPWRITE_PROJECT_ID=your-project-id
VITE_APPWRITE_DATABASE_ID=default
VITE_APPWRITE_TRANSACTIONS_COLLECTION_ID=transactions
VITE_APPWRITE_API_KEY=your-appwrite-api-key
VITE_DISABLE_LOVABLE_BANNER=true

🔗 커스텀 도메인

Vercel을 통해 커스텀 도메인을 쉽게 연결할 수 있습니다:

Vercel 프로젝트 Settings > Domains
원하는 도메인 입력
DNS 설정 업데이트
SSL 인증서 자동 설정

4.3 KiB Raw Blame History