입문
PHP
Laravel
나만의 레시피 카드 컬렉션
리포지토리명
recipe-card-collection
54
1건 제출
1주 전
문제 설명
프로젝트 개요
간단한 요리 레시피를 카드 형태로 저장하고 관리하는 웹 애플리케이션입니다. 레시피 제목, 재료, 조리법을 입력하면 예쁜 카드로 표시되며, 언제든지 확인할 수 있습니다.
필수 기능
- 레시피 추가 폼 (제목, 재료, 조리법 입력)
- 레시피 목록을 카드 형태로 표시
- 각 레시피 카드에 삭제 버튼
- 레시피 데이터는 데이터베이스에 저장
- 반응형 디자인 (모바일에서도 예쁘게)
- 레시피가 없을 때 안내 메시지 표시
보너스 기능
- 레시피 카테고리 선택 (한식, 양식, 중식, 일식 등)
- 재료를 쉼표로 구분하여 리스트로 표시
- 카드에 요리 시간 정보 추가
- 카드 호버 시 애니메이션 효과
- 간단한 검색 기능 (제목으로 필터링)
기술 스택
- Laravel 12.x (PHP 프레임워크)
- Blade 템플릿 엔진
- Tailwind CSS (스타일링)
- SQLite 또는 MySQL 데이터베이스
제약 조건
- • Laravel 12.x 최신 버전 사용 필수
- • Blade 템플릿 엔진 활용
- • 데이터베이스 마이그레이션 파일 생성
- • CSRF 보호 적용
- • 입력 데이터 유효성 검사 (Validation) 포함
- • Tailwind CSS 사용 권장 (또는 Bootstrap)
- • 단일 페이지에서 모든 기능 동작
- • 코드 주석을 한글로 작성
프롬프트 레시피
아래 프롬프트를 순서대로 AI에게 보내면 됩니다. 복사 버튼을 눌러 바로 사용하세요.
1
1
Step 1
Laravel 12.x 프로젝트를 생성하고 기본 설정을 해주세요. 요구사항: 1. 프로젝트명: recipe-card-collection 2. SQLite 데이터베이스 사용 설정 (.env 파일 수정) 3. Tailwind CSS 설치 및 설정 4. 'recipes' 테이블을 위한 마이그레이션 파일 생성: - id (primary key) - title (string, 레시피 제목) - ingredients (text, 재료) - instructions (text, 조리법) - category (string, nullable, 카테고리) - cooking_time (integer, nullable, 조리 시간(분)) - timestamps 5. Recipe 모델 생성 (fillable 속성 포함) 6. 마이그레이션 실행 모든 파일의 주석은 한글로 작성해주세요.
기대 결과: Laravel 프로젝트가 생성되고, 데이터베이스 마이그레이션이 완료되며, Recipe 모델이 준비됩니다. Tailwind CSS가 설정되어 사용 가능한 상태가 됩니다.
2
2
Step 2
레시피 CRUD를 처리할 RecipeController를 생성하고 라우트를 설정해주세요.
요구사항:
1. RecipeController 생성 (resource controller)
2. web.php에 라우트 등록:
- GET / : 레시피 목록 및 추가 폼 표시 (index)
- POST /recipes : 레시피 저장 (store)
- DELETE /recipes/{id} : 레시피 삭제 (destroy)
3. index 메서드: 모든 레시피를 최신순으로 조회하여 뷰로 전달
4. store 메서드:
- 유효성 검사 (title, ingredients, instructions 필수)
- 데이터 저장 후 성공 메시지와 함께 리다이렉트
5. destroy 메서드: 레시피 삭제 후 리다이렉트
한글 주석으로 각 메서드의 역할을 설명해주세요.
기대 결과: RecipeController가 생성되고, 레시피 추가/조회/삭제 기능이 구현됩니다. 라우트가 설정되어 각 URL로 접근 가능합니다.
3
3
Step 3
Blade 템플릿을 사용하여 메인 페이지를 만들어주세요.
요구사항:
1. resources/views/recipes/index.blade.php 생성
2. Tailwind CSS를 사용한 깔끔한 디자인
3. 페이지 구성:
- 상단: 페이지 제목 "나만의 레시피 카드 컬렉션" (큰 폰트, 중앙 정렬)
- 왼쪽 영역: 레시피 추가 폼
* 제목 입력 필드
* 재료 입력 필드 (textarea, placeholder: "재료를 쉼표로 구분하여 입력하세요")
* 조리법 입력 필드 (textarea)
* 카테고리 선택 (select: 한식, 양식, 중식, 일식, 기타)
* 조리 시간 입력 (숫자, 단위: 분)
* 제출 버튼 ("레시피 추가")
- 오른쪽 영역: 레시피 카드 목록 (그리드 레이아웃)
4. 레시피 카드 디자인:
- 흰색 배경, 그림자 효과, 둥근 모서리
- 카드 상단: 제목 (굵게)
- 카테고리 배지 (색상 구분)
- 재료 목록 (쉼표로 구분된 텍스트를 리스트로 변환)
- 조리법 (줄바꿈 유지)
- 조리 시간 표시 (아이콘과 함께)
- 삭제 버튼 (빨간색, 카드 우측 상단)
5. 레시피가 없을 때: "아직 등록된 레시피가 없습니다. 첫 레시피를 추가해보세요!" 메시지 표시
6. 반응형 디자인: 모바일에서는 폼과 카드가 세로로 배치
7. 성공/에러 메시지 표시 영역 (세션 메시지)
CSRF 토큰을 포함하고, 폼 메서드는 POST, 삭제는 DELETE 메서드를 사용해주세요.
기대 결과: 완성된 웹 페이지가 표시됩니다. 레시피 추가 폼과 카드 목록이 보기 좋게 배치되며, 반응형으로 동작합니다. 레시피를 추가하면 카드로 표시되고, 삭제 버튼으로 제거할 수 있습니다.