Project

👉🏻서비스 바로가기

❤️ 팀명 - 댕청냥청 🐶 🐱

💛 주제 - 유기동물과 입양자의 성격유형을 고려한 매칭 시스템

💚 팀원소개👪 & 역할

팀장 😚 유혜린

팀원 😏 고소영, 김승환, 박경수, 정현희, 최규식 😏

유혜린 - 팀장. 인프라 담당 및 백엔드 개발
김승환 - 팀원. 백엔드 개발
정현희 - 팀원. 백엔드 개발
박경수 - 부팀장. 프론트엔드 개발 및 QA
고소영 - 팀원. 프론트엔드 개발 및 UI/UX 담당
최규식 - 팀원. 프론트엔드 개발

💙 서비스 소개

• 입양자의 MBTI 성격과 유기동물의 성격을 고려한 입양 매칭 시스템입니다.
• 라이브 스트리밍 기능을 적용하여 유기동물 입양을 활성화 할 수 있습니다.

💜 Epic, Story

• Epic 1. 회원가입/ 로그인/ 아이디 및 비밀번호찾기

  • story1. 비회원이 정보를 입력하여 회원가입을 한다.(이름, 아이디, 비밀번호, 이메일)
  • story2. 회원이 아이디와 비밀번호를 입력하고 로그인 한다.
  • story3. 회원이 등록된 정보로 아이디를 찾을 수 있다.
  • story4. 회원이 등록된 이메일을 통해 임시비밀번호를 발급받는다.
  • story5. 회원이 로그아웃을 한다.

• Epic 2. 메인페이지

  • story1. 상단에 메뉴바
  • story2. 첫번째) 매칭하기/ 둘러보기 2가지 버튼 → (로그인페이지) → 설문페이지
  • story3. 두번째) 어떤방식으로 매칭되는지 간단한 설명 (토글 OR 호버)
  • story4. 세번째) 라이브 스트리밍 영상을 띄운다
  • story5. 네번째) footer
  • story6. 사이트 이용자는 메인페이지에서 영상을 볼 수 있다.
  • story7. 사이트 이용자는 더보기 버튼을 통해 동영상 게시판페이지로 이동한다.

• Epic 3. MBTI입력&설문페이지

  • story1. MBTI를 모를경우 링크를 타고 들어가서 설문을 할 수 있다.
  • story2. 라디오버튼(8개 중 4개 선택 필수)으로 자신의 MBTI를 입력한다.
  • story3. 설문에 답변한다. (핏펫몰 또는 한국일보 참고)
  • story4. 설문 완료 버튼 클릭 시 Epic4로 이동한다.

• Epic 4. 매칭된 유기동물 목록 페이지

  • story1. 비로그인 회원이 모든 유기동물 목록 조회가 가능하다.
  • story2. 로그인한 회원이 MBTI&설문 기반 매칭된 유기동물 목록 조회가 가능하다.
  • story3. 둘러보기버튼을 클릭한 비회원 유저는 전체 동물목록을 조회가 가능하다.
  • story4. 매칭하기버튼을 클릭한 비회원 유저는 로그인 창을 통해 로그인 후 설문페이지로 이동한다.
  • story5. 사이트 이용자는 모든동물 탭에서 등록된 모든 동물을 볼 수 있다.
  • story6. 회원은 매칭 시스템을 거쳐 매칭된 동물을 볼 수 있다.
  • story7. 회원은 즐겨찾는 동물 탭에서 즐겨찾기 등록한 동물을 볼 수 있다.
  • story8. 각 동물별 Info는 카드 뒤집기(앞 : 사진, 뒤 : 정보(성격태그, 견종, 나이)) 카드 우상단에 즐찾버튼
  • story9. 회원은 동물별 필터링(견종, 성별) 기능을 활용한다.

• Epic 5. 동물 상세정보 페이지

  • story1. 유기동물 상세정보를 조회한다. ( 일련번호, 사진, 입양상태, 지역분류, 종류, 품종, 성별, 발견장소, 구조일, 공고기간, 입양가능일, 나이, 몸무게, 모색, 기타정보 )
  • story2. 입양신청 버튼을 클릭하면 입양신청페이지로 이동한다.

• Epic 6. 동영상 게시판 ( 라이브 스트리밍 영상 포함 )

  • story1. 사이트 이용자는 동물들의 영상 목록을 볼 수 있다.
  • story2. 사이트 이용자는 영상을 눌렀을 때 재생된 영상을 볼 수 있다.
  • story3. 관리자는 동영상을 등록, 수정, 삭제 할 수 있다.

• Epic 7. 입양신청페이지

  • story1. 입양신청페이지 상단에 동물정보를 볼 수 있다.
  • story2. 회원은 입양신청서를 작성한다.( 이름, 주소, 연락처,유기동물번호 )
  • story3. 회원은 연락처 입력 후 문자 인증을 한다.
  • story4. 회원은 신청완료 후 입양신청목록페이지로 이동한다.

• Epic 8. 입양신청목록페이지

  • story1. 회원은 입양신청한 목록을 볼 수 있다.
  • story2. 회원은 자신의 입양신청내역을 조회, 삭제할 수 있다.
  • story3. 관리자는 모든 입양신청내역을 조회할 수 있다.

• Epic 9. 헤더

  • story1. 사이트 이용자는 home 버튼을 통해 메인페이지로 이동한다.
  • story2. 사이트 이용자는 로그인/회원가입 버튼을 통해 로그인/회원가입 페이지로 이동한다.
  • story3. 사이트 이용자는 동물영상 버튼을 통해 영상목록페이지로 이동한다.
  • story4. 사이트 이용자는 동물목록 버튼을 통해 유기동물목록페이지로 이동한다.
  • story5. 회원은 입양신청목록 버튼을 통해 입양신청목록페이지로 이동한다. HOME , 회원가입 / 로그인 / 로그아웃, 동영상 게시판, 유기동물 목록 페이지

• 추후 부가기능 : 공지사항 게시판, 연구소 게시판, 찾아주세요, 챗봇, 후원게시판, 입양신청페이지/ 동물등록페이지/ 입양관리페이지, 동물등록페이지, 입양후기게시판

❤️ 개발 흐름

6주
1주 : 기획/설계, API, DB설계
2주 : 프로젝트 기본 구성 / 개발 환경 세팅
3주 : 기본 기능 개발
4주 : 심화 개발1
5주 : 심화 개발2 & 테스트
6주 : 배포 & UCC/PPT제작

💛 ERD

💚 핵심기능 화면

💙 기술스택

💜 프로젝트 실행방법

Frontend

npm i
npm run serve

Backend