반려동물 입양 매칭 서비스

회원가입 · 로그인

“나는 입양 희망자 또는 보호소 담당자로서, Firebase Auth 이메일/비밀번호로 계정을 만들고 로그인하여 서비스를 이용하고 싶다.”

• ✓이메일·비밀번호로 회원가입 시 Firestore users 컬렉션에 uid·email·name·role(adopter 기본값) 문서가 생성된다
• ✓로그인 성공 시 Firebase Auth 세션이 유지되며 역할(role)에 따라 리다이렉트된다(shelter → 관리자 대시보드, adopter → 동물 목록)
• ✓비로그인 사용자가 신청·문의 등 보호 라우트 접근 시 로그인 페이지로 리다이렉트된다
• ✓환경변수는 NEXT_PUBLIC_ 접두사 규칙을 준수하며, 서비스 어드민 키는 절대 클라이언트 번들에 포함되지 않는다

동물 등록 · 관리

“나는 보호소 담당자로서, 입양 대상 동물의 정보(이름·종·나이·사진·설명 등)를 등록·수정·삭제하여 입양 희망자에게 노출하고 싶다.”

• ✓role이 shelter인 사용자만 동물 등록·수정·삭제 폼에 접근할 수 있다(Firestore 보안 규칙 + 클라이언트 가드 이중 적용)
• ✓등록 시 name·species·age·gender·description·imageUrl·status(available 기본값)·shelterId 필드가 저장된다
• ✓이미지는 Firebase Storage URL 문자열로 저장하며, 업로드 실패 시 에러 메시지를 표시한다
• ✓동물 삭제 시 연관 applications·inquiries 문서는 삭제되지 않으며, 해당 동물의 status를 deleted로 변경하는 소프트 삭제를 사용한다

동물 목록 · 상세 탐색

“나는 입양 희망자로서, 등록된 동물을 종·성별로 필터링하고 상세 정보를 확인하여 입양 여부를 결정하고 싶다.”

• ✓동물 목록 페이지는 status가 available인 동물만 카드 형태로 표시하며, 종(species)·성별(gender) 필터를 제공한다
• ✓각 카드에는 대표 이미지·이름·종·나이·보호소명이 표시된다
• ✓동물 상세 페이지에서 전체 설명·상태·보호소 정보와 '입양 신청하기' 버튼이 표시된다
• ✓비로그인 사용자도 목록·상세 조회는 가능하며, '입양 신청하기' 클릭 시 로그인 페이지로 이동한다

입양 신청

“나는 입양 희망자로서, 마음에 드는 동물에 대해 입양 신청서를 작성하여 보호소에 전달하고 싶다.”

• ✓로그인한 adopter만 신청 폼에 접근할 수 있으며, 동일 동물에 대한 중복 신청은 Firestore 보안 규칙으로 차단된다
• ✓신청 폼에는 거주 형태·가족 구성원 수·반려동물 경험·신청 메시지 필드가 포함된다
• ✓신청 저장 시 status는 pending으로 초기화되고, animalId·userId·createdAt이 함께 기록된다
• ✓신청 완료 후 '내 신청 내역' 페이지로 이동하며 신청 상태(pending·approved·rejected)가 표시된다

신청 관리 · 승인

“나는 보호소 담당자로서, 내 보호소 동물에 대한 입양 신청 목록을 확인하고 승인 또는 거절 처리를 하고 싶다.”

• ✓관리자 대시보드는 role이 shelter인 사용자만 접근 가능하며, 자신의 shelterId에 연결된 신청만 조회된다
• ✓각 신청 행에 신청자 이름·신청 메시지·신청일이 표시되고, 승인·거절 버튼이 제공된다
• ✓승인 시 applications.status → approved, 해당 animals.status → adopted 로 일괄 업데이트된다
• ✓거절 시 applications.status → rejected로만 변경되며 동물 status는 유지된다

문의 폼

“나는 입양 희망자로서, 특정 동물에 대해 궁금한 점을 보호소에 문의 메시지로 남기고 싶다.”

• ✓로그인한 사용자만 문의 폼을 제출할 수 있으며, 비로그인 시 로그인 페이지로 리다이렉트된다
• ✓문의 저장 시 animalId·userId·message·createdAt이 Firestore inquiries 컬렉션에 기록된다
• ✓보호소 담당자는 관리자 대시보드의 문의 탭에서 해당 동물의 문의 목록을 열람할 수 있다
• ✓문의 제출 성공·실패 시 인라인 피드백 메시지가 표시된다

M0프로젝트 초기 설정 및 인프라 구성

• •Firebase 프로젝트 생성 및 Firestore, Firebase Auth(이메일/소셜) 활성화
• •Next.js 14 App Router 프로젝트 생성 (npx create-next-app@latest)
• •.env.local 생성 — NEXT_PUBLIC_FIREBASE_* 클라이언트 키 환경변수 설정 (서비스 계정 키는 GOOGLE_APPLICATION_CREDENTIALS로만 관리)
• •firebase.json · .firebaserc 초기화 (Hosting 타겟: Next.js)
• •firebase-admin, firebase, tsx 의존성 설치
• •firestore.rules 배포: firebase deploy --only firestore:rules
• •firestore.indexes.json 배포: firebase deploy --only firestore:indexes
• •npx tsx seed.ts 실행 — 데모 데이터 삽입 및 Firestore 콘솔에서 확인

M1Firebase Auth 연동 및 사용자 역할 관리

• •lib/firebase.ts — 클라이언트 SDK 초기화 (환경변수 사용, 하드코딩 금지)
• •lib/auth.ts — signUp / signIn / signOut 헬퍼 구현
• •회원가입 시 Firestore users/{uid} 문서 생성 (role: 'adopter' 기본값)
• •AuthContext / useAuth 훅 구현 — 로그인 상태 전역 관리
• •middleware.ts — 비로그인 사용자의 보호 라우트(/apply, /admin) 접근 차단
• •firestore.rules 검증 — role 기반 read/write 단위 테스트 (Firebase Emulator)

M2동물 등록 및 목록/상세 화면

• •Firestore animals 컬렉션 CRUD 서비스 함수 작성 (lib/animals.ts)
• •GET /animals — species·status 필터 + createdAt 정렬 복합 쿼리 구현 (indexes 활용)
• •랜딩 페이지(/) — 서비스 소개 + 최근 등록 동물 카드 목록 (SSG)
• •동물 목록 페이지(/animals) — 필터(종류/상태) + 카드 그리드 (CSR onSnapshot)
• •동물 상세 페이지(/animals/[id]) — 이미지, 상세 정보, 신청/문의 버튼 (SSR)
• •보호소 동물 등록 폼(/shelter/animals/new) — shelter role 만 접근, 이미지 URL 입력
• •보호소 동물 수정·삭제(/shelter/animals/[id]/edit) — shelterId 소유권 검증

M3입양 신청 및 신청자 목록

• •Firestore applications 컬렉션 서비스 함수 작성 (lib/applications.ts)
• •입양 신청 페이지(/animals/[id]/apply) — 로그인 필수, 신청 메시지 입력 폼
• •신청 생성 시 status: 'pending' 고정, userId = 현재 로그인 uid 자동 설정
• •내 신청 목록 페이지(/mypage/applications) — 본인 신청 내역 조회
• •보호소 신청자 목록 페이지(/shelter/applications) — 보호소 소유 동물의 신청만 표시
• •중복 신청 방지 — 동일 animalId + userId 신청 존재 시 UI 차단

M4관리자 승인 및 동물 상태 관리

• •관리자 대시보드(/admin) — admin role 전용, middleware로 접근 제어
• •신청 승인/거절 기능 — applications/{id} status 필드 업데이트 (approved/rejected)
• •승인 시 해당 animals/{id} status를 'pending'으로 자동 변경
• •최종 입양 완료 처리 — animals/{id} status를 'adopted'로 변경
• •관리자 동물 관리 — 전체 동물 목록 조회·상태 수동 변경
• •firestore.rules 재검증 — admin/shelter 권한 분리 Emulator 테스트

M5문의 폼 및 UI 마무리

• •Firestore inquiries 컬렉션 서비스 함수 작성 (lib/inquiries.ts)
• •동물 상세 페이지 내 문의 폼 컴포넌트 — 로그인 사용자만 제출 가능
• •문의 생성 시 message 최대 1000자 제한 (rules + 클라이언트 이중 검증)
• •보호소 문의 수신함(/shelter/inquiries) — 자신의 동물에 달린 문의 목록
• •Tailwind CSS 기반 반응형 레이아웃 (모바일 우선) 적용
• •로딩 스켈레톤 · 에러 바운더리 공통 컴포넌트 구현

M6Firebase Hosting 배포 및 QA

• •next.config.js output 설정 확인 (Firebase Hosting + Cloud Functions 또는 Static Export)
• •firebase.json hosting 리라이트 규칙 설정 (Next.js App Router 대응)
• •환경변수 .env.production 점검 — 시크릿 미노출 확인
• •Firebase Emulator Suite 전체 통합 테스트 (Auth·Firestore·Hosting)
• •firestore.rules 최종 보안 감사 — 미인증 쓰기 차단 확인
• •firebase deploy --only hosting,firestore 로 프로덕션 배포
• •배포 후 주요 플로우 E2E 검증 (회원가입→동물조회→신청→관리자승인)