🏦 BNK 부산은행 퇴직연금 통합 플랫폼 – Team 2

K-Digital Training · BNK 금융DT 아카데미 실전 프로젝트

퇴직연금 + 실시간 증권 + 마이데이터 + 지점/ATM 조회까지 모두 담은 통합 금융 플랫폼
(부기은행 · Team 2조)

📌 1. 프로젝트 개요

항목	내용
프로젝트 주제	BNK 부산은행 퇴직연금 통합 플랫폼
프로젝트 기간	2025.11.05 ~ 2025.12.08
배경 및 목적	퇴직연금 상품 판매/관리 + 증권 + 마이데이터 + 지점 조회 통합 서비스 구현
주요 기능	퇴직연금 상품 구매/변경, 실시간 증권 정보(국내/해외), 마이데이터 기반 상품 비교, BNK 지점/ATM 통합 조회, 회원/로그인 관리
배포 주소	http://3.39.247.70:8080/BNK
GitHub	https://github.com/JinIleSon/BNK-The-First-Main-Project.git

YouTube

유튜브 링크: https://www.youtube.com/watch?v=Uhn97QhZyEI

👥 2. 팀 구성

팀 조직도 & 역할

이름	역할	주요 업무
손진일	PM, 팀장	실시간 증권(REST+WS), 마이페이지 ETF, 관리자, 멀티스레드 스케줄러, 시스템 통합
전세현	팀원	환율 API, 마이데이터 비교 서비스, 외부 API 파이프라인
강민철	팀원	퇴직연금 가입 5단계 Wizard, 보유상품 변경(매수/매도), 배포/운영(AWS)
이준우	팀원	로그인/회원가입/ID·PW 찾기, 인증 흐름, QR 기반 IRP 계좌 개설
조지영	팀원	기업뱅킹, BNK 지점/ATM 조회, Kakao Map 연동, 공통 프론트(UI/UX)

메인

증권

상품

공지사항

퇴직연금 알아보기

관리자

🧩 3. 요구사항 정의 · WBS · 테스트 시나리오

3-1. 요구사항 정의(요약)

회원/인증

회원가입, 로그인, 로그아웃
아이디/비밀번호 찾기 (휴대폰·이메일 인증)
비밀번호 변경(현재 비밀번호 검증 + 본인인증)

퇴직연금 상품

상품 목록/상세 조회
5단계 가입 프로세스
- 본인확인서(FATCA/CRS)
- 약관 동의
- 중요 안내(세제/중도해지/위험 안내 등)
- 가입 정보 입력
- 출금 계좌 비밀번호 인증
IRP/DC/DB 유형에 따른 가입 가능 상품 제약

보유상품 관리

보유상품 평가금액/수익률/운용비중 계산
일부매도/전부매도, 매수 기능
금액·비율(%) 중 택1 입력 / 비중 자동 재계산

증권(ETF/주식)

국내·해외 ETF/주식 실시간 랭킹(TOP 100)
1분봉 차트(최근 300봉) + 실시간 호가/현재가
로그인 사용자 대상 매수/매도 기능

마이데이터

타행 IRP/연금 계좌 수집(가상 MyData 테이블)
수익률/위험등급 기반 상품 비교 및 추천

지점/ATM 조회

영업점, 365코너, 24/365, 대여금고, 외화ATM 카테고리
시/도, 구/군 2단계 필터 + 키워드 검색
Kakao Map 연동

관리자

상품/회원/지점 정보 관리
통계·현황 조회

3-2. WBS(Work Breakdown Structure) 요약

분석 단계
- 요구사항 정의
- 도메인 조사(퇴직연금·증권·마이데이터)
설계 단계
- IA(Information Architecture)
- 플로우차트
- ERD
- 화면 설계서
구현 단계
- 공통/레이아웃
- 인증/회원
- 상품/IRP 계좌
- 증권/실시간 시세
- 마이데이터
- 지점/ATM
- 관리자
테스트 단계
- 단위 테스트(계산 로직, 거래 트랜잭션)
- 통합 테스트(계좌·상품·거래 연계)
- UAT(시나리오 기반 화면 점검)

3-3. 테스트 시나리오 예시

퇴직연금 상품 가입

본인확인서 미등록 → Step1 강제 이동
약관 미열람 → Step2 진행 불가
비밀번호 4자리 불일치 → 가입 실패

보유상품 일부매도

금액/비율 미입력 → 합계 반영 안 됨
매도금액 > 평가금액 → 예외 처리

ETF 주문

미로그인 상태 → 주문 버튼 비활성화
보유 예수금 < 주문 총액 → 토스트 경고 + 모달 미노출

🗓 4. 프로젝트 작업일정 (Gantt 요약)

11/05 ~ 11/07 : 아이디어 회의, 프로젝트 주제 선정, 역할 분담
11/07 ~ 11/10 : 요구사항 정의, IA/플로우차트/ERD 초안
11/10 ~ 11/19 : DB 설계·구축, 기본 화면/레이아웃 구축
11/19 ~ 11/30 : 각 파트별 기능 구현(상품·증권·회원·지점·마이데이터)
12/01 ~ 12/05 : 통합, 버그 수정, 성능 개선(멀티 스레드, WebSocket 안정화)
12/06 ~ 12/08 : 최종 점검, 발표 자료 및 보고서 작성

🏗 5. 아키텍처 및 서비스 정보

5-1. 시스템/인프라 구조

클라이언트: Web(Chrome, Edge 등)
서버: Spring Boot 3, Embedded Tomcat 10
DB: Oracle 21c
배포: AWS EC2(Amazon Linux 2023) + Docker
CI/CD: GitHub Actions

5-2. 기술 스택 상세

유형	구분	내용
SW	OS(Dev)	Windows 10
	Browser	Chrome 최신 버전
	WAS	Apache Tomcat 10 (Spring Boot 내장)
	Framework	Spring Boot 3.x
	Language	Java 17, Servlet 3.x
	Frontend	HTML5, CSS3, JavaScript(ES6), Thymeleaf
	Library	Spring Boot Starters, MyBatis, JPA, Oracle Driver, QueryDSL, Lombok, ModelMapper, WebSocket, JWT, Apache Commons, SMS 인증, JSON 처리, lightweight-charts 등
API	증권	Kiwoom REST/WebSocket API, DB 증권 REST API
	외부	KoreaExim 환율 API, Kakao Map API
DBMS		Oracle DB
Tool	IDE/협업	IntelliJ IDEA, SQL Developer, Git, GitHub, Figma
Infra/DevOps	Cloud(IaaS)	AWS EC2
	OS(Prod)	Amazon Linux 2023
	Container	Docker
	CI/CD	GitHub Actions

🧭 6. 정보 구조 (IA : Information Architecture)

상위 메뉴 구조

메인
- 메인 배너, 베스트 상품, 목적별 상품, 추천 상품 등
상품
- 퇴직연금(개인/기업), 예금/적금, 펀드/ETF
증권
- 증권 메인(실시간 랭킹/시세)
- ETF/주식 주문(차트/호가/주문)
마이데이터
- 타행 IRP/연금 계좌 조회
- 수익률/위험등급 비교 및 추천
마이페이지
- 내 정보, 보유계좌, 보유상품, ETF, 거래내역, IRP 계좌 관리
기업뱅킹
- 기업 퇴직연금, 납입/정산 흐름
지점/ATM
- 영업점/365/24·365/대여금고/외화ATM 조회 + Kakao Map 기반 지도
고객센터
- FAQ, 1:1 문의
관리자
- 회원 관리, 상품/지점 관리, 통계

🔀 7. 플로우 차트

7-1. 로그인/회원 파트

로그인 페이지 진입
ID/PW 입력 → 비밀번호 해시 검증
성공 시 세션/토큰 발급, 헤더 중앙에 토스트(mid) 5초 표시
마이페이지/상품 가입/주문 기능 접근 가능

7-2. 퇴직연금 상품 가입 플로우

상품 상세 → “가입하기”
본인확인서(FATCA/CRS) 존재 여부 확인
- 없으면 Step1(작성) 이동
- 있으면 Step2(약관)로 건너뛰기
약관/상품설명서 열람 + 필수 체크
중요 내용(금리/중도해지/세제 등) 확인
가입 정보 입력(기간, 금액, 비율, 출금계좌 선택)
출금계좌 비밀번호 4자리 입력 → 인증
가입 완료 화면 및 요약 표시

7-3. 증권 API / 환율 API 플로우

증권

REST: 1분봉 300개 히스토리 조회 (Kiwoom REST TR ka10080 등)
WebSocket: 실시간 시세/호가(0A/0D 채널)
진입 시 과거 300봉 로딩 + 1분마다 재요청

환율

KoreaExim API에서 USD/KRW 환율 수신
주말·공휴일 시 직전 영업일로 보정
빈 데이터 발생 시 최근 유효 데이터 조회

7-4. 마이페이지 / 상품 변경 플로우

마이페이지 → 보유상품 목록 조회
전부매도 / 일부매도 / 매수 선택
금액 또는 비율 입력 (둘 중 하나만 허용)
선택 상품 요약(평가금액, 수익률, 비중) 확인
비밀번호 인증
@Transactional 매매 처리
결과 토스트/모달 표시

🗄 8. ERD 및 테이블 명세

대표 테이블

USERS
- 회원 정보(mId, mName, mEmail, mPhone, mGrade 등)
PCONTRACT
- 계좌번호(pacc), 상품ID, 잔액, 비밀번호 등
PRODUCT
- 금융상품 정보(퇴직연금/예금/적금/펀드/ETF 등)
FUND / ETF 관련 테이블
- 종목코드, 운용사, 위험등급, 수수료, 기준가 등
TRADE / ORDER
- 주문/체결 내역(매수/매도, 수량, 체결가, 수수료 등)
IRPACCOUNT
- IRP 계좌 및 퇴직연금 관련 정보
MYDATAACCOUNT
- 타행 IRP/연금 계좌 정보(은행명, 상품명, 수익률, 위험등급 등)
BRANCH
- 영업점/ATM 정보(지점명, 주소, 서비스, 카테고리 등)

🚀 9. 주요 기능 (요약 정리)

퇴직연금 상품 가입 5단계 Wizard
보유상품 변경(일부/전부매도 + 매수, 비율·금액 입력)
ETF/주식 실시간 시세 & 주문 (REST + WebSocket 혼합)
QR 기반 IRP 계좌 개설 (PC ↔ 모바일 인증)
마이데이터 기반 연금상품 비교/추천
BNK 지점/ATM 통합 조회 + Kakao Map 연동
회원가입/로그인/ID/PW 찾기/비밀번호 변경
관리자 페이지(회원/상품/지점 관리, 통계)

👤 10. 팀원별 담당 파트 (Team Responsibility)

10-1. 손진일 – PM / 증권 · 마이페이지 · 관리자

🔹 증권 메인 (실시간 랭킹 100 & TickerBar)

국내/해외 ETF·주식 TOP 100 실시간 랭킹 화면 구현
1.5초 간격 REST API 호출 → 랭킹 리스트 + TickerBar 자동 갱신
최초 진입 시, 가장 크게 하락한 종목을 Toast로 1회 알림
AuthService로 액세스 토큰 발급 → DB증권 /api/dostk/etf 호출 → /BNK/api/etf로 가공

🔹 증권 주문 (차트 & 호가 · WebSocket 혼합 구조)

1분봉 차트
- Kiwoom REST TR ka10080 호출
- 응답 JSON에서 1분봉 캔들 배열만 추출해 최근 300봉까지 잘라 전달
- 진입 시 과거 300봉 로딩 + 1분마다 재요청
실시간 호가/현재가
- KiwoomWsClient로 WebSocket 연결
- 채널 0A(현재가·등락률), 0D(호가잔량) 구독
- 서버에서 push 받은 데이터를 그대로 클라이언트에 전송해 실시간 DOM 갱신
REST + WebSocket 혼합 설계
- “히스토리/비주기 데이터 → REST”, “실시간 데이터 → WebSocket” 구조
- 1.5초마다 fetchChartAndQuote() 실행해 차트/호가 재요청 로직 구성

🔹 멀티 스레드 스케줄러 & 성능 개선

단일 스레드 스케줄러에서 해외 주식 rebuildFullCache()가 오래 걸리면
국내 주식/ETF 갱신이 지연되는 문제 발견
TaskScheduler를 4개짜리 스레드 풀로 구성
- 국내 주식
- 국내 ETF
- 해외 주식
- 기타 작업
해외 TOP100 초기 풀스캔은 CompletableFuture.runAsync()로 백그라운드 비동기 처리
→ 메인 스케줄과 분리, 화면 끊김 현상 해소

🔹 증권 구매/판매 & 마이페이지 ETF

IRP 계좌 예수금(구매 가능 금액) 기반 주문 가능 금액 계산
매도호가1(42번 key)을 즉시 체결 가능 가격으로 매핑
수량 입력 시 총 주문 금액 자동 계산, 주문 전 요약 모달로 한 번 더 확인
판매 화면
- 판매 가능 종목이 없으면 “판매할 수 있는 주식이 없어요” 섹션 노출
- 보유 단가·수량·현재가 기반 실시간 수익/손실 표시
마이페이지 ETF
- 사용자가 매수한 종목의 현재 수익을 1.5초마다 갱신해 실시간 수익률 표시

🔹 PM / 공통

팀장으로서 일정 수립, 업무 분담, 이슈 관리
증권·마이페이지·관리자 파트 간 데이터 흐름 조율 및 공통 규칙 정리
보고서/발표 자료 취합 및 품질 관리

10-2. 강민철 – 상품 가입 · 보유상품 변경 · 배포/운영

🔹 퇴직연금 상품 가입 (5단계 Wizard 전체 설계)

Stepper 기반 5단계 가입 플로우
1. 본인확인서(FATCA/CRS) 작성/확인
2. 약관/상품설명서 열람 및 동의
3. 금융상품 중요 안내(세제/중도해지/위험 안내 등)
4. 가입 정보 입력 (기간, 최초불입금액, 납입 주기 등)
5. 출금 계좌 선택 & 비밀번호(PIN) 인증
각 단계별 validator 함수 작성, 미통과 시 다음 단계 이동 불가
단계 이동 시 입력값을 state 객체에 저장해 새로고침/뒤로가기에도 정보 유지

🔹 최초불입금액 입력 컴포넌트

금액 직접 입력 / 계좌 잔액 비율(%) 입력을 토글로 구성
비율 입력 시 선택된 계좌 잔액을 기준으로 실제 금액 자동 계산 및 안내 문구 표시
1만/10만/50만/100만 등 Chips UI와 연동해 클릭 한 번으로 금액 세팅
금액/비율이 동시에 입력된 경우 하나만 유지하도록 충돌 방지 로직 구현

🔹 출금 계좌 비밀번호(PIN) 인증 UI

4자리 PIN 입력 컴포넌트
한 자리 입력 시 다음 인풋으로 자동 포커스 이동
Backspace 시 이전 인풋으로 이동
붙여넣기 시 전체 4자리를 자동 분배
눈 아이콘으로 마스킹 on/off (브라우저 이슈 대응)
비밀번호 길이/형식 검증 및 안내 문구 표시

🔹 보유상품 변경 (마이페이지 – 매수/매도)

상단 요약 영역
- 예수금(매수 가능 금액)
- 보유상품 평가금액 총합
- 현재 운용비중
- 총 자산(평가금액 + 예수금)
보유상품 리스트 + 선택상품 집계 테이블
- 선택된 상품의 평가금액 합계, 수익률, 비중 자동 집계
- 일부매도/전부매도/매수 탭 공통 구조 사용
전부매도 / 일부매도 / 매수 로직
- 전부매도: 해당 상품 금액 전체 자동 반영, 버튼 토글(전부매도 ↔ 취소)
- 일부매도: 금액 또는 비율 입력칸 노출, 둘 중 하나만 입력 가능
- 입력 값이 없는 일부매도 항목은 합계에서 제외

🔹 매수/매도 모달 & 트랜잭션 처리

매수/매도하기 버튼 클릭 시 요약 모달 표시
비밀번호 인증 실패 시 경고 메시지, 성공 시 매매 처리
모든 매수/매도 작업에 @Transactional 적용
예수금, 평가금액, 비중 업데이트를 하나의 트랜잭션으로 묶어 데이터 일관성 보장

🔹 배포 및 운영

AWS EC2에 Spring Boot JAR 배포, Oracle 연동
application.yml 프로파일(local/prod) 분리
배포 후 스모크 테스트, 버그 핫픽스 및 운영 경험

10-3. 전세현 – 외부 API 수집 · 환율 · 마이데이터 비교

🔹 외부 API 연동(수집 파이프라인)

Korea Exim 환율 API
- authkey, searchdate, data=AP01 파라미터 기반 일자별 환율 JSON 수신
- 주말/공휴일에는 직전 영업일 기준으로 자동 보정
- 당일 데이터가 비어 있을 경우 최근 유효 데이터 조회
FxService에서 환율 데이터를 가공해 Controller로 전달, 화면에 USD/KRW 환율 표시

🔹 마이데이터 기반 연금상품 비교 서비스

MyDataAccount 테이블 설계 및 샘플 데이터 구성
- 은행명, 운용사, 상품명, 위험등급, 수익률, 가입금액, 평가금액 등
CompareService
- 타행 상품의 평균 수익률 계산 → 기준 수익률 산정
- 타입/위험등급별 후보상품 필터링
- 사용자의 보유 상품 대비 더 높은 수익률을 가진 상품만 추천 리스트로 추출
CompareController
- CompareService 결과를 View로 전달
- 사용자가 자신의 타행 IRP/연금과 BNK 상품을 함께 비교할 수 있는 화면 구성

10-4. 이준우 – 로그인/회원 파트 · QR 기반 IRP 계좌 개설

🔹 로그인·회원가입·계정 관리

로그인
- 아이디·비밀번호 입력 시 비밀번호 해시 검증
- 로그인 성공 시 메인 페이지 이동
- 헤더 중앙에 mid를 5초간 Toast로 노출
- 헤더 우측에 로그아웃 / 남은 세션 시간 / 연장 기능 구현
회원가입
- 약관 동의(필수 항목 체크 시만 다음 단계 이동)
- 본인인증: 휴대폰 인증, 공동인증서(모의) 중 택1
- 휴대폰 인증 성공 시 입력 정보 저장
- 공동인증서는 PNG/JPG 업로드 + 패스워드 123456 조합으로 모의 구현
- 추가 정보 입력 – 아이디 중복 확인, 비밀번호 규칙 검사, 카카오 주소검색(우편번호) API, 이메일 인증
- 가입 완료 시 USERS, PCONTRACT에 정보 삽입(가입일시, 회원등급 등)
아이디·비밀번호 찾기
- 휴대폰/이메일 인증 기반 ID/PW 찾기
- 임시 비밀번호 발급 시 숫자+영문 조합 10자리 생성 후 해시 저장
비밀번호 변경
- 현재 비밀번호 실시간 검증
- 현재 비밀번호와 새 비밀번호가 동일하면 변경 불가
- 모달에서 휴대폰 또는 이메일 인증 후 변경 완료

🔹 QR 기반 IRP 계좌 개설 플로우

PC 화면에서 QR 코드 기반 인증 시작
JS에서 /irp/account/start로 임시 토큰 및 pcontractId 요청
전달받은 pcontractId를 포함한 QR 인증 URL 생성
QR 라이브러리로 QR 이미지를 만들어 화면에 표시
모바일에서 QR 스캔 → 정보 입력(이름, 생년월일, 전화번호 등) 후 서버 전송
서버는 입력 정보로 회원/비회원 구분 처리
- 기존 회원: USERS 정보와 매핑
- 비회원: GUEST 형태로 신규 등록
PC 화면에서는 /irp/account/status를 폴링하며 인증 완료 여부 확인
성공 시 다음 단계(비밀번호 설정, 계좌 생성)로 자동 진행

10-5. 조지영 – 기업뱅킹 · 영업점/ATM 조회 · 공통 프론트

🔹 BNK 영업점/ATM 통합 조회 서비스

카테고리 탭
- 영업점, 365코너, 24/365코너, 대여금고, 외화ATM 5개 탭 구성
- 탭 변경 시 해당 카테고리만 자동 필터링 후 즉시 결과 갱신
지역 필터
- 시/도, 구/군 2단계 필터
- 아무것도 선택하지 않으면 전체 노출
키워드 검색
- 지점명, 도로명주소, 지번주소 검색 지원
- 검색 시 리스트가 즉시 정렬 및 필터링
지점 카드형 UI
- 지점명, 전화번호, 주소, 서비스 정보, 대기고객 수 등을 카드 단위로 표시
Kakao Map 연동
- 검색된 지점들을 Kakao Map에 마커로 표시
- 리스트와 지도 패널을 동기화해 “목록 + 지도” 패턴 구현
BRANCH DB 설계 & CRUD
- BRANCH 테이블 설계 및 대량 데이터 입력/정제
- CsBranchController + BranchService 기반 조회/등록/수정/삭제 기능 구현

🔹 기업뱅킹/퇴직연금 기업 기능

기업–직원–납입–거래–정산 흐름을 고려한 기업 퇴직연금 프로세스 설계
ERD를 재정비하며 기업뱅킹 도메인에 맞는 데이터 구조 정리
일부 화면 및 흐름(납입/정산 관련 UI) 구현

🔹 공통 프론트/레이아웃

헤더/푸터 및 일부 공통 레이아웃/스타일 작업
모바일 가독성을 고려한 카드형 UI 설계 및 CSS 보완

📘 마무리

본 프로젝트는 퇴직연금·증권·마이데이터·지점 조회를 하나의 플랫폼으로 통합하여
BNK 부산은행 퇴직연금 사용자의 실제 사용 흐름에 가깝게 구현하는 것을 목표로 하였습니다.

Name		Name	Last commit message	Last commit date
Latest commit History 931 Commits
.idea		.idea
.vscode		.vscode
BNK-RetirementPension		BNK-RetirementPension
BNK_DMD		BNK_DMD
components		components
layouts		layouts
pages		pages
.gitignore		.gitignore
BNK_DDL.ddl		BNK_DDL.ddl
BNK_DMD.dmd		BNK_DMD.dmd
README.md		README.md

yingbbang/BNK-The-First-Main-Project

Folders and files

Latest commit

History

Repository files navigation