서울 열린데이터광장 공공데이터 활용 웹 개발 - 3주차 정리

3주차 한 일

• dockerfile, docker-compose 설정
• api 설계할 때 front와 back 소통
• 주어진 데이터를 활용해서 추천시스템 진행
• api와 db 저장되는 데이터의 키값 일치 확인
• 날짜 형식 통일
• 컴포넌트 디자인 시작

---

3주차 경험

• 인공지능 리서치 결과 토의

인공지능에 적용의 기대 효과에 대한 팀원의 고민을 듣고, 인공지능 서비스를 구현하는 것은 생각보다 어려운 과정이구나 느꼈습니다. 주어진 데이터는 공공데이터인데, 단순 제공 목적의 공공데이터들을 융합하여 새로운 가치를 만들어내는 것이 없는 상태에서 웹개발을 들어가다 보니, 인공지능에서 애로사항이 많은 상황입니다. 저는 인공지능 담당 팀원의 부담을 덜기 위해 추천시스템을 서비스하기 위해서 fastapi 를 공부를 시작했습니다. 

 

• Spring, Mysql, Gradle dockerize

프론트앤드의 경우에는 Dockerfile, docker-compose 세팅을 사전에 끝내고 추가로 저는 백엔드의 gradle, opensdk, mysql 이미지를 활용해서 빌드와 API 서버를 실행시켜서 프론트앤드에서 가져다 쓸 수 있게 만들었습니다.

• API 서버에서 받아오는 response data 타입스크립트 설정
• redux-toolkit의 asyncThunk로 axios, state 설정
• cors 설정

API 서버에서 데이터를 받아와서 화면에 뿌려주기 위한 상태관리를 설정을 했습니다.

• Infinite scroll 기능 구현

연령대가 높은 사람들을 고려한 UI로 Infinite scroll을 선택하고 react 기반으로 구현하기 위해 방법을 찾는 와중에 react-infinite-scroll-component를 설치해서 쉽게 구현을 했습니다. 해당 모듈의 용량도 매우 가벼워서 충분히 써도 문제가 없다는 판단이 들었습니다.

• 프론트앤드 코드리뷰

저보다는 실력과 경험이 부족한 팀원을 위해서 코드리뷰를 중간 중간 했으며, state management 에 대한 설명을 디테일하게 해주었습니다. 그리고 프론트앤드인 저와 팀 동료 한명은 비대면으로 각자 pull-ruquest를 review 없이 바로 머지를 하다보니 각자의 코딩 진행 상황을 중간 중간에 전달하는 과정이 필요했습니다.