🌈 wanted-codestates-project-10-1
📎 과제링크
🪄 기획 - Figma
🎉 기능
- repo 검색, 저장(최대4개), 삭제
- 저장된 repo 선택시 issue 보기
- 검색결과및 issue 리스트는 페이지네이션기능추가
👨🎨 디자인
- 메인화면 배치
- 검색창
- 검색결과
- 등록된 Repo list
- issue list
😎 기능 구현 목록
-
검색창에 Repository명을 입력해서 Repository를 검색할 수 있다.
-
검색된 Public Repository를 등록할 수 있다.
- 등록 개수는 최대 4개로 제한하며, 최대 개수 초과 등록 시 이를 사용자에게 알려준다.
- 웹은 LocalStorage, 앱은 Async Storage 등 로컬 저장소를 활용한다. (웹 혹은 앱 선택)
-
등록된 Repository를 삭제할 수 있다.
-
등록된 각각의 Public Repository의 issue를 한 페이지에서 모아서 볼 수 있다.
- 각 issue 마다 제목, Repository 명은 필수로 표현되어야 한다. 그 이외의 데이터 중 필요하다고 생각되는 부분은 추가한다.
- 해당 issue를 클릭하면 Github의 상세 페이지로 이동할 수 있다.
- 페이지네이션을 통해서 계속해서 issue를 모아서 볼 수 있다.
👨👨👧👧 팀 구성
| 이름 | 직책 | GitHub |
|---|---|---|
| 🏄🏻♂️ FE_홍인열 | 🎖 팀장 |  |
| 🐸 FE_김주영 | • 팀원 |  |
| 🐮 FE_복지호 | • 팀원 |  |
| 🍔 FE_우혁주 | • 팀원 |  |
| 🍕 FE_전용태 | • 팀원 |  |
️⚙️ 기술 스텍
🛠 구현 기능 목록
홍인열
- 검색 및 API 요청 기능 구현
- API 요청 결과 로컬스토리지에 저장
- API요청 응답받기전까지 로딩 스피너구현
- 저장 갯수 초과, 이미 저장된 레포 알림 모달구현
김주영
- 페이지 렌더전 이슈목록 API 요청
- 이슈목록 카드 컴포넌트생성 및 이슈목록 배열생성
- 이슈목록 배열 필터링 기능(All, Open, Close)
복지호
- 이슈목록 카드 컴포넌트를 이용하여 이슈목록 페이지 구성
- 페이지네이션 기능 구현 (페이지당 이슈카드 6개 보이기)
- 첫 번째, 마지막 페이지에서 prev/next 버튼 숨김
우혁주
- 레포지토리 선택시 저장/삭제 기능 구현 (로컬스토리지에 데이터 저장/삭제)
- 저장 개수 지정, 저장 레포 저장 불가 구현
전용태
- 검색결과로 저장된 로컬스토리지 데이터를 활용하여 결과리스트 구현
- 무한스크롤을 이용한 결과리스트