온라인 플랫폼에서 아이템을 거래할 때 가장 번거로운 요소 중 하나는 바로 수수료 계산입니다. 특히 장터 시스템은 수수료 체계가 직관적이지 않아 직접 계산기를 두드리다 보면 착오가 생기기 쉽습니다. 기본적으로 플랫폼 자체 수수료가 청구되며, 특정 게임의 경우에는 추가적인 배급사 수수료가 더해져 총액의 15%가 차감되는 복잡한 구조를 보입니다. 이러한 정산 체계로 인해 소수점 단위의 오차가 누적되면 최종 정산 금액에서 예상치 못한 손해가 발생할 가능성이 큽니다. 이번에는 이러한 번거로움을 해결하기 위해 수수료율을 완벽히 계산하고 매물별 수익률을 한 화면에서 비교할 수 있는 웹 어플리케이션을 빌드해 보겠습니다.

개발 도구로는 터미널 기반의 에이전트 도구인 Claude Code 를 활용하겠습니다. 복잡한 환경 설정 없이도 단일 파일로 작동하는 완성도 높은 웹 페이지를 효율적으로 생성할 수 있어, 빠른 개발이 필요한 도구를 만들 때 무척 유용합니다.

자주 발생하는 문제와 대처 방안

수수료 계산 웹앱을 구현하고 다듬는 과정에서 마주칠 수 있는 대표적인 쟁점과 그 대처 방안을 정리했습니다.

첫째, 실제 장터의 수수료와 프로그램 계산 결과 사이에 미세한 금액 차이가 발생하는 경우가 있습니다. 이는 판매 가격의 15%를 통째로 곱해서 연산했을 때 자주 생기는 현상입니다. 해당 플랫폼의 정산 시스템은 두 가지 수수료를 각각 절사하거나 특정 연산 단위로 끊어서 최종 합산하는 방식을 취합니다. 이를 수정하려면 연산식 내부에서 5%의 플랫폼 수수료와 10%의 배급사 수수료를 개별적으로 구한 뒤, 각각 내림 처리하거나 공식 반올림 처리를 하여 합산하도록 계산 로직을 미세 조정하면 해결에 도움이 됩니다.

둘째, 목록에 저장한 아이템들이 새로고침을 하면 모두 초기화되거나 렌더링되지 않는 현상이 발생합니다. 이 문제는 로컬 스토리지에 데이터를 읽고 쓰는 과정에서 데이터가 유효한 JSON 형식으로 저장되지 않았거나, 파싱 중에 예외 처리가 누락되었을 때 주로 관찰됩니다. 브라우저의 개발자 도구를 열어 콘솔 탭의 상세 에러 로그를 점검하고, 데이터를 파싱하는 구문 앞뒤에 예외 처리를 추가하도록 코드를 정비해야 합니다.

셋째, 입력창에 특수문자나 천 단위 구분 기호인 쉼표를 기입했을 때 계산 결과에 숫자가 아닌 값을 뜻하는 NaN 오류가 표시되는 문제가 보고되곤 합니다. 문자열이 숫자로 정상 변환되지 않아 수식 연산이 중단되는 현상이 주된 원인으로 꼽힙니다. 이를 방지하기 위해서는 HTML 입력 태그의 형식을 숫자로 고정하고, 자바스크립트에서 값을 받아올 때 숫자 이외의 문자열을 정규식으로 제거한 뒤 숫자로 치환하여 연산하도록 방어 코드를 적용해야 안전합니다.

향후 확장 방향

이번에는 단일 페이지 내에서 수동으로 입력해 마진을 비교하는 도구를 작성하여 완성도를 높여 보았습니다. 여기서 한 단계 더 나아가려면 플랫폼에서 제공하는 공개 API 링크를 연동하여 아이템 이름 입력 시 최근 24시간 동안의 평균 거래 가격이나 최저가를 자동으로 채워주는 기능을 결합해 볼 수도 있습니다. 실시간 연동 기능이 추가되면 매번 시세를 직접 조회할 필요 없이 자동으로 마진이 계산되므로 거래 속도와 편의성이 대폭 향상될 것으로 전망합니다.