주유기록

주유기록

주유·정비·전기차 비용을 한 번에 기록하고, 월별·연도별 지출을 한눈에 관리하는 차량 관리 앱

프로젝트에 사용한 기술 스택

모두 보기접기
React NativeNode.jsFastifyGoogle Cloud PlatformExpo
+2
Frontend
ExpoReact Native
Backend
FastifyNode.js
DevOps
Google Cloud Platform
Product
FigmaAdMob

프로젝트에 참여한 크루

제목

차량 운행에서 가장 기본이 되는 관리 항목은 주유 기록입니다. 하지만 실제로는 많은 사람들이 여전히 엑셀, 수기 메모, 혹은 복잡한 차량 관리 앱을 사용하고 있습니다.

저 역시 2017년부터 주유 내역을 엑셀로 관리해왔고, 기록은 가능했지만 입력 피로도, 누락, 조회의 불편함이 항상 문제였습니다.

“기록은 남기고 싶은데, 관리까지는 하고 싶지 않다.”

이 문제를 해결하기 위해 필요한 기능만 남긴 차량 기록 앱을 직접 기획·개발했습니다.


해결하고자 한 문제

• 엑셀 기반 주유 기록은 모바일 입력에 최적화되어 있지 않음 • 기존 차량 관리 앱은 광고, 커뮤니티, 판매 기능 등으로 흐름이 복잡함 • 주유 비용은 기록하지만 월/연 단위 지출을 직관적으로 보기 어려움 • 여러 대의 차량을 사용하는 경우 관리 난이도가 급격히 상승

핵심 컨셉

판매·광고·홍보 기능 제거 → 오직 “기록”과 “조회”에만 집중

엑셀을 모바일 기록장으로 옮긴다 → 불필요한 기능은 과감히 제거

10초 안에 입력, 한눈에 조회

주요 기능

  1. 주유 기록 중심 설계 • 날짜, 주유소, 금액, 주유량, 주행거리 입력 • 이전 주유 기록을 기준으로 주행 거리 자동 계산 • 단가(원/L) 자동 산출

  2. 월별 · 연도별 지출 통계 • 주유 비용을 월/연 단위로 자동 집계 • 주유 패턴을 한눈에 파악 가능 • 기록이 쌓일수록 가치가 커지는 구조

  3. 여러 대의 차량 관리 • 차량 수 제한 없이 무료 추가 • 개인 차량 / 회사 차량 / 법인 차량 구분 가능 • 차량별 기록 분리 조회

  4. 최소 입력 UX • 필수 입력값만 노출 • 기록 흐름을 방해하는 화면 제거 • 모바일 입력에 최적화된 폼 구조

기술 스택 및 구조

App / Client • React Native + Expo • iOS / Android 단일 코드베이스 • UX 설계부터 화면 구현까지 직접 진행

Backend • Node.js + Fastify • REST API 기반 구조 • 인증, 기록 저장, 통계 집계 로직 분리

Infra • GCP • 서버 및 데이터 관리 • 확장 가능한 구조로 설계

기타 • AdMob: 최소한의 수익 구조 실험 • Figma: 기획·디자인 직접 설계

내가 담당한 역할 • 서비스 아이디어 도출 • 기능 정의 및 범위 설정 • UX 플로우 설계 • 앱 UI 디자인 • 프론트엔드 / 백엔드 개발 • 배포 및 운영

기획자, 디자이너, 개발자의 역할을 혼자 모두 수행한 프로젝트입니다.

결과와 배운 점 • “기능이 많을수록 좋은 서비스는 아니다”라는 확신 • 문제 정의가 명확하면 기술 선택은 단순해진다 • 실제로 사용하는 서비스를 만들 때 UX 기준이 훨씬 명확해짐 • 엑셀 기반 업무를 모바일 서비스로 전환하는 경험 축적

이 프로젝트 이후, 업무 관리 · 기록 시스템을 설계할 때 **“엑셀에서 왜 이 구조가 나왔는가?”**를 먼저 고민하게 되었습니다.

이런 분들에게 적합한 프로젝트입니다 • 불필요한 기능 없이 본질적인 문제 해결에 집중한 앱 사례 • 개인 프로젝트지만 실제 운영을 고려한 구조 • 기획 → 개발 → 운영까지 전 과정을 경험한 사례