출장 차량정비 예약 플랫폼 개편
정비 매니저가 사용자가 고른 시간에 집 앞이나 회사로 찾아가 엔진오일 · 배터리를 교체해 주는 출장 차량정비 서비스에서, 앱 2.0 개편이 올라설 구조를 설계하고 기반을 만들었습니다. 구상으로만 있던 설계를 실제 프로젝트 구조로 옮기는 일이었고, 기존 출장정비 예약 흐름은 그대로 지켜야 했습니다. 구조가 흐리면 기능이 하나 늘 때마다 고칠 곳이 여러 화면으로 번집니다. 작업은 화면 · 통신 · 기기 내 저장소의 경계를 나누는 데서 시작해, 함께 일한 개발자들과의 구조 논의와 인수인계까지입니다.
구상으로만 있던 설계를 실제 프로젝트로 옮긴 앱 구조
출장정비 앱 2.0 개편은 전체 설계가 구상으로만 있던 상태에서 시작했습니다. 화면 모듈, 데이터 모델, 통신 계층, 기기 내 저장소의 경계를 나눠 실제 프로젝트 구조로 구체화했습니다. 화면마다 서버 요청, 업무 규칙, 화면 상태, 사용자 입력을 분리해 각 화면이 맡는 일을 분명히 했습니다. 새 기능이 들어와도 기존 경계를 건드리지 않고 붙일 수 있는 형태를 기준으로 삼았습니다.

예약 · 차량 정보 · 서비스 상품 요청을 한 틀에 담은 통신 계층
출장정비 앱은 출장정비 예약, 차량 정보, 서비스 상품처럼 성격이 다른 서버 요청을 여러 화면에서 보냅니다. 사용자는 차량을 등록하고 엔진오일 · 배터리 같은 정비 상품을 고른 뒤, 정비 매니저가 찾아올 시간과 장소를 정해 예약합니다. 요청을 도메인별로 정리해 같은 틀로 만들고, 비동기로 돌아오는 응답은 한 가지 흐름으로 받아 화면 상태로 이어지게 했습니다. 요청이 늘어도 어디에 추가하고 어디서 응답을 받는지가 한 가지로 정해집니다.

차량 정보와 작성 중인 예약을 앱 안에 두는 기기 내 저장
출장정비 앱은 차량 정보, 사용자 상태, 임시로 저장해 둔 데이터를 앱 안에 유지합니다. 이 데이터를 위한 기기 내 저장 구조를 설계하고, 네트워크 상태와 화면 흐름에 따라 필요한 데이터를 꺼내고 갱신하는 접근 계층을 따로 정리했습니다. 어떤 데이터를 기기에 두고 어떤 데이터는 서버에서 새로 받을지를 이 단계에서 나눴습니다.

주니어와 함께 맞추고 시니어에게 넘긴 설계 의도
출장정비 앱의 구조는 주니어 개발자들과 함께 논의하며 구현 방향을 검증했습니다. 코드만 쓰지 않고 화면 상태 · 통신 · 기기 내 저장소가 왜 나뉘어야 하는지를 설명하며, 각자의 역할을 같이 맞춰 갔습니다. 구조 작업을 마친 뒤에는 이어서 개발할 시니어 개발자에게 설계 판단의 이유와 확장 지점까지 정리해 넘겼습니다.

이 작업의 포인트
화면 · 통신 · 기기 내 저장소의 경계를 나눈 앱 구조
예약 · 차량 정보 · 서비스 상품 요청을 한 틀로 다루는 통신 계층
설계 판단의 이유와 확장 지점까지 넘긴 인수인계
인사이트
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…



