결제 전에 가장 유리한 카드를 고를 수 있도록
보유한 카드의 실적과 남은 혜택을 확인하고, 주변 가맹점에서 사용할 카드를 추천하는 서비스를 만들었습니다. React 화면부터 혜택 계산 로직, 서버와 배포 환경까지 직접 구성했습니다.
혜택 목록보다 결제할 때의 선택을 돕고 싶었습니다
카드를 여러 장 가지고 있어도 전월 실적, 가맹점과 한도가 달라 결제할 때 어떤 카드를 써야 할지 판단하기 어렵습니다. 카드별 정보를 나열하는 대신 보유 카드의 상태를 확인하고, 사용할 곳에 맞는 추천을 받는 흐름으로 기획했습니다.
2024년 하나금융티아이 채용연계형 교육의 최종 개인 프로젝트입니다. 기획과 React 화면, Spring Boot API, Oracle 데이터 모델 및 GCP 배포 환경을 맡았습니다.
주변 가맹점을 고르면 사용할 카드를 보여줍니다
혜택 지도에서는 업종과 검색 반경으로 가맹점을 조회하고 지도에 마커를 표시합니다. 조건이 바뀌면 기존 마커를 정리하고 조회 결과에 맞춰 다시 표시하도록 구성했습니다.
가맹점을 선택하면 지도 중심을 이동하고, 해당 가맹점에 대한 카드 추천을 요청합니다. 선택한 가맹점과 추천 결과, 조회 중 상태를 나누어 관리하면서 지도 탐색과 추천 화면을 연결했습니다.
- 업종과 반경 선택
- 주변 가맹점 조회 및 지도 표시
- 가맹점 선택
- 보유 카드의 혜택 비교 및 추천
카드마다 다른 조건을 계산 로직으로 옮겼습니다
전월 실적과 혜택 한도, 가맹점 조건을 데이터로 다루고 실적 및 혜택 집계에 Oracle PL/SQL을 사용했습니다. React는 조회와 선택, 결과 표시를 맡고 Spring Boot API가 화면과 계산 결과를 연결합니다.
카드별 실적과 남은 혜택을 조회하는 화면 외에도 소비 진단, 카드 추천과 소득공제 비율 안내를 구현했습니다. 하나의 카드 정보가 여러 화면에서 어떻게 사용될지 고려하며 기능을 연결했습니다.
| 영역 | 구현한 내용 |
|---|---|
| React | 혜택 및 실적 조회, 지도 탐색, 카드 추천 결과 표시 |
| Spring Boot | 조회 및 추천 API, 화면과 데이터 처리 연결 |
| Oracle / PL/SQL | 카드 혜택 조건 관리, 실적 및 혜택 계산 |
| GCP / Nginx | 서버 배포, SSL 적용 |
| Prometheus / Grafana | 서버 메트릭 수집과 시각화 |
사용 시나리오를 따라 제품 전체를 연결했습니다
실적 확인에서 소비 진단, 주변 가맹점 탐색과 카드 추천으로 이어지는 시연을 준비했습니다. 저장소에 소스와 발표자료를 공개하고 영상으로 기능을 확인할 수 있도록 남겼습니다.
화면에 필요한 데이터 구조와 혜택 계산 로직을 설계하고, API 구현과 배포까지 직접 연결했습니다.
가맹점 선택에서 카드 추천까지
주변 가맹점을 탐색하고 보유 카드의 혜택을 비교합니다.
지금 팀이 풀고 있는
문제는 무엇인가요?
서비스 출시 부터 운영까지,
제가 기여할 수 있는 일을 함께 하고 싶습니다.


