대출 계산기 직접 만들어서 쓰고 있습니다

작년에 대출 알아보면서 느낀 건데 은행 계산기들 진짜 불편합니다. 어디는 원리금균등만 되고, 어디는 총이자를 안 보여주고, 상환방식 바꿔가며 비교하려면 창 세 개 띄워놓고 메모장에 숫자를 옮겨 적어야 해요. 그 짓을 몇 번 하다가 현타가 와서 주말에 그냥 만들어버렸습니다.

쓰는 법은 별거 없어요. 원금, 이자율, 기간 넣으면 월 상환액이랑 총 이자가 나옵니다. 슬라이더로 기간을 움직이면 숫자가 바로 바뀌는데 "5년 줄이면 이자 얼마 빠지지?" 이런 게 실시간으로 보여서 은근 중독성 있습니다. 밤에 누워서 이것만 30분 만진 적도 있음ㅋㅋ

제일 공들인 건 상환방식 3종 비교예요. 원리금균등 / 원금균등 / 만기일시를 나란히 놓고, 같은 조건에서 이자 제일 적게 나오는 쪽을 표시해줍니다. 저는 막연히 원리금균등이 무난하겠거니 했는데 숫자로 직접 보니 생각이 좀 바뀌더라고요. 이런 건 말로 들을 때랑 눈으로 볼 때랑 무게가 다릅니다.

중도상환 시뮬레이션도 있어요. 3년차에 5천 더 갚으면 어떻게 되는지, 기간을 줄일지 월 납입금을 줄일지 골라서 전후 비교로 보여줍니다. 중도상환수수료까지 넣어서요. 사실 이 기능은 제가 제일 궁금했던 거라 제일 열심히 만들었습니다.

만든 얘기를 조금 하자면 Vite + React + TypeScript 조합이고, 차트는 라이브러리 안 쓰고 SVG로 직접 그렸습니다. 도넛 차트 하나 그리자고 차트 라이브러리를 통째로 얹는 게 아까웠거든요. 대신 print용 CSS를 따로 짜서 계산 결과를 A4 한 장 PDF로 뽑을 수 있게 했는데, 이게 의외의 히트였어요. 은행 상담 갈 때 뽑아서 들고 갔더니 상담사분이 살짝 당황하시면서도 얘기가 훨씬 빨리 끝났습니다.

천단위 콤마 입력, 억/만 한글 표기, 입력값 localStorage 저장 같은 자잘한 것들은 쓰다가 불편할 때마다 하나씩 붙였고요.

은행 가기 전에 조건 몇 개 미리 돌려보고 가세요. 숫자를 알고 앉아 있는 거랑 모르고 앉아 있는 건 상담 분위기 자체가 다릅니다. 저는 이거 만들고 나서 처음으로 대출 상담에서 안 휘둘렸습니다. 참고용 계산기니까 최종 숫자는 당연히 은행 걸 믿으시고요.

혹시 써보고 "이 기능은 왜 없냐" 싶은 게 있으면 댓글로 남겨주세요. 지금 생각 중인 건 변동금리 시나리오(금리가 중간에 바뀌면 어떻게 되는지)랑 거치기간 옵션인데, 둘 다 계산식이 만만치 않아서 미루는 중입니다. 필요하다는 분이 많으면 각 잡고 붙여볼게요. 어차피 제가 다음 대출 받기 전까지는 계속 손볼 예정입니다.