간편결제 앱 개선·운영
카드사가 운영하는 간편결제 서비스의 결제 기능을 개선하고 운영했습니다. 매일 결제에 쓰이는 서비스라 한 번의 오류가 곧바로 돈 문제가 됩니다. 결제 수단이 늘고 화면이 바뀌는 동안에도 기존 결제 흐름이 흔들리지 않게 하는 데 무게를 뒀습니다. 작업은 결제 화면, 다른 카드사 카드 등록, 이용내역 · 청구 조회, 배포 자동화까지 앱 · 웹 · 서버가 맞물린 서비스 전체에 걸쳐 있습니다.
카드 · 계좌 · 포인트를 골라 바코드 하나로 끝내는 결제
매장 결제 화면은 등록한 신용 · 체크카드와 계좌, 포인트, 상품권 가운데 하나를 골라 바코드나 QR 코드로 결제하는 화면입니다. 계산대 앞에서 쓰는 화면이라, 앱을 열고 코드가 뜰 때까지 걸리는 몇 초가 그대로 불편이 됩니다. 결제 수단이 늘어도 고르는 단계가 길어지지 않게 하는 것이 이 화면의 기준이었습니다.
다른 카드사 카드까지 한 목록에 두는 결제 수단 등록
카드사들이 서로의 카드를 등록해 쓸 수 있게 하는 개방형 결제에 맞춰, 다른 카드사의 신용 · 체크카드를 등록하는 흐름을 개발했습니다. 결제 수단 등록에서 카드사를 고르고 카드를 더하면, 자사 카드와 같은 목록에 놓여 결제 화면에서 함께 고릅니다. 카드사마다 다른 규칙을 한 목록에서 다뤄야 해서, 기존 자사 카드 결제가 영향을 받지 않는지를 출시마다 따로 확인했습니다.
결제 예정 금액에서 즉시결제까지 이어지는 청구 화면
청구 화면은 이번 달 결제 예정 금액과 카드별 이용내역을 보여 주고, 결제일 전에 미리 갚는 즉시결제로 이어집니다. 금액이 틀리면 고객센터 전화로 바로 이어지는 화면이라, 서버가 준 금액을 화면에서 다시 계산하거나 반올림하지 않고 그대로 보여 주는 쪽을 지켰습니다.
출시마다 손으로 하던 일을 줄인 배포 자동화
금융 앱은 출시 한 번에 빌드, 서명, 심사 제출, 버전 기록이 따라옵니다. 이 순서를 사람이 손으로 밟으면 단계를 빠뜨리거나 다른 설정으로 내보내는 실수가 생깁니다. 반복되는 출시 절차를 자동화해, 누가 내보내도 같은 순서로 같은 결과가 나오게 했습니다.
이 작업의 포인트
카드 · 계좌 · 포인트를 한 화면에서 고르는 바코드 · QR 결제
다른 카드사 카드까지 등록해 쓰는 결제 수단 관리
배포 자동화로 출시마다 반복되던 수작업과 실수 여지 축소
인사이트
GA4 client_storage: 'none'은 정말 쿠키를 막을까?
두 달 전 이 블로그에 「GA4 쿠키 없이 쓰기」라는 글을 썼습니다. clientstorage: 'none' 으로 쿠키 저장을 끄고, 자체 분석이 쓰던 익명 ID 를 clientid 로 넘기면 쿠키 0개로 GA4 를 쓸 수 있다는 내…
GA4 Measurement Protocol: gtag.js 없이 서버에서 이벤트 보내기
랜딩 페이지의 전송량을 파일 단위로 쪼개 보다가, 가장 큰 파일이 우리 코드가 아니라는 것을 알았습니다. Google Analytics 의 gtag.js 였고, 방문 한 번에 176KB 를 받고 있었습니다. 페이지 전체가 1,094K…
중소 제조업 AI 도입 순서: DX를 먼저 끝내야 할까?
공장을 가진 중소·중견 제조기업 16만여 곳 가운데 스마트공장을 도입한 곳은 19.5%입니다. 회사가 작을수록 이 비율은 더 떨어집니다. 중소벤처기업부가 2025년 4월에 낸 제1차 스마트제조혁신 실태조사 결과입니다. 그림: 기업 규…
Next.js loading.tsx와 404: 버튼이 화면보다 먼저 살아나게 하기
관리 화면 왼쪽 위에 사이드바를 접고 펴는 ☰ 버튼이 있습니다. 폭 하나 바꾸는 버튼인데, 대시보드에서 누르면 2초 넘게 아무 반응이 없었습니다. 레이아웃만 바꾸는 일이 왜 이렇게 오래 걸리는지부터 들여다봤습니다. Next.js 16…