mkdir expense-saving-challenge-tracker && cd expense-saving-challenge-tracker

이 폴더에서 프로젝트를 시작합니다.

# Step 1: 프로젝트 초기 구조 및 데이터베이스 설정

다음 파일들을 생성해주세요:

## 1. `index.php` (메인 페이지)

- 챌린지 설정 확인: DB에서 현재 활성 챌린지 조회
- 챌린지가 없으면 → 설정 폼 표시 (목표 금액, 시작일 입력)
- 챌린지가 있으면 → 대시보드 표시 (누적 절약액, 목표 달성률, 남은 일수)
- 일일 절약 기록 폼 표시 (날짜, 카테고리, 금액, 메모)
- 최근 절약 내역 5개 표시 (테이블 형태)
- 세션 시작 (`session_start()`)
- CSRF 토큰 생성 및 세션 저장

## 2. `db.php` (데이터베이스 연결)

- SQLite DB 파일명: `challenge.db`
- PDO 연결 설정 (에러 모드: EXCEPTION)
- 테이블 2개 자동 생성 (없을 경우):
  - `challenges` 테이블: id, target_amount, start_date, created_at
  - `savings` 테이블: id, challenge_id, date, category, amount, memo, created_at

## 3. `config.php` (설정 파일)

- 카테고리 목록 상수 정의: ['식비', '교통비', '쇼핑', '구독료', '기타']
- DB 파일 경로 상수
- 에러 표시 설정 (개발 환경)

## 4. `style.css` (기본 스타일)

- CSS Reset
- 카드형 레이아웃 (절약 내역)
- 진행 바 스타일 (높이 20px, 둥근 모서리, 그라데이션)
- 반응형 그리드 (모바일: 1열, 태블릿: 2열, 데스크톱: 3열)
- 색상 팔레트: 주요 색상(초록), 보조 색상(노랑, 빨강)

요구사항:
- PHP 8.3+ 문법 사용
- PDO Prepared Statements 사용
- `htmlspecialchars()`로 모든 출력 이스케이프
- 간단한 에러 핸들링 (try-catch)
- 주석으로 코드 설명 추가

# Step 2: 챌린지 설정 및 일일 절약 기록 기능 구현

다음 파일들을 생성/수정해주세요:

## 1. `save_challenge.php` (챌린지 설정 처리)

- POST 요청 처리
- CSRF 토큰 검증 (세션 토큰과 비교)
- 입력 검증:
  - 목표 금액: 양수, 숫자만 허용
  - 시작일: 유효한 날짜 형식 (YYYY-MM-DD)
- DB에 챌린지 저장 (challenges 테이블)
- 성공 시 `index.php`로 리다이렉트
- 실패 시 에러 메시지 표시

## 2. `save_saving.php` (일일 절약 기록 처리)

- POST 요청 처리
- CSRF 토큰 검증
- 입력 검증:
  - 날짜: 유효한 형식, 챌린지 시작일 이후만 허용
  - 카테고리: 허용된 카테고리 목록에 포함되는지 확인
  - 금액: 양수, 숫자만 허용
  - 메모: 최대 200자 제한
- DB에 절약 기록 저장 (savings 테이블, challenge_id 외래키 연결)
- 성공 시 `index.php`로 리다이렉트 (성공 메시지 세션 플래시)
- 실패 시 에러 메시지 표시

## 3. `index.php` 수정

- 챌린지가 있을 때:
  - 총 절약액 계산 (savings 테이블 SUM)
  - 목표 달성률 계산 (총 절약액 / 목표 금액 * 100)
  - 남은 일수 계산 (시작일 + 30일 - 오늘)
  - 진행 바 표시 (달성률에 따라 색상 변경: 0-50% 빨강, 51-80% 노랑, 81-100% 초록)
  - 최근 절약 내역 5개 표시 (날짜, 카테고리, 금액, 메모)
- 세션 플래시 메시지 표시 후 삭제

## 4. `helpers.php` (헬퍼 함수)

- `validate_csrf()`: CSRF 토큰 검증 함수
- `validate_positive_number()`: 양수 검증 함수
- `validate_date()`: 날짜 형식 검증 함수
- `format_currency()`: 금액 포맷 함수 (예: 10000 → 10,000원)
- `calculate_days_left()`: 남은 일수 계산 함수

요구사항:
- 모든 폼에 CSRF 토큰 hidden 필드 추가
- 서버 사이드 입력 검증 철저히
- 에러 메시지는 사용자 친화적으로
- 성공 메시지는 세션 플래시로 구현
- PDO 예외 처리

# Step 3: 절약 내역 목록 및 카테고리별 통계 구현

다음 파일들을 생성/수정해주세요:

## 1. `history.php` (절약 내역 전체 목록)

- 현재 챌린지의 모든 절약 기록 조회 (최신순 정렬)
- 페이지네이션 구현 (한 페이지당 10개)
- 각 기록마다 수정/삭제 버튼 표시
- 총 절약액 및 총 기록 수 표시
- 카테고리 필터링 기능 (GET 파라미터로 카테고리 선택)

## 2. `stats.php` (카테고리별 통계 페이지)

- 카테고리별 절약 금액 합계 조회 (SQL GROUP BY)
- 각 카테고리별 비율 계산 (카테고리 금액 / 총 절약액 * 100)
- 테이블 형태로 표시:
  - 카테고리명, 절약 금액, 비율(%), 기록 수
- 가장 많이 절약한 카테고리 강조 표시
- Chart.js로 파이 차트 시각화 (CDN 사용)

## 3. `delete_saving.php` (절약 기록 삭제)

- POST 요청 처리
- CSRF 토큰 검증
- 삭제할 기록 ID 확인
- 현재 챌린지의 기록인지 검증 (challenge_id 확인)
- DB에서 삭제 후 `history.php`로 리다이렉트

## 4. `index.php` 및 `style.css` 수정

- 메인 페이지에 '전체 내역 보기', '통계 보기' 링크 추가
- 카드형 레이아웃 개선 (호버 효과, 그림자)
- 카테고리별 색상 구분 (식비: 주황, 교통비: 파랑, 쇼핑: 분홍, 구독료: 보라, 기타: 회색)
- 삭제 버튼 스타일 (빨간색, 확인 다이얼로그)

## 5. `script.js` (JavaScript 파일 생성)

- 삭제 버튼 클릭 시 확인 다이얼로그 표시
- Chart.js 파이 차트 초기화 (stats.php용)
- 진행 바 애니메이션 효과

요구사항:
- 페이지네이션은 LIMIT/OFFSET 사용
- Chart.js는 CDN으로만 사용 (`<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>`)
- 카테고리 색상은 CSS 변수로 정의
- 삭제 시 JavaScript confirm() 사용
- 반응형 테이블 (모바일에서 세로 스크롤)