2026.07 – 진행 중
텅장
카드 청구 기간을 기준으로 "이번 달에 실제로 빠져나갈 돈"을 계산해 주는 웹 가계부.
링크 열기 ↗배경
카드사마다 마감일·결제일이 달라, 달력 기준 가계부로는 “이번 달에 실제로 출금될 금액”을 알기 어려웠다.
한 일
카드 청구 기간 기반 정산
- 카드별 마감일 / 결제일을 입력받아 달력월이 아닌 실제 출금 예정 금액을 계산
- 월정산 화면에서 “출금일 기준 / 거래일 기준” 두 가지 보기 토글 제공
- 마감일이 월 중간·월말·연말에 걸치는 경계 케이스를 실제 데이터로 검증해 결제월 중복·누락 없음을 확인
카드 혜택 자동 매칭
- 카드별 할인 규칙(정률·정액, 분류·구매처 조건, 월 한도) 등록 시 거래 입력에서 조건에 맞는 혜택을 자동 매칭·할인 제안
- 원금 / 할인액 / 실결제액을 분리 저장하고 엑셀 내보내기에도 3개 열로 구분 표시
고정 수입·지출 자동화 + 예산 관리
- 매월 특정일 자동 거래 생성, 등록이 밀린 달은 소급 생성
- 카테고리별·전체 월 예산 설정, 초과 시 배너 경고, 저장 전 “예산 68% 사용” 미리보기 제공
사용성
- 최근 구매처 자동완성(사용 빈도 + 대표 분류 추천), 빠른 입력 템플릿, 직전 거래 복제
- 삭제 후 3초 내 되돌리는 Undo 토스트, 모바일 좌우 스와이프로 월 이동
- 서버사이드 통합 검색(구매처·분류·메모·날짜·금액범위) + 엑셀 내보내기(SheetJS), 날짜별 메모장
트러블슈팅 / 기술적 의사결정
- 낙관적 업데이트(즉시 반영 후 지연 삭제) 구조에서 “삭제 대기 중 다른 거래를 수정하면 서버 재조회 시 삭제 대기 항목이 되살아나는” 동시성 버그를 직접 발견하고 수정
- SQLite(D1)는 UNIQUE 제약 직접 DROP이 불가능해, 테이블 rename → 제약 없는 새 테이블 생성 → 데이터 복사 → 기존 테이블 삭제 방식의 무중단 마이그레이션 설계
- WSL2에서 Node
fs.copyFileSync가 EPERM으로 빌드를 막던 문제를 원인 분석 후 빌드 스크립트 우회로 해결 - 요구사항을 그대로 구현하지 않고 실제 사용 맥락(카드 결제 구조, UI 일관성)을 근거로 설계안을 선택 (예: 혜택 월 한도 기준을 “카드 청구월”이 아닌 “거래일”로 결정)