팀원 소개
1주차
- 주제 및 선정 배경(기획 의도)
- 기술 스택 선정 이유
2주차
-
기능 개발 시작 - 3일 동안 API 분석
- API를 분석하여 50개 정도의 공통 KEY로 통일 - 2주차까지는 청약홈 API의 APT(기본, 상세 정보)만 불러와서 활용
- API 명세 & DB구조
-
CSS 하나도 적용 안 된 API 2개(APT)만 불러와서 구현한 화면 캡쳐
- 캡처 이미지
-
Next.js SSG 활용 3초 → 0.3초로 단축
3주차
-
관리자 페이지 생성하게 된 이유
-
- API 추가로 더 가져와야 함(3주차까지는 청약홈 API만 사용 - LH API 추가 필요)
- API데이터 별로 Key와 Data 형식, 존재 여부가 달라 통합 데이터로 재가공이 필요
- 지도에 표시하기 위한 좌표를 추가해야 함
- 클라이언트에서 이 모든 작업을 하기 부담
- 분양 정보는 하루에 한 번 업데이트가 되기 때문에 관리자 페이지에서 하루에 한 번 버튼을 눌러 재가공한 API data를 Firestore에 넣기로 결정
- 기술적 의사결정 참고
-
-
중간 발표 UI
- 중간발표 UI
4주차
- 중간 발표 때 개선하겠다고 한 목록
- LH 분양 데이터 추가
- 지도 최적화
-
- LH 분양 데이터 추가
- 청약홈과 달리 LH는 상세 정보 내에서 분양 형태별로도 Key와 Data 형식이 다름
- LH 데이터를 먼저 청약홈의 Key와 동일하게 재가공 한 후 청약홈 API 데이터와 통합
-
- 지도 최적화
- 지도 최적화한 내용 들어가면 될 것 같습니다.
- 지도 최적화 비교 gif 파일
- (3. 코드 리팩토링 - 시간 남으면 추가 예정)
- useCustomHook을 사용한 코드 줄이기
- 관리자 페이지 로직 수정
- 관리자 페이지 데이터 업데이트 방식 변경
- 기존 방식 → 업데이트할 때마다 기존 데이터가 모두 삭제되고 새로운 데이터로 전부 교체됨
- 수정한 방식 → 기존 데이터는 유지하면서 새로 들어온 데이터만 추가함
- 수정 이유: 좌표나 이미지(추후 예정) 등의 기존 데이터를 보존할 필요성을 느낌
- 주변 아파트 실거래가 API 추가
- 아파트매매 실거래 상세 자료 API 분석하기
- 분양 공고의 주소 데이터를 바탕으로 국토교통부 api를 이용해서 해당 ‘읍면동’의 최근 한 달 아파트 매매 실거래가 정보를 불러옴
- 성능 개선
-
성능 개선에 앞서 우리가 쓰는 Next.js에 대해 더 잘 알아야겠다는 필요성을 느낌
-
3주차 주말에 Next.js 책(제목)을 읽고 스터디
-
공부한 내용을 바탕으로 Next.js 활용한 내용
-
- prefetcth 사용(디테일?)
5주차
-
CSS 적용 및 반응형 제작
- 반응형 GIF 파일
-
QA
dynamic import사용- PPT 자료 - Dynamic import
-
(3주차와 비교한 시연)
- 3주차 버전: https://by-mvpver.vercel.app/
- 현재 버전: https://www.by-zip.com/
-
고객 피드백 분석 결과 및 추후 계획 발표 자료 - 고객 피드백 분석
- 고객 피드백 분석
- 개선할 내용 및 방법
-
팀 노션 홍보(문서화)
Team NEMO