블록체인 지갑 앱
이미 운영 중인 블록체인 지갑 앱을 다른 플랫폼용 앱으로 혼자 옮겨 만들었습니다. 지갑은 주소 하나, 서명 하나가 어긋나면 사용자가 자기 자산을 찾지 못하는 서비스라, 기존 앱과 같은 지갑을 같은 주소로 다루는 것이 먼저였습니다. 기존 앱의 소스만 보고 기능과 화면 흐름을 분석해, 화면 구조 설계부터 지갑 생성 · 복구, 전송 · 서명, 거래 내역 조회까지 구현했습니다. 기존 동작을 그대로 따라가는 데 그치지 않고, 화면 구조와 조작을 새 플랫폼의 사용 방식에 맞게 다시 정리했습니다.
소스만 보고 옮기되, 새 플랫폼 방식으로 다시 짠 화면
블록체인 지갑 앱의 이식은 기존 앱의 소스를 기준으로 기능과 화면 흐름을 분석하는 데서 시작했습니다. 다른 담당자 없이 혼자 맡아, 기존 동작을 옮기는 일과 새 플랫폼의 사용 방식에 맞게 화면 구조와 조작을 다시 정리하는 일을 함께 했습니다. 화면, 화면 상태, 화면 이동의 책임을 나누는 구조를 직접 설계해, 지갑 · 전송 · 거래 내역 화면의 복잡도를 낮췄습니다.

기존 앱에서 만든 지갑을 같은 주소로 되살리는 복구
블록체인 지갑은 하나의 지갑에서 표준 경로 규칙에 따라 여러 주소를 파생하는 계층형(HD) 구조를 씁니다. 이 파생 규칙을 새 플랫폼에 옮기면서, 지갑을 만들고 복구하고 주소를 파생한 결과가 기존 앱과 맞는지 경로, 키 관리, 주소 생성 과정을 하나씩 검증했습니다. 같은 지갑이 두 앱에서 다른 주소를 내면 사용자는 자기 자산을 찾지 못합니다.

개인키와 서명을 화면에서 떼어 둔 전송
암호화폐 전송은 받는 주소와 금액을 넣고, 거래에 서명해 블록체인 네트워크로 보내고, 처리 상태를 확인하는 순서로 이어집니다. 개인키와 서명을 다루는 부분은 화면 로직과 분리해, 화면을 고쳐도 키와 서명 흐름은 건드려지지 않게 했습니다. 네트워크 응답이 늦거나 실패할 때, 거래가 처리 중에서 완료로 바뀔 때처럼 사용자가 예민해지는 순간의 화면도 함께 처리했습니다.

잔액 · 주소 · 거래 목록을 화면 크기에 맞춰 다시 짠 배치
지갑 화면에는 잔액, 주소, 전송 입력, 거래 목록처럼 한 번에 읽어야 할 정보가 몰려 있습니다. 주요 화면의 배치를 새로 짜서, 기기마다 다른 화면 크기와 안전 영역(화면 위아래 가장자리처럼 가려질 수 있는 부분)에 맞춰 정리했습니다. 거래 목록에서 한 건을 누르면 그 거래의 상세를 따로 조회합니다.

이 작업의 포인트
기존 앱 소스만으로 다른 플랫폼에 단독 이식
기존 앱과 같은 주소를 내는 계층형(HD) 지갑 생성 · 복구
개인키 · 서명을 화면 로직과 떼어 놓은 전송 구조
인사이트
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…



