💰파이낸스 세븐

테스트 기반으로 회원에게 맞춤형 금융상품 정보 제공

2023.2.13 ~ 2023.2.24(2주)

서비스 링크 : https://finance-seven.netlify.app/
Wiki 링크 : https://github.com/eun0leee/finance-seven/wiki

1. 담당 구현 기능

1.1 검색 페이지

검색바, 최근 본 상품

• 상품명으로 검색이 가능하며, 입력된 글자가 있을 시 우측 삭제 버튼 등장합니다.
• 검색어가 없으면 confirm('검색어를 입력해주세요') 확인창이 뜨고, Submit 시에 검색결과 페이지로 이동합니다.
• 최근 본 상품을 볼 수 있으며, 클릭 시 해당 상품의 상세페이지로 이동합니다.

최근 검색어

• 최근 검색어는 최대 10개까지 제공되며, 최신순으로 정렬됩니다.
• 전체 삭제 완료시, 삭제 개수 토스트 메시지(ex. 00개가 삭제됐어요)가 뜹니다.
• 최근 검색어 없을 시, 문구(최근 찾아봤던 내역이 없습니다.)가 출력됩니다.

검색어 자동저장 끄기/켜기

• 켜져있을 때만 검색한 것이 최근 검색어 목록에 저장되며, 꺼져있을 때는 문구(검색어 저장 기능이 꺼져있습니다.)가 출력됩니다.
• 켜기/끄기 상태에 따라 confirm(최근 검색어 저장 기능을 사용(사용중지)하시겠습니까?)가 출력됩니다.

1.2 검색결과 페이지

• 탭 전환(통합, 카드, 대출, 예적금, 청약)을 제공합니다.
• 통합에서는 카테고리별로 최대 3개까지 결과를 제공하고, 모두보기 버튼 클릭 시 해당 카테고리 탭으로 이동합니다.
• 각 탭은 정렬 버튼에 따라 상품 목록 순서를 변경할 수 있습니다.
• 검색결과가 없을 시 메시지(ex. '00'의 검색결과가 없어요 등등)와 최근 검색어 목록을 출력합니다.
• 목록에 있는 상품 클릭시 해당상품 상세페이지로 이동합니다.

1.3 공통 레이아웃

• 헤더와 탭바 내비게이션을 구현했습니다.

2. 개발 환경 세팅

git clone https://github.com/eun0leee/finance-seven.git
cd finance-seven
npm install
npm start

3. 기술 스택

4. 팀원

한수산(팀장)	노준영	이은영	김효진

• 팀 리포지토리
• 팀 Wiki 문서

5. 블로그 포스팅

• 프론트엔드가 백엔드와 협업하는 협업과정
• 금융상품 추천 사이트 프로젝트 전체회고
• 최근본상품, 최근검색어, 자동저장 기능 구현하기
• 레이아웃 설정 중 App.tsx routes 에러