Laravel 간단 이벤트 티켓 발급기 - QR 코드 생성 & 참석 확인

mkdir laravel-event-ticket-generator && cd laravel-event-ticket-generator

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

다음 작업을 수행해주세요:

1. Laravel 13.x 프로젝트 생성 (composer create-project laravel/laravel . "13.*")
2. .env 파일에서 DB_CONNECTION을 sqlite로 변경
3. database/database.sqlite 파일 생성 (touch 명령 또는 빈 파일 생성)
4. php artisan migrate 실행하여 기본 테이블 생성
5. Tailwind CSS 설치 및 설정 (npm install -D tailwindcss postcss autoprefixer && npx tailwindcss init -p)
6. tailwind.config.js에서 content 경로 설정: ["./resources/**/*.blade.php", "./resources/**/*.js"]
7. resources/css/app.css에 Tailwind directives 추가:
   @tailwind base;
   @tailwind components;
   @tailwind utilities;
8. npm run build 실행하여 CSS 빌드
9. QR 코드 생성 패키지 설치: composer require simplesoftwareio/simple-qrcode
10. php artisan serve로 서버 실행하여 Laravel 초기 화면 확인

모든 설정이 완료되면 "Laravel 프로젝트가 성공적으로 설정되었습니다!"라고 출력해주세요.

티켓 데이터를 저장할 데이터베이스 테이블과 모델을 생성합니다.

다음 작업을 수행해주세요:

1. Ticket 모델과 마이그레이션 파일 생성: php artisan make:model Ticket -m
2. 마이그레이션 파일(database/migrations/xxxx_create_tickets_table.php)에 다음 컬럼 추가:
   - name (string, 참가자 이름)
   - email (string, 이메일)
   - event_name (string, 이벤트명)
   - ticket_number (string, unique, 고유 티켓 번호)
   - qr_code_path (string, nullable, QR 코드 이미지 저장 경로)
   - is_checked_in (boolean, default false, 참석 여부)
   - timestamps (created_at, updated_at)
3. app/Models/Ticket.php에 fillable 속성 추가:
   protected $fillable = ['name', 'email', 'event_name', 'ticket_number', 'qr_code_path', 'is_checked_in'];
4. php artisan migrate 실행하여 tickets 테이블 생성
5. php artisan tinker로 접속하여 Ticket::count() 실행해서 0이 반환되는지 확인

완료되면 "Ticket 모델과 테이블이 생성되었습니다!"라고 출력해주세요.

티켓 신청 폼과 티켓 목록을 보여주는 Blade 뷰를 만들고, 라우트와 컨트롤러를 연결합니다.

다음 작업을 수행해주세요:

1. TicketController 생성: php artisan make:controller TicketController
2. routes/web.php에 라우트 추가:
   - GET / → TicketController@index (티켓 목록 페이지)
   - GET /create → TicketController@create (티켓 신청 폼)
   - POST /tickets → TicketController@store (티켓 생성)
   - GET /tickets/{ticket} → TicketController@show (티켓 상세)
   - POST /tickets/{ticket}/checkin → TicketController@checkIn (참석 체크)
3. TicketController에 index, create, store, show, checkIn 메서드 생성
4. resources/views/layout.blade.php 생성 (기본 레이아웃):
   - <!DOCTYPE html> 구조
   - <head>에 @vite(['resources/css/app.css']) 추가
   - <body>에 네비게이션 바 (홈, 티켓 신청 링크)
   - @yield('content') 영역
   - Tailwind CSS 스타일 적용 (bg-gray-100, container, mx-auto 등)
5. resources/views/tickets/index.blade.php 생성:
   - @extends('layout')
   - 제목: "발급된 티켓 목록"
   - 티켓 목록을 테이블로 표시 (이름, 이메일, 이벤트명, 티켓 번호, 참석 여부)
   - 각 티켓마다 "상세 보기" 링크
   - Tailwind CSS로 깔끔한 카드 스타일 적용
6. resources/views/tickets/create.blade.php 생성:
   - @extends('layout')
   - 제목: "티켓 신청하기"
   - 폼 (POST /tickets):
     - 이름 입력 (required)
     - 이메일 입력 (required, email)
     - 이벤트 선택 (select: "Laravel 세미나", "웹 개발 워크숍", "스타트업 네트워킹 파티")
     - @csrf 토큰
     - 제출 버튼 ("티켓 발급받기")
   - Tailwind CSS 폼 스타일 (input, select, button)
7. TicketController@index 메서드에서 Ticket::all()로 모든 티켓 조회 후 뷰에 전달
8. TicketController@create 메서드에서 create.blade.php 뷰 반환

localhost:8000에서 티켓 목록 페이지가 보이고, /create에서 신청 폼이 정상적으로 렌더링되는지 확인해주세요.

완료되면 "티켓 신청 폼과 목록 페이지가 생성되었습니다!"라고 출력해주세요.

티켓 생성 로직을 구현하고, 고유한 티켓 번호와 QR 코드를 자동 생성합니다.

다음 작업을 수행해주세요:

1. TicketController@store 메서드 구현:
   - 폼 데이터 유효성 검사 (name, email, event_name 필수)
   - 고유 티켓 번호 생성 (예: "TICKET-" . strtoupper(Str::random(8)))
   - Ticket 모델 생성 및 저장
   - QR 코드 생성: SimpleSoftwareIO\SimpleQrCode\Facades\QrCode 사용
     - QrCode::format('png')->size(300)->generate($ticket->ticket_number, public_path('qrcodes/' . $ticket->ticket_number . '.png'))
   - 생성된 QR 코드 경로를 ticket의 qr_code_path에 저장 ('qrcodes/' . $ticket->ticket_number . '.png')
   - 티켓 상세 페이지로 리다이렉트 (return redirect()->route('tickets.show', $ticket))
2. public/qrcodes 폴더가 없으면 자동 생성 (Storage 파사드 또는 mkdir)
3. routes/web.php에서 라우트 이름 지정:
   - Route::get('/', [TicketController::class, 'index'])->name('tickets.index');
   - Route::get('/create', [TicketController::class, 'create'])->name('tickets.create');
   - Route::post('/tickets', [TicketController::class, 'store'])->name('tickets.store');
   - Route::get('/tickets/{ticket}', [TicketController::class, 'show'])->name('tickets.show');
4. use Illuminate\Support\Str; 임포트 추가
5. use SimpleSoftwareIO\SimpleQrCode\Facades\QrCode; 임포트 추가

티켓 신청 폼을 작성하고 제출하면, 티켓이 생성되고 QR 코드 이미지 파일이 public/qrcodes 폴더에 저장되는지 확인해주세요.

완료되면 "티켓 생성 및 QR 코드 자동 생성 기능이 완료되었습니다!"라고 출력해주세요.

티켓 상세 페이지를 만들고, QR 코드와 참석 체크 기능을 추가합니다.

다음 작업을 수행해주세요:

1. resources/views/tickets/show.blade.php 생성:
   - @extends('layout')
   - 제목: "티켓 상세 정보"
   - 티켓 정보 카드:
     - 참가자 이름
     - 이메일
     - 이벤트명
     - 티켓 번호 (큰 글씨, 강조)
     - 참석 상태 (is_checked_in이 true면 "✅ 참석 완료", false면 "⏳ 미참석")
   - QR 코드 이미지 표시:
     - <img src="{{ asset($ticket->qr_code_path) }}" alt="QR Code" class="w-64 h-64 mx-auto">
   - 참석 체크 버튼:
     - is_checked_in이 false일 때만 표시
     - 폼 (POST /tickets/{ticket}/checkin): @csrf, 버튼 "참석 확인하기"
   - 목록으로 돌아가기 링크
   - Tailwind CSS 스타일: 카드 레이아웃, 그림자, 여백, 버튼 색상 등
2. TicketController@show 메서드 구현:
   - Ticket 모델 인스턴스를 뷰에 전달 (return view('tickets.show', compact('ticket'));)
3. TicketController@checkIn 메서드 구현:
   - $ticket->update(['is_checked_in' => true]);
   - return redirect()->route('tickets.show', $ticket)->with('success', '참석이 확인되었습니다!');
4. routes/web.php에 checkIn 라우트 추가:
   - Route::post('/tickets/{ticket}/checkin', [TicketController::class, 'checkIn'])->name('tickets.checkin');
5. layout.blade.php에 성공 메시지 표시 영역 추가:
   - @if(session('success'))
       <div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4">
         {{ session('success') }}
       </div>
     @endif

티켓 상세 페이지에서 QR 코드가 정상적으로 보이고, "참석 확인하기" 버튼을 누르면 참석 상태가 변경되는지 테스트해주세요.

완료되면 "티켓 상세 페이지 및 참석 체크 기능이 완료되었습니다!"라고 출력해주세요.

티켓 목록 페이지를 개선하고, 전체 프로젝트를 마무리합니다.

다음 작업을 수행해주세요:

1. resources/views/tickets/index.blade.php 개선:
   - 티켓이 없을 때: "아직 발급된 티켓이 없습니다. 지금 신청하세요!" 메시지와 신청 페이지 링크 표시
   - 티켓이 있을 때:
     - 각 티켓을 카드 형태로 표시 (grid 레이아웃, gap-4)
     - 카드 내용: 이름, 이벤트명, 티켓 번호, 참석 상태 배지
     - 참석 완료는 초록색 배지, 미참석은 회색 배지
     - 카드 하단에 "상세 보기" 버튼
   - Tailwind CSS로 반응형 그리드 (grid-cols-1 md:grid-cols-2 lg:grid-cols-3)
2. 네비게이션 바 개선 (layout.blade.php):
   - 로고/제목: "🎫 이벤트 티켓 시스템"
   - 링크: "티켓 목록", "티켓 신청"
   - 모바일 반응형 (햄버거 메뉴는 선택사항)
3. 폼 유효성 검사 에러 표시 (create.blade.php):
   - @error('name') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
   - 각 입력 필드 아래에 에러 메시지 표시
4. README.md 파일 작성:
   - 프로젝트 설명
   - 설치 방법 (composer install, npm install, php artisan migrate, php artisan serve)
   - 사용 기술 스택 (Laravel 13.x, Blade, Tailwind CSS, SQLite, simple-qrcode)
   - 주요 기능 설명
   - 스크린샷 (선택사항)
5. .gitignore에 public/qrcodes 추가 (QR 코드 이미지는 git에 커밋하지 않음)
6. php artisan optimize 실행하여 캐시 최적화
7. 전체 기능 테스트:
   - 티켓 신청 → QR 코드 생성 확인
   - 티켓 목록에서 카드 레이아웃 확인
   - 티켓 상세 페이지에서 QR 코드 및 참석 체크 확인
   - 모바일 화면에서 반응형 동작 확인

모든 기능이 정상 작동하는지 확인하고, 프로젝트를 완성해주세요.

완료되면 "🎉 Laravel 이벤트 티켓 발급기 프로젝트가 완성되었습니다!"라고 출력해주세요.