Bank Radar는 사용자의 여행 욕구를 바탕으로 예금과 적금에 대한 맞춤형 추천을 제공하는 서비스입니다.
인기 있는 저축 상품을 찾아 추천해 줄 뿐만 아니라, 이를 사용자의 여행 열망과 통합하는 데 중점을 두고 있습니다.
-
여행을 즐기며 돈도 아끼는 특별한 방법을 찾는 사람들
-
신뢰할 만한 금융 상품을 찾고 있는 투자자들
-
적금 만기 후 여행을 계획하는 사람들
-
여행을 원하지만 비용 걱정으로 망설이는 사람들
Bank Radar는 여행 목표와 금융 목표가 조화를 이룰 수 있도록, 맞춤형 금융 조언과 여행 추천을 제공하고 있어요. 여행을 꿈꾸면서 동시에 저축을 하며, 목표를 이룰 수 있도록 돕는 게 Bank Radar의 목표입니다.
Bank Radar는 여러분이 돈을 모으고 여행을 계획할 때 필요한 정보를 제공해요. 돈을 모아가면서 여행도 즐길 수 있도록 도와드리고 있어요. Bank Radar는 여행 계획과 저축 목표에 따라 맞춤 추천을 제공합니다.
- 최적의 적금 추천: Bank Radar는 여행일 전까지 만기가 될 최적의 적금 상품을 추천해줍니다.
- 여행 비용 저축을 위한 맞춤 적금 상품 추천
- 남은 여행 일자를 고려한 적절한 적금 옵션 추천
- 적금 만기 후 여행 목적지 추천: 저축한 금액과 저축 기간을 기반으로 여행지를 추천해드려요.
-
사용자의 예산을 고려하여 최적의 여행지를 제안
-
여행을 계획하여 금융 목표를 달성하는 데 도움
-
DRF(Django Rest Framework)와 Vue3를 이용한 SPA
| 강문수 | 최도훈 |
|---|---|
 Git hub |
 Git hub |
- 프로필(추천 알고리즘에 활용 용도)
- 가입한 예금 및 적금 상품 조회
- 새 댓글 알림 메세지
-
게시글
- 게시글 리스트
- 게시글 생성
- 게시글 수정
- 게시글 삭제
- 게시글 좋아요
-
댓글
- 게시글 별 댓글 조회
- 댓글 생성
- 댓글 수정
- 댓글 삭제
- 댓글 좋아요
- 대댓글
- 금융감독원 API 이용
- 예금 및 적금 데이터 서버 DB에 저장
- 예금 및 적금 전체 조회 및 상세 조회
- 예금 및 적금 가입 여부 설정
- 가입자 수 많은 순서로 조회
- 한국수출입은행 API 이용
- 입력 통화 및 변환하고 싶은 통화 선택
- 추천 알고리즘 중 여행 경비 알고리즘에 활용
- 나이 기반 가입 상품 추천
- 월 수입 기반 가입 상품 추천
- 자산 기반 가입 상품 추천
- 가입 기간과 예상 여행 비용을 이용, 적금 만기 후 여행지 추천
- 희망 여행지를 통한 적금 상품 추천
| 1일차 | 2일차 | 3일차 | 4일차 | 5일차 | |
|---|---|---|---|---|---|
| 강문수 | 아이디어 회의 카카오맵 API |
아이디어 회의 카카오맵 은행 검색 구현 ERD에 따른 컴포넌트 구조화 |
아이디어 회의 커뮤니티 CRUD 페이지 구현 |
금융 페이지 구현 게시판 페이지 구현 환율 페이지 구현 |
프로필 페이지 구현 좋아요/취소/글 작성/삭제 실시간 화면 반영 |
| 최도훈 | 아이디어 회의 커뮤니티(CRUD) 구현 한국 수출입 은행 API |
아이디어 회의 ERD 프로토타입 제작 커뮤니티(CRUD) 기능 보완 |
아이디어 회의 금융감독원 API 댓글 트리(대댓글) 좋아요 기능 로고 제작 |
여행 정보 데이터 제작 회원 프로필 금융상품 추천 알고리즘 버그 수정 |
여행-적금 통합 추천 버그 수정 및 리펙터링 |
| 6일차 | 7일차 | 8일차 | 9일차 | 10일차 | |
|---|---|---|---|---|---|
| 강문수 | 버그수정 컴포넌트 구조 작성 알람 기능 구현 |
버그수정 금융/여행 추천 페이지 구현 컴포넌트 재정리 작성 페이지 보완 |
각 페이지 추가 기능 완성(알고리즘, 수정된 res데이터 반영 ) css 디자인 초안 |
버그 수정 css 1차 완성 구글맵 페이지 추가 |
css 최종 완성 PPT 발표준비 페이지 기능 점검 |
| 최도훈 | Readme 작성 새 댓글, 대댓글 알람 추천 알고리즘 수정 |
...버그 수정하고 응답 데이터 편하게 바꿔줬는데 날아감 [front] 게시판 local storage에 저장하지 않게 수정 글 수정 시 기존 내용 불러오기 |
버그 수정 인기글 조회 게시글 검색 추천 가능한 나라 목록을 서버에 요청 가능 일부 응답 데이터 간소화 추천 알고리즘 dummydata 추가 |
여행지에 따른 상품 추천 알고리즘 보완: 월 납입액과 기간 선택 가능 응답 데이터 추가: 여행지 사진 링크(네이버 이미지 검색 API 이용) [front] 인기글 전체글 토글로 조회 |
게시물 페이지 및 한 페이지 노출 게시물 선택 [front] 게시글 및 댓글 UI 수정 메인 화면 수정 |
- 금융 프로젝트에 여행을 더했다. 금융, 환율, 지도 세 가지 키워드를 가지고 고민하다 '여행' 이라는 결론을 내리고 프로젝트 방향을 잡았다. 본인의 경험에 기반해 20-30대의 젊은 이용자를 타겟층으로 잡고, 금융(적금)과 여행을 결합했다.
- 서버와의 협업, 청사진의 중요성을 느꼈다. 막연히 프론트와 백을 나눠 작업을 시작하려니, 서버가 완성되고 데이터가 넘어오기 전 까지 어떤 작업을 수행할지 갈피를 잡기 힘들었다. 처음 데이터를 받고나서 데이터가 어떻게 왔는지 확인하고, 변수명을 하나하나 찾아가다보니 사전에 구상했던 형태와 많은 부분이 틀어졌다. 이후 ERD 구조를 잡고 데이터를 어떻게 넘겨줄 것인지를 논의했다. 서버측에서 사전에 요청한대로 데이터를 가공하여 넘겨주는 덕분에 수월한 작업이 가능했다.
- 실시간으로 변동사항을 클라이언트측에 반영했다. 좋아요나 댓글의 입력/삭제 등이 서버에는 정상적으로 요청이 갔으나, 클라이언트 화면에는 새로고침을 하기 전까지 변화가 없었다. 새로고침을 하지 않아도 화면에 변경사항이 렌더링 되게 하기 위해 서버측에 반환값을 세부적으로 요청하고 해당 값을 변수에 할당했다. 다만, 스토어의 변수값을 활용하거나 컴포넌트 구조가 재귀적으로 렌더링 될 때 변수 값의 변경을 제대로 인지하지 못하는 경우가 종종 발생했다.
- 구현 못한 기능에 대한 아쉬움이 남는다. 차트를 그리기 위해 Chart.js나 vue-chart 등을 사용하고자 했으나 원하는 결과가 나오지 않았다. 공식문서의 내용을 Vue3 scritp setup 구문에 맞춰 적용하는 것에도 어려웠지만 무엇보다 비동기 작업으로 요청한 데이터를 전달받고, 가공하여 차트를 그리는데 시행착오가 많았다. async/await의 동작에 대해 보다 깊게 알 수 있었으나 아직도 이해하고 구상한대로 작동하지 않는 부분도 있어 구현하지 못한 기능들에 대한 아쉬움이 남는다.
- 마지막으로 서버를 담당한 팀장에게 고마움을 전한다. 페이지를 구현하는데 있어 원하는 데이터와 형태를 요청하면 기존 작업 내용에 수정에 수정을 거듭하면서도 빠르게 원하는 데이터를 주었다. 서버 지식을 바탕으로 계속하여 새로운 아이디어를 제공해 주었으며, 프로젝트 후반부엔 격려와 함께 front의 기능과 디자인 또한 많은 부분 작업을 도와주어 부담을 덜 수 있었다.
- 단순히 적금을 추천하는 서비스가 필요하다면 굳이 본 서비스를 이용할 이유가 없다고 생각했다. 그래서 여행과 금융을 통합하여 서비스에 접목시켜 서비스를 이용할 유인을 만들었다. 여행이라는 이유가 생긴다면 적금을 추천 받을 이유가 생기길 것이라 예상하였기 때문이다.
- 추천 알고리즘이 회원의 프로필 설정을 바탕으로 이루어 지기때문에 실제 가입 여부를 확인이 필요하다. 현재의 알고리즘은 별도의 인증없이 자신이 가입했다고 표시 가능하기 때문에 실제 가입자와 Bank Radar의 가입자의 데이터는 큰 차이가 날 수 있다. 은행에 정보를 요청하던지, 회원의 가입 인증을 받던지각 상품별 가입자 수 정보를 정확하게 받아 올 방법이 필요하다.
- 여행에 대한 정보가 부족하고 여행 추천 내용이 빈약하다. 만기 후 여행하기 좋은 나라를 만기 후의 월(Month) 기준으로 추천한다. 단순히 적금 만기 후의 날짜에 가기 좋은 나라를 추천할 뿐이다. 도시, 즐길거리 등으로 세분화하여 더욱 구체적인 추천을 통해 유저의 관심을 끌 수 있는 여행지 추천이 되었으면 한다. 더불어 여행 예상 비용을 산출할 때, 여행 기간 및 원하는 여행 방식(배낭 여행, 식도락 여행, 고급 호텔 이용 등) 을 바탕으로 더욱 구체적인 플랜을 제공해 주면 좋을 것같다.
- 현재 적금 옵션에 따라 매달 최고 한도만큼 적금하였을 때를 기준으로 적금 만기 시 총 금액을 추산하는데, 유저의 실제 적금액을 바탕으로 한 추천이 필요하고 그렇게 해야 더욱 정확하다.
- 여행지 추천 서비스에서 이미지를 넣기 위해 네이버 이미지 검색 API를 이용하였으나 검색키워드가 영어인 탓인지 정치 뉴스 사진이 많이 나왔다. 관광을 위한 추천인데 적절하지 않은 것 같다는 생각이 들었다. 검색 키워드를 수정하면서 다른 이미지를 찾아보았지만 모든 나라에 적절한 이미지가 들어가는 검색어를 찾을 수 없었다. 데이터에 한글로 된 나라 이름을 추가하였으면 더 나은 검색 결과를 얻을 수 있을 것으로 예상되었으나 중요도가 낮아 패스하였다.
- 발생할 수 있는 오류 상황을 가정하여 방어 코드를 많이 넣으려고 노력 하였다. 외부 API서버의 예상치 못한 응답, 클라이언트의 잘못된 데이터 입력, 추천 알고리즘이 조건에 맞는 추천을 찾을 수 없는 경우, 악의적인 사용자의 접근 등을 예상해보았지만 경험과 지식이 부족하여 생각하지 못한 부분이 많을 것 같다.
- 서버의 부하를 줄이기 위해 클라이언트의 요청을 최소화할 수 있도록 응답을 보내주도록 만들었는데, 잦은 요청의 적은 데이터와 적은 요청의 많은 데이터 중 어느 것이 더 성능 향상에 도움이 될지 고민이 되었다. 데이터의 크기가 크지 않을 것으로 가정하고 한 번의 요청에 관련 데이터까지 전부 담아 요청을 최소화 하도록 만들었다. 그러나 새로운 댓글과 대댓글 알람같은 경우, 언제 새로운 알람이 있는지 확인하는 요청을 보내는 게 좋을 지에 대해서는 답을 내리지 못하였다. 하지만 각 요청 시 마다 필요한 데이터들을 정확하게 파악한다면 상황에 맞는 데이터만 보내어 응답 데이터 크기를 최소화할 수 있을 것이라는 결론을 내리고 프론트에서 필요한 데이터를 생각해 보았지만 프론트의 버그 수정 및 방어 코드 작성으로 시간이 생각보다 많이 소요되어 백엔드 측에서 응답 데이터 최적화할 시간이 없어 아쉬웠다.
- 구현하고 싶은 사항이 많아 서버 측의 코딩에 신경쓰다보니, 프론트엔드 측에 서버 응답에 대한 설명을 상세하게 해주지 못한 점이 아쉬웠다. 개발 중에 최대한 알아 보기 좋게 응답데이터를 구성했으니 설명을 빠르게 하고 넘어가도 동료가 잘하겠지라는 생각이 컸던 것 같다.
feat: 기능 변경
fix: 버그 수정
docs: 문서, 주석 수정
refactor: 리팩터링
design: \[프론트\] 디자인 수정