팀 스탠드업 미팅 노트 - 데일리 진행 상황 & 블로커 공유
team-standup-meeting-notes
문제 설명
프로젝트 개요
애자일 팀의 데일리 스탠드업 미팅을 효율적으로 관리하는 웹 애플리케이션입니다. 팀원들이 오늘 한 일(Yesterday), 오늘 할 일(Today), 블로커(Blockers)를 기록하고 공유할 수 있습니다.
필수 기능
- 팀원 등록 및 관리 (이름, 역할, 아바타)
- 날짜별 스탠드업 노트 작성 (Yesterday/Today/Blockers 3가지 섹션)
- 팀원별 스탠드업 노트 조회 (캘린더 뷰)
- 블로커 상태 관리 (미해결/해결 중/해결 완료)
- 주간 통계 대시보드 (참여율, 블로커 해결률)
- 반응형 디자인 (모바일 친화적)
보너스 기능
- 스탠드업 노트 템플릿 저장 기능
- 팀원별 색상 테마 지정
- 블로커에 대한 댓글 기능
- 주간 요약 이메일 발송 (시뮬레이션)
- 다크 모드 지원
기술 스택
- Laravel 13.x (백엔드)
- Inertia.js (서버-클라이언트 브릿지)
- React 19 (프론트엔드)
- Tailwind CSS (스타일링)
- SQLite (데이터베이스)
제약 조건
- • Laravel 13.x + Inertia.js + React 19 모노리스 풀스택 구조 (별도 API 라우트 없음)
- • Laravel Breeze React+Inertia starter kit으로 프로젝트 생성
- • SQLite 데이터베이스 사용 (간편한 로컬 개발)
- • Tailwind CSS로 모든 스타일링 처리
- • Inertia::render()로 Laravel 컨트롤러에서 React 컴포넌트에 데이터 전달
- • Laravel Eloquent ORM과 마이그레이션 활용
- • React 컴포넌트는 Pages 폴더에 구성
- • useState, useReducer 등 React Hooks 활용
- • 폼 검증은 Laravel의 Request Validation 사용
- • 날짜 처리는 Carbon 라이브러리 활용
프롬프트 레시피
아래 프롬프트를 순서대로 AI에게 보내면 됩니다. 복사 버튼을 눌러 바로 사용하세요.
mkdir team-standup-meeting-notes && cd team-standup-meeting-notes 이 폴더에서 Laravel 13.x + Inertia.js + React 19 프로젝트를 시작합니다. 다음 명령으로 Laravel Breeze React+Inertia starter kit 프로젝트를 생성하세요: ```bash composer create-project laravel/laravel . composer require laravel/breeze --dev php artisan breeze:install react php artisan migrate npm install ``` 프로젝트 구조를 확인하고, .env 파일에서 DB_CONNECTION=sqlite로 설정한 후 database/database.sqlite 파일을 생성하세요. 기본 인증 기능(로그인/회원가입)이 포함된 Breeze 스타터 킷이 설치되었는지 확인하고, npm run dev로 프론트엔드 빌드가 정상 작동하는지 테스트하세요.
기대 결과: Laravel 13.x + Breeze React+Inertia 프로젝트가 생성되고, SQLite 데이터베이스가 설정되며, 기본 인증 페이지(로그인/회원가입)가 작동합니다. http://localhost:8000으로 접속 시 Welcome 페이지가 보입니다.
팀원(TeamMember)과 스탠드업 노트(StandupNote) 모델을 생성하고 마이그레이션을 작성하세요. **TeamMember 모델:** - id (primary key) - name (string, 팀원 이름) - role (string, 역할: Developer, Designer, PM 등) - avatar_color (string, 아바타 배경색 hex 코드, 예: #3B82F6) - timestamps **StandupNote 모델:** - id (primary key) - team_member_id (foreign key, team_members 테이블 참조) - date (date, 스탠드업 날짜) - yesterday (text, 어제 한 일) - today (text, 오늘 할 일) - blockers (text, nullable, 블로커 내용) - blocker_status (enum: 'none', 'open', 'in_progress', 'resolved', default: 'none') - timestamps 모델 간 관계 설정: - TeamMember hasMany StandupNote - StandupNote belongsTo TeamMember 마이그레이션을 실행하고, 테스트용 시더를 작성하여 팀원 3명과 각각의 스탠드업 노트 5개씩 생성하세요. ```bash php artisan make:model TeamMember -m php artisan make:model StandupNote -m php artisan make:seeder TeamMemberSeeder php artisan migrate:fresh --seed ```
기대 결과: team_members와 standup_notes 테이블이 생성되고, 테스트 데이터(팀원 3명, 각 5개의 스탠드업 노트)가 시딩됩니다. 모델 간 관계가 정상적으로 설정됩니다.
팀원 목록 페이지와 팀원 등록 기능을 구현하세요.
**Laravel 컨트롤러 (TeamMemberController):**
- index() 메서드: 모든 팀원 조회하여 Inertia::render('TeamMembers/Index')로 전달
- store() 메서드: 팀원 등록 (name, role, avatar_color 검증 후 저장)
- destroy() 메서드: 팀원 삭제
**React 페이지 컴포넌트 (resources/js/Pages/TeamMembers/Index.jsx):**
- 팀원 목록을 카드 형태로 표시 (아바타 색상, 이름, 역할)
- 팀원 추가 버튼 클릭 시 모달 또는 인라인 폼 표시
- 폼: 이름, 역할 입력 필드, 아바타 색상 선택기 (미리 정의된 5가지 색상 중 선택)
- Inertia의 useForm 훅 사용하여 폼 제출 처리
- 팀원 삭제 버튼 (확인 알림 후 삭제)
**라우트 설정 (routes/web.php):**
```php
Route::middleware('auth')->group(function () {
Route::get('/team-members', [TeamMemberController::class, 'index'])->name('team-members.index');
Route::post('/team-members', [TeamMemberController::class, 'store'])->name('team-members.store');
Route::delete('/team-members/{teamMember}', [TeamMemberController::class, 'destroy'])->name('team-members.destroy');
});
```
Tailwind CSS로 깔끔한 UI를 구성하세요.
기대 결과: 팀원 목록 페이지가 작동하고, 새 팀원을 등록하거나 삭제할 수 있습니다. 아바타 색상이 시각적으로 표시되며, 폼 검증이 정상 작동합니다.
스탠드업 노트 작성 및 조회 기능을 구현하세요.
**Laravel 컨트롤러 (StandupNoteController):**
- index() 메서드: 날짜별 또는 팀원별 스탠드업 노트 조회 (쿼리 파라미터로 필터링)
- create() 메서드: 스탠드업 노트 작성 폼 페이지 (팀원 목록 전달)
- store() 메서드: 스탠드업 노트 저장 (team_member_id, date, yesterday, today, blockers, blocker_status 검증)
- update() 메서드: 블로커 상태 업데이트 (blocker_status만 수정 가능)
**React 페이지 컴포넌트 (resources/js/Pages/StandupNotes/Index.jsx):**
- 날짜 선택기 (기본값: 오늘)
- 선택한 날짜의 모든 팀원 스탠드업 노트를 카드 형태로 표시
- 각 카드: 팀원 이름, 아바타, Yesterday/Today/Blockers 섹션
- 블로커가 있는 경우 상태 배지 표시 (Open: 빨강, In Progress: 노랑, Resolved: 초록)
- 블로커 상태 변경 드롭다운 (인라인 업데이트)
**React 페이지 컴포넌트 (resources/js/Pages/StandupNotes/Create.jsx):**
- 팀원 선택 드롭다운
- 날짜 선택 (기본값: 오늘)
- Yesterday, Today, Blockers 텍스트 영역
- Blockers가 입력된 경우 blocker_status를 'open'으로 자동 설정
- useForm 훅으로 폼 제출 처리
**라우트 추가:**
```php
Route::middleware('auth')->group(function () {
Route::get('/standup-notes', [StandupNoteController::class, 'index'])->name('standup-notes.index');
Route::get('/standup-notes/create', [StandupNoteController::class, 'create'])->name('standup-notes.create');
Route::post('/standup-notes', [StandupNoteController::class, 'store'])->name('standup-notes.store');
Route::patch('/standup-notes/{standupNote}/status', [StandupNoteController::class, 'update'])->name('standup-notes.update-status');
});
```
네비게이션 메뉴에 팀원 관리, 스탠드업 노트 링크를 추가하세요.
기대 결과: 스탠드업 노트 작성 페이지에서 노트를 등록할 수 있고, 조회 페이지에서 날짜별로 팀원들의 노트를 확인할 수 있습니다. 블로커 상태를 인라인으로 변경할 수 있습니다.
주간 통계 대시보드를 구현하세요.
**Laravel 컨트롤러 (DashboardController):**
- index() 메서드:
- 이번 주(월~금) 스탠드업 참여율 계산 (전체 예상 노트 수 대비 실제 작성된 노트 수)
- 블로커 해결률 계산 (전체 블로커 중 'resolved' 상태 비율)
- 최근 7일간 일별 참여 팀원 수 차트 데이터
- 팀원별 이번 주 참여 횟수
- Inertia::render('Dashboard')로 통계 데이터 전달
**React 페이지 컴포넌트 (resources/js/Pages/Dashboard.jsx):**
- 상단 KPI 카드 4개: 이번 주 참여율, 블로커 해결률, 총 팀원 수, 미해결 블로커 수
- 최근 7일간 일별 참여 팀원 수 막대 차트 (Chart.js 또는 Recharts 라이브러리 사용)
- 팀원별 이번 주 참여 현황 테이블
- Tailwind CSS로 대시보드 레이아웃 구성
**라우트 설정:**
```php
Route::middleware('auth')->get('/dashboard', [DashboardController::class, 'index'])->name('dashboard');
```
Chart.js 또는 Recharts를 npm으로 설치하고 차트를 구현하세요:
```bash
npm install recharts
```
기대 결과: 대시보드 페이지에 이번 주 참여율, 블로커 해결률 등 주요 지표가 표시되고, 최근 7일간 참여 추이를 시각화한 차트가 보입니다. 팀원별 참여 현황 테이블이 정상 작동합니다.
캘린더 뷰와 팀원별 스탠드업 히스토리 페이지를 추가하세요.
**Laravel 컨트롤러 (StandupNoteController):**
- calendar() 메서드: 월별 캘린더 데이터 생성 (날짜별 스탠드업 노트 작성 여부 표시)
- history() 메서드: 특정 팀원의 스탠드업 노트 전체 히스토리 조회 (페이지네이션)
**React 페이지 컴포넌트 (resources/js/Pages/StandupNotes/Calendar.jsx):**
- 월 선택기 (이전/다음 달 이동 버튼)
- 캘린더 그리드 (일~토, 각 날짜에 스탠드업 노트 작성 여부 표시)
- 노트가 있는 날짜 클릭 시 해당 날짜의 스탠드업 노트 목록 모달 표시
- Tailwind CSS로 캘린더 UI 구성
**React 페이지 컴포넌트 (resources/js/Pages/StandupNotes/History.jsx):**
- 팀원 선택 드롭다운
- 선택한 팀원의 스탠드업 노트 전체 목록 (최신순, 페이지네이션)
- 각 노트 카드: 날짜, Yesterday/Today/Blockers, 블로커 상태
- 검색 필터 (날짜 범위, 블로커 상태)
**라우트 추가:**
```php
Route::middleware('auth')->group(function () {
Route::get('/standup-notes/calendar', [StandupNoteController::class, 'calendar'])->name('standup-notes.calendar');
Route::get('/standup-notes/history', [StandupNoteController::class, 'history'])->name('standup-notes.history');
});
```
네비게이션 메뉴에 캘린더, 히스토리 링크를 추가하세요.
기대 결과: 캘린더 뷰에서 월별로 스탠드업 노트 작성 여부를 시각적으로 확인할 수 있고, 날짜 클릭 시 해당 날짜의 노트를 볼 수 있습니다. 히스토리 페이지에서 팀원별 전체 스탠드업 노트를 검색하고 필터링할 수 있습니다.