🎨 일러스트 작가 스타일 가이드북 - 포트폴리오 & 작업 스타일 소개 페이지

mkdir illustrator-style-guidebook && cd illustrator-style-guidebook

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

# 일러스트 작가 스타일 가이드북 - 초기 설정

Laravel 13.x 프로젝트를 생성하고 기본 환경을 구성하세요.

## 요구사항

1. Laravel 13.x 최신 버전으로 프로젝트 생성
2. SQLite 데이터베이스 설정 (.env 파일에서 DB_CONNECTION=sqlite)
3. Tailwind CSS 설치 및 설정 (Laravel Mix 또는 Vite 사용)
4. 기본 레이아웃 Blade 파일 생성 (resources/views/layouts/app.blade.php)
   - 헤더: 작가명 로고, 네비게이션 (Home, Style Guide, Process, Contact)
   - 푸터: 소셜 미디어 링크 (Instagram, Behance 등)
   - Tailwind CSS CDN 또는 빌드된 CSS 파일 연결
5. 홈 라우트 설정 (routes/web.php에서 '/' 경로를 welcome 페이지 대신 home으로 변경)

## 디자인 가이드

- 전체적으로 밝고 깔끔한 갤러리 느낌
- 헤더는 투명 배경 또는 흰색, 스크롤 시 그림자 추가
- 폰트: Tailwind 기본 폰트 또는 Google Fonts (Poppins, Inter 추천)
- 색상: 파스텔 톤 또는 작가 시그니처 컬러 활용

작업이 완료되면 `php artisan serve`로 서버를 실행하고 http://localhost:8000 접속 시 기본 레이아웃이 표시되는지 확인하세요.

# 작품(Artwork) 모델 및 시드 데이터 생성

작가의 작품을 관리할 데이터베이스 구조를 만들고 샘플 데이터를 추가하세요.

## 요구사항

1. Artwork 모델 및 마이그레이션 생성
   - `php artisan make:model Artwork -m`
   - 테이블 컬럼:
     - title (string): 작품 제목
     - style (string): 스타일 카테고리 (예: 'line-art', 'watercolor', 'character-design')
     - image_path (string): 이미지 파일 경로
     - description (text, nullable): 작품 설명
     - hex_colors (json, nullable): 작품에 사용된 주요 색상 Hex 코드 배열
     - is_featured (boolean, default false): 메인 페이지 대표 작품 여부
     - created_at, updated_at

2. 마이그레이션 실행
   - `php artisan migrate`

3. Seeder 생성 및 샘플 데이터 추가
   - `php artisan make:seeder ArtworkSeeder`
   - 최소 8개 작품 데이터 생성
   - 스타일은 'line-art', 'watercolor', 'digital-painting', 'character-design' 중 골고루 분배
   - is_featured는 3개 작품만 true로 설정
   - hex_colors는 예시: ["#FF6B6B", "#4ECDC4", "#FFE66D"]
   - image_path는 placeholder 이미지 사용 (예: https://via.placeholder.com/600x400)

4. DatabaseSeeder에서 ArtworkSeeder 호출 설정

5. 시드 실행
   - `php artisan db:seed`

완료 후 `php artisan tinker`에서 `Artwork::count()`로 데이터가 정상적으로 들어갔는지 확인하세요.

# 메인 페이지 및 스타일 가이드 페이지 구현

작품을 보여주는 핵심 페이지 2개를 만드세요.

## 요구사항

### 1. HomeController 생성 및 라우트 설정

- `php artisan make:controller HomeController`
- HomeController에 index 메서드 추가
  - is_featured=true인 작품 3개 조회하여 뷰에 전달
- routes/web.php에서 '/' 경로를 HomeController@index로 연결

### 2. 메인 페이지 (resources/views/home.blade.php)

레이아웃:
- 히어로 섹션: 작가 이름, 짧은 소개 문구, "작품 보기" CTA 버튼
- 대표 작품 섹션: is_featured 작품 3개를 카드 형태로 가로 배치
  - 각 카드: 이미지, 제목, 스타일 태그
  - Tailwind grid (md:grid-cols-3) 사용
  - hover 시 카드 살짝 확대 효과 (transform scale-105)

### 3. StyleGuideController 생성 및 페이지

- `php artisan make:controller StyleGuideController`
- index 메서드에서 모든 작품을 style별로 그룹화하여 전달
  - `Artwork::all()->groupBy('style')`
- routes/web.php에 '/style-guide' 경로 추가

### 4. 스타일 가이드 페이지 (resources/views/style-guide.blade.php)

레이아웃:
- 페이지 제목: "작업 스타일 가이드"
- 각 스타일별 섹션 (line-art, watercolor 등)
  - 섹션 제목 (예: "라인 아트")
  - 해당 스타일 작품들을 grid로 나열 (md:grid-cols-3)
  - 각 작품 카드: 이미지, 제목, 색상 팔레트 미리보기 (작은 원형 색상 점 3~4개)

### 5. 색상 팔레트 컴포넌트

- Blade 컴포넌트 생성: `php artisan make:component ColorPalette`
- 작품의 hex_colors 배열을 받아 작은 원형 색상 칩으로 표시
- 각 색상 칩은 해당 Hex 코드 배경색 적용

완료 후 메인 페이지와 /style-guide 페이지에서 작품이 정상적으로 표시되는지 확인하세요.

# 작업 프로세스 페이지 및 문의 폼 구현

작가의 작업 과정을 보여주는 페이지와 협업 문의를 받는 폼을 추가하세요.

## 요구사항

### 1. 작업 프로세스 페이지

- ProcessController 생성: `php artisan make:controller ProcessController`
- routes/web.php에 '/process' 경로 추가
- resources/views/process.blade.php 생성

레이아웃:
- 페이지 제목: "작업 프로세스"
- 타임라인 형태로 4단계 표시 (Tailwind로 세로 라인 연결)
  1. 스케치 단계: 이미지 + 설명 텍스트
  2. 밑그림 단계: 이미지 + 설명 텍스트
  3. 채색 단계: 이미지 + 설명 텍스트
  4. 완성 단계: 이미지 + 설명 텍스트
- 각 단계는 카드 형태로, 이미지는 placeholder 또는 실제 작업 과정 이미지 사용
- 모바일에서는 타임라인이 세로로 쌓이도록 반응형 처리

### 2. 문의(Inquiry) 모델 및 폼

- Inquiry 모델 생성: `php artisan make:model Inquiry -m`
- 테이블 컬럼:
  - name (string): 문의자 이름
  - email (string): 이메일
  - message (text): 문의 내용
  - created_at, updated_at
- 마이그레이션 실행

- ContactController 생성: `php artisan make:controller ContactController`
- routes/web.php에 '/contact' GET, POST 라우트 추가
- resources/views/contact.blade.php 생성

문의 폼 레이아웃:
- 페이지 제목: "협업 문의"
- 폼 필드: 이름, 이메일, 메시지 (textarea)
- 제출 버튼: "문의하기"
- POST 요청 처리:
  - 유효성 검사 (name, email required, email format)
  - Inquiry 모델에 저장
  - 성공 시 "문의가 접수되었습니다" 메시지와 함께 폼 초기화
  - Tailwind alert 컴포넌트로 성공 메시지 표시

### 3. 네비게이션 링크 업데이트

- layouts/app.blade.php 헤더에 Process, Contact 링크 추가
- 현재 페이지 활성화 스타일 적용 (Tailwind의 @if(request()->is('process')) 등 활용)

완료 후 모든 페이지가 네비게이션을 통해 정상적으로 이동되고, 문의 폼이 작동하는지 확인하세요.