mkdir daily-gratitude-journal-laravel && cd daily-gratitude-journal-laravel

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

Laravel 13.x 최신 버전으로 API 백엔드 프로젝트를 생성하고 기본 설정을 완료해주세요.

요구사항:
1. Laravel 13.x 프로젝트 생성 (`backend` 폴더에)
2. SQLite 데이터베이스 설정 (.env 파일 수정)
3. CORS 설정 활성화 (React 프론트엔드와 통신을 위해)
4. Gratitude 모델, 마이그레이션, 컨트롤러 생성
   - 테이블명: gratitudes
   - 필드: id, date (unique), mood_emoji, item_1, item_2, item_3, created_at, updated_at
   - date는 YYYY-MM-DD 형식이며 유니크 제약조건 적용
   - mood_emoji는 감정 이모지 (😊, 😌, 🥰, 😄, 🙏 중 하나)
5. API 라우트 정의 (routes/api.php)
   - GET /api/gratitudes - 전체 목록 (최신순)
   - POST /api/gratitudes - 새 일기 작성
   - GET /api/gratitudes/{id} - 특정 일기 조회
   - PUT /api/gratitudes/{id} - 일기 수정
   - DELETE /api/gratitudes/{id} - 일기 삭제
6. GratitudeController에 CRUD 메서드 구현
7. 마이그레이션 실행

모든 설정이 완료되면 `php artisan serve --host=0.0.0.0 --port=8000` 명령으로 API 서버를 실행할 수 있어야 합니다.

React 19 최신 버전으로 프론트엔드 프로젝트를 생성하고 기본 구조를 설정해주세요.

요구사항:
1. Vite를 사용하여 React 19 프로젝트 생성 (`frontend` 폴더에)
2. Tailwind CSS 설치 및 설정
3. axios 설치 (API 통신용)
4. 기본 폴더 구조 생성:
   - src/components/ (재사용 컴포넌트)
   - src/pages/ (페이지 컴포넌트)
   - src/api/ (API 호출 함수)
5. src/api/gratitude.js 파일 생성
   - Laravel API 엔드포인트 (http://localhost:8000/api/gratitudes) 호출 함수 작성
   - fetchGratitudes(), createGratitude(data), updateGratitude(id, data), deleteGratitude(id) 함수 구현
6. App.jsx에 기본 레이아웃 설정
   - 헤더: "✨ 감사 일기" 타이틀
   - 메인 컨텐츠 영역
   - Tailwind CSS로 간단한 스타일링
7. package.json 스크립트 확인 (npm run dev로 개발 서버 실행)

프로젝트가 생성되면 `npm run dev` 명령으로 React 개발 서버를 실행할 수 있어야 합니다.

감사 일기 작성 폼 컴포넌트를 만들어주세요.

요구사항:
1. src/components/GratitudeForm.jsx 컴포넌트 생성
2. 입력 필드:
   - 날짜 선택 (input type="date", 기본값: 오늘)
   - 기분 이모지 선택 (😊, 😌, 🥰, 😄, 🙏 중 하나, 라디오 버튼 또는 버튼 그룹)
   - 감사한 일 1 (textarea)
   - 감사한 일 2 (textarea)
   - 감사한 일 3 (textarea)
3. 제출 버튼 ("저장하기")
4. useState로 폼 데이터 관리
5. 폼 제출 시 createGratitude() API 호출
6. 제출 성공 시:
   - 폼 초기화
   - 성공 메시지 표시 (예: "감사 일기가 저장되었습니다! 🎉")
   - 부모 컴포넌트에 onSuccess 콜백 전달하여 목록 새로고침
7. 에러 처리:
   - 날짜 중복 시 "이미 오늘 일기를 작성했습니다" 메시지 표시
   - 필수 필드 미입력 시 경고 메시지
8. Tailwind CSS로 깔끔한 카드 스타일 적용

App.jsx에 GratitudeForm 컴포넌트를 추가하여 렌더링해주세요.

작성된 감사 일기 목록을 보여주는 컴포넌트를 만들어주세요.

요구사항:
1. src/components/GratitudeList.jsx 컴포넌트 생성
2. 컴포넌트 마운트 시 fetchGratitudes() API 호출하여 일기 목록 가져오기
3. 각 일기를 카드 형태로 표시:
   - 날짜 (예: 2024년 1월 15일)
   - 기분 이모지 (크게 표시)
   - 감사한 일 3가지 (넘버링 또는 불릿 포인트)
   - 수정/삭제 버튼
4. 최신순으로 정렬하여 표시
5. 삭제 버튼 클릭 시:
   - 확인 대화상자 표시 ("정말 삭제하시겠습니까?")
   - deleteGratitude() API 호출
   - 목록 새로고침
6. 수정 버튼 클릭 시:
   - 해당 일기 데이터를 GratitudeForm에 전달하여 수정 모드로 전환 (선택 구현)
7. 일기가 없을 때 "아직 작성한 일기가 없습니다. 오늘 감사한 일을 기록해보세요!" 메시지 표시
8. Tailwind CSS로 그리드 레이아웃 및 카드 스타일 적용 (모바일: 1열, 태블릿: 2열, 데스크톱: 3열)

App.jsx에서 GratitudeList 컴포넌트를 GratitudeForm 아래에 추가하고, 폼 제출 성공 시 목록이 자동으로 새로고침되도록 연결해주세요.