개발일지

1주차

1. 컨텐츠 브레인스토밍

• 구현할 서비스 논의 -> 장보기 관련 데이터 제공 서비스로 확정
• 서비스명 확정 -> 카트 세이버
• 서비스 데이터 구성 논의 -> EDA를 통해 추출 데이터 선정

2. 원천 데이터 리서치 (api 제공)

• 서울 열린 데이터 광장
• 공공데이터 포털
• 서울특별시농수산식품공사
• 한국농수산식품유통공사(atKAMIS) -> 최종 선정 -> api 선정

3. 데이터 탐색 (data EDA)

• 일별 부류별 도.소매가격정보 가 가장 우리 서비스에 적합하다고 판단 (action=dailyPriceByCategoryList)
  • 기존에 뜯어보려고 했던 최근일자 도.소매가격정보(상품 기준) 는 축산, 수산물 등의 자료가 누락되어 있기 때문에 웬만하면 다 들어있는 전자 자료로 선택
• 요청 url http://www.kamis.or.kr/service/price/xml.do?action=dailyPriceByCategoryList

추출 데이터

• 품목 분류 코드
• 아이템 코드
• 최신일자 가격 & 날짜
• 일주일전 가격 & 날짜
• 한달전 가격 & 날짜
• 일년전 가격 & 날짜
• 상품명 item_name
• 상품 상세 분류 kind_name
• 상품 품질 분류 rank

4. 기타

• 깃헙 생성

2주차

1. API 호출 테스트

• 신청하여 허가 완료 받은 api를 기반으로 파이썬, 리액트로 api 데이터 불러오기 시도
• 데이터 가공 및 역할 분담을 위해 파이썬 flask로 api 로직 구현하기로 결정

2. 데이터 추출 로직 구현

• 일요일은 데이터가 아예 없기 때문에 하루 거슬러 올라간다.
• 기본적으로 제공하는 dpr1(당일가), dpr3(일주일 전 가격), dpr5(한달 전 가격), dpr6(1년 전 가격)활용. 없는 경우, 날짜를 돌아가며 dpr1 조회
• 날짜를 되돌아갈 때 rank, kind_name이 일치하는 값이 나오지 않으면 데이터가 없는 것으로 간주하고 스킵하거나 0 반환

3. UI / UX 디자인

• 기본적인 인터페이스 디자인 구성
• 웹, 모바일 반응형 디자인
• 로고 제작

3주차

1. Front 개발 @Jilim 깃헙 이슈

• flask로 받은 데이터 D3.js에 json형태로 받아오기
• 그래프 디자인 라인에서 막대 그래프로 수정
• 메인 이미지 괜찮은 레퍼런스 탐색 및 추가
• 로딩 화면 구현 및 로딩 시 나오는 이미지 제작

2. Flask 개발 @sohpark 깃헙 이슈

• 파이썬 flask 를 이용하여 api 데이터를 불러오고 템플릿에 데이터 전달
• 상품 검색 기능 구현
• 상품을 'rank', 'kind_name' 기준으로 다시 세분화하여 저장
• 각 상품에 대한 상세 데이터 추출
• 전달한 날짜에 데이터 없으면 하루씩 되돌아가 상세 데이터 추출하는 함수 작성
• 랜덤으로 상품 3가지 뽑아서 메인 페이지 해시태그로 출력하기
• 한달 전, 1년 전 데이터 전달하기. 해당 일자 데이터 없는 경우 되돌아가는 함수 호출
• 원천 데이터의 키워드가 일반적이지 않은 경우 입력된 검색어를 해당 검색어로 변경하는 로직 및 json 파일 추가

3. 추가 기능 개발 @dachung 깃헙 이슈

• 파이썬 requests, BeautifulSoup 활용하여 온라인 몰 4곳 해당 검색어 세부 결과 크롤링
• 공시가격과 온라인 몰 가격 비교 기능
• 마켓컬리 API 활용하여 데이터 받아오기
• 품목 76개의 도트 이미지 딕셔너리 만들기

버그 수정 버그 이슈

• 당일에 호출된 API 데이터에 키워드가 없는 경우 no result페이지로 연결시키기 @sohpark
• 일주일 전, 한달전, 일년전 데이터가 없는 경우 0을 반환하여 오류 방지 @sohpark
• 온라인 몰 검색 결과가 없을 경우 IndexError 발생, range를 검색결과 갯수로 받아서 오류 방지 @dachung

4주차

1. Front 개발 @Jilim

• 쇼핑 리스트 제목 디자인 변경
• 상세 페이지 농협몰, 쿠팡 로고 추가
• 상세 페이지 데이터 기준 날짜 모달 창 제작
• footer 깃허브 아이콘 및 링크 추가
• 링크 미리보기를 위한 메타데이터 코드 및 이미지 작업 @jilim @sohpark

2. Flask 개발 @sohpark

• item_code를 받아와 아이템 아이콘 이미지와 연동
• 그래프를 출력을 위해 필요 데이터 javascript에 전달
• 등락 표시 로직 추가
• 헤더, 푸터 레이아웃 고정해두고 extend 활용해서 나머지 템플릿 출력하기

3. 추가 기능 개발 @dachung 깃헙 이슈

• 공시가격과 온라인 몰 가격 단위가 달라 비교가 어려운 이슈
• 모든 품목에 대하여 데이터 포매팅을 기반으로 기본 단위 추가 (100g, 1마리, 1개)

3. 버그 수정

• 고등어 검색 시 세부 품목 단위가 출력되지 않는 이슈 수정 @sohpark
• 지난 주 데이터 및 날짜 수집이 되지 않아 상세 페이지가 터지는 이슈 수정 @sohpark
• 특정 온라인 몰의 경우 특정 css class에 가격 text가 두번씩 찍히는 이슈 -> 정규표현식 활용 @dachung

4. 호스팅 @sohpark

• 아마존 AWS Elastic Beanstalk을 이용하여 배포
• Freenom으로 무료 도메인 발급받아 AWS Route53를 활용하여 배포된 사이트에 도메인 연결
• Heroku로 발급 테스트
• 호스팅 방법 정리한 블로그 글

2020.05 이후

1. db 추가

• sqlite를 이용하여 db 추가
• 모든 상품의 기본 정보, 위키, api호출을 통해 얻어오는 일일 가격 정보를 미리 저장 -> 검색 속도 개선
• 12시간마다 api를 자동으로 호출하여 신규 일일 데이터 축적
• 검색 기능을 별도의 파일로 분리

2. 위키(한줄 팁) 추가

• 상품을 고를 때 필요한 팁을 적은 한 줄 위키 추가