웹과 모바일 앱을 위한 하나의 백엔드: 실용적인 계획
하나의 데이터 모델과 공유 규칙으로 웹과 모바일 앱을 위한 하나의 백엔드를 설계하는 방법을 배우세요. 사무실 직원과 현장 팀에 맞춘 UI 선택도 다룹니다.

두 앱이 갈라지는 이유
두 앱은 같은 목표에서 시작해도 서로 다른 시스템처럼 동작하게 될 수 있습니다. 사무실 팀은 명확한 관리자용 웹 앱을 필요로 하고, 현장 팀은 빠른 모바일 앱을 필요로 합니다. 둘 다 같은 작업, 고객, 양식, 상태 업데이트를 다루지만 각 앱은 서로 다른 일상 루틴에 맞춰 형태가 달라집니다.
바로 그 지점에서 분리가 시작됩니다. 사무실 직원은 작업 지시서를 생성하고 일정 잡기를 할 수 있지만, 현장 직원은 현장에서 그것을 업데이트합니다. 두 팀이 같은 레코드를 만지지만 각 앱이 다르게 처리하면 문제가 빠르게 드러납니다. 웹에서 "할당됨"으로 표시된 작업이 모바일에서는 "준비됨"으로 처리될 수 있습니다. 한 앱에서 필수로 요구하는 메모가 다른 앱에서는 선택 사항일 수 있습니다. 곧 그 레코드는 하나의 일관된 기록을 전달하지 못합니다.
주된 원인은 로직이 중복되기 때문입니다. 비즈니스 규칙이 두 앱에 각각 내장되면 작은 차이가 실제 충돌로 발전합니다. 한 화면은 기술자가 사진 없이 작업을 종료하도록 허용할 수 있고, 다른 화면은 사진이 추가될 때까지 청구를 막을 수 있습니다. 이제 상태는 작업이 완료되었다고 말하지만 데이터는 불완전합니다.
이름도 흐려집니다. 한 팀은 "방문 완료"라고 하고, 다른 팀은 "작업 완료"라고 하며, 관리자는 "종결"이라고 말합니다. 대화에서는 충분히 비슷해 보이지만 소프트웨어에서는 서로 다른 단계, 필터, 보고서가 됩니다. 특히 새 팀원이 자신 앞에 있는 화면에서 프로세스를 배우면 혼란은 시간이 지날수록 커집니다.
작은 변경조차도 간격을 넓힐 수 있습니다. 새로운 승인 단계, 필요한 서명, 추가 고객 필드는 사소하게 들릴 수 있습니다. 그러나 변경을 두 곳에서 다시 만들어야 한다면 보통 한 앱이 먼저 업데이트되고 다른 앱이 나중에 따라갑니다. 그 지연은 재작업, 지원 문제, 잘못된 데이터를 만듭니다.
그래서 공유 백엔드가 중요합니다. 관리자 웹 앱과 현장 모바일 앱이 같은 레코드를 공유하지만 규칙을 공유하지 않으면 시스템은 서서히 둘로 갈라집니다.
하나의 공유 워크플로로 시작하세요
화면을 생각하기 전에 시작부터 끝까지 실제 프로세스를 적어보세요. 요청이 생성되는 순간부터 작업이 종료, 승인, 청구되는 순간까지를 기록합니다. 이렇게 하면 두 앱에 같은 골격이 생깁니다.
흔한 실수는 관리자 웹 앱과 현장 모바일 앱을 별개의 제품으로 설계하는 것입니다. 그러면 보통 같은 프로세스의 두 버전, 같은 상태의 두 의미, 이후에 수작업 수정이 필요해집니다. 워크플로가 먼저여야 합니다.
평이한 언어를 사용하세요. 예를 들어: 요청 생성, 할당됨, 수락됨, 진행 중, 일시중지, 완료, 검토됨. 그런 다음 각 단계를 보고 누가 해당 단계를 다루는지 물어보세요. 어떤 단계는 두 역할 모두에 속합니다. 사무실 직원이 작업을 할당할 수 있고 현장 직원이 모바일에서 수락할 수 있습니다. 둘 다 서로 다른 워크플로가 아니라 하나의 워크플로의 일부입니다.
먼저 공유 단계를 표시하세요
계획하는 가장 쉬운 방법은 공유 작업과 장치별 작업을 분리하는 것입니다.
공유 작업은 요청 생성, 작업자 할당, 상태 업데이트, 메모 추가, 작업 종료 같은 것입니다. 웹 중심의 작업은 큐 검토, 재할당, 완료 승인, 보고서 실행 등이 포함되는 반면 모바일 중심의 작업은 작업 수락, 사진 업로드, 서명 캡처, 도착 표시 등이 포함됩니다.
이렇게 하면 앱이 달라져야 할 지점과 달라지면 안 되는 지점을 볼 수 있습니다. 웹 앱은 더 많은 필터와 관리 컨트롤을 보여줄 수 있고, 모바일 앱은 더 큰 버튼과 더 적은 선택지를 사용할 수 있습니다. 그러나 상태 논리, 검증, 비즈니스 규칙은 한곳에 있어야 합니다.
상태 변경의 신뢰 원천을 일찍 정하세요. 작업이 사진과 고객 서명이 추가된 후에만 "완료"로 이동할 수 있다면, 그 규칙은 백엔드에 있어야 합니다. 모바일 화면이나 관리자 패널에만 존재해서는 안 됩니다.
간단한 테스트가 도움이 됩니다: 동일한 동작이 어느 앱에서 실행되든 결과가 동일해야 하는가? 답이 "예"라면 워크플로는 공유된 것입니다. 아니라면 비즈니스 규칙이 인터페이스 안에 숨겨져 있을 가능성이 큽니다.
핵심 데이터 모델 정의하기
화면으로 시작하지 말고 두 앱이 동의해야 하는 레코드로 시작하세요. 매일 비즈니스가 추적하는 실제 항목부터 시작합니다: 고객, 위치, 작업, 직원, 재고, 인보이스, 검사 등. 관리자 웹 앱과 현장 모바일 앱이 같은 작업을 다룬다면 그 작업은 하나의 공유 데이터 모델에 하나의 레코드로 존재해야 합니다.
유용한 테스트는 "이 두 앱이 사실에 대해 다르게 말할 수 있는가?"입니다. 답이 "예"라면 모델이 잘못 나뉜 것입니다. 백엔드는 단일 진실의 원천을 보유해야 합니다.
각 핵심 레코드에 대해 공유 필드를 함께 유지하세요. 작업지시는 ID, 상태, 고객, 위치, 배정된 작업자, 예정일, 완료일, 메모, 첨부파일, 사진 등을 포함할 수 있습니다.
이 필드들은 서로 다르게 보일지라도 두 경험 모두에 중요합니다. 관리자 팀은 웹 대시보드에서 일정을 편집하고 직원을 할당할 수 있고, 현장 팀은 일정만 보고 사진을 업로드하고 작업을 완료로 표시할 수 있습니다. 그것은 여전히 같은 레코드이며 권한만 다를 뿐입니다.
역할별 필드는 진짜 필요가 있을 때만 추가하세요. 디스패처가 내부 우선순위 점수를 필요로 한다면 같은 작업지시에 넣고 현장 사용자에게는 숨기면 됩니다. 모바일 작업자가 오프라인 동기화 플래그나 장치 캡처 메타데이터가 필요하다면 메인 비즈니스 의미를 바꾸지 않도록 주의해 추가하세요.
앱을 실제 작업에서 사용 가능하게 만드는 지원 필드를 잊지 마세요. 소유권은 누가 레코드를 생성하고 소유하는지, 또는 누가 배정되었는지 보여줍니다. 타임스탬프는 생성, 업데이트, 시작, 완료 시점을 나타냅니다. 파일과 이미지는 작업 증거를 제공합니다. 메모는 주요 데이터를 변경하지 않고 예외를 설명하는 데 도움이 됩니다.
AppMaster를 사용하는 경우 보통 공유 엔티티를 먼저 모델링하고 웹과 모바일 앱에서 서로 다른 UI 및 접근 규칙을 적용하는 것을 의미합니다. 이렇게 하면 로직이 두 인터페이스에 퍼지지 않고 백엔드에 중심을 둘 수 있습니다.
화면에서 비즈니스 규칙을 제거하세요
관리자 웹 앱과 현장 모바일 앱이 각각 허용되는 것을 결정하면 거의 즉시 흐트러집니다. 한 화면은 다른 화면이 거부하는 값을 받아들일 수 있고, 한 앱은 작업을 "완료"로 이동시키지만 다른 앱은 여전히 "진행 중"으로 생각할 수 있습니다.
해결책은 간단합니다: 비즈니스 규칙을 백엔드에 두고 두 앱이 같은 로직을 호출하게 하세요.
검증 규칙은 한 곳에 있어야 합니다. 작업지시서가 배정되기 전에 고객, 위치, 최소 하나의 작업이 필요하다면 백엔드가 항상 이를 강제해야 합니다. 웹 앱은 사용자에게 도움말 메시지를 보여주고 모바일 앱도 동일한 메시지를 보여줄 수 있지만 규칙 자체는 어느 쪽의 소유도 아니어야 합니다.
상태 변경도 마찬가지입니다. 예를 들어 "초안", "할당됨", "진행 중", "완료", "종료" 같은 공유 상태 흐름을 사용하세요. 그 흐름이 백엔드에 있으면 두 앱은 같은 경로를 따릅니다. 관리자 팀은 웹에서 작업을 할당하고 현장 팀은 모바일에서 진행 상황을 업데이트하지만 백엔드가 허용하지 않으면 어떤 앱도 단계를 건너뛸 수 없습니다.
계산과 검사도 한 곳에서 실행하세요. 총 비용이 시간, 자재, 세금, 승인 한도에 따라 달라진다면 백엔드에서 처리하세요. 기술자가 사진이나 서명 없이 작업을 종료할 수 없다면 그 조건도 백엔드에서 확인하세요.
실제로는 어떻게 보이나요
서비스 회사를 상상해 보세요. 사무실 팀은 웹 앱을 사용해 작업을 생성하고 기술자는 현장에서 모바일 앱을 사용합니다. 두 앱은 작업을 생성, 배정, 상태 변경, 총계 계산을 위해 동일한 백엔드 로직을 호출해야 합니다.
이 분리는 화면을 단순하게 유지합니다. 각 앱은 사용자에게 보여주고 해야 할 일에 집중하고, 백엔드는 일관되게 유지해야 할 규칙을 보호합니다.
단계별로 계획하는 방법
화면이 아니라 사람으로 시작하세요. 시스템을 누가 사용하는지, 무엇을 하는지, 어떤 선택을 할 수 있는지 적어보세요.
관리자 웹 앱과 현장 모바일 앱의 경우 보통 사무실 직원, 관리자, 현장 직원이 포함됩니다. 사무실 팀은 작업을 생성하고 사람을 할당하며 변경 사항을 승인하고 작업을 종료할 수 있습니다. 현장 팀은 배정된 작업을 보기만 하고 진행 상황을 업데이트하며 메모를 추가하고 증거를 업로드할 수 있습니다.
이것이 명확해지면 한 페이지에 공유 데이터 모델을 스케치하세요. 처음에는 간단하게 유지하세요: 작업, 고객, 직원, 위치, 사진, 상태 이력. 각 레코드가 실제로 필요로 하는 필드만 추가하세요.
페이지가 아니라 레코드와 상태 변경을 중심으로 설계하세요. 두 앱이 같은 작업을 다룬다면 동일한 상태 값, 동일한 배정 규칙, 동일한 승인 로직을 사용해야 합니다.
간단한 계획 순서
- 각 사용자 역할의 주요 작업을 나열하세요.
- 각 작업이 읽고 변경하는 데이터를 적으세요.
- 상태 규칙을 명확히 정의하세요.
- 각 화면을 정확히 어떤 데이터가 필요한지에 매핑하세요.
- 샘플 데이터를 가지고 몇 가지 실제 작업으로 모델을 테스트하세요.
마지막 단계가 가장 중요합니다. 현실적인 사례를 가져와 보세요. 예를 들어 사무실에서 생성된 수리 요청이 기술자에게 배정되고 현장에서 업데이트되며 관리자가 검토하는 흐름입니다. 모델이 화면별로 숨겨진 규칙 없이 그 흐름을 처리하면 올바른 방향입니다.
각 앱에서 달라야 할 것들
백엔드는 공유로 유지하되 경험은 달라야 합니다. 관리자 웹 앱과 현장 모바일 앱은 서로 다른 목적을 제공하므로 동일한 레코드를 다르게 보여줘야 합니다.
웹 측에서는 보통 더 넓은 보기가 필요합니다. 많은 레코드를 비교하고, 열을 정렬하고, 이력을 훑어보고, 필터를 실행하며 대량 업데이트를 수행합니다. 디스패처나 운영 관리자는 테이블에서 10건의 작업을 한꺼번에 업데이트하고 직원을 할당하며 상태 변경을 확인할 수 있습니다.
모바일에서는 개요보다 속도가 더 중요합니다. 현장 직원은 보통 한 가지 명확한 답이 필요합니다: 다음에 무엇을 해야 하나? 홈 화면은 다음 작업, 주소, 연락처 정보, 마감일, 상태 업데이트 버튼을 전면에 내세워야 합니다.
같은 데이터, 다른 표현
핵심 아이디어는 간단합니다: 레코드는 같게 유지하고 레이아웃만 바꿉니다. 둘 다 동일한 작업, 고객, 상태, 메모 객체를 사용하면 비즈니스 규칙은 한곳에 유지됩니다.
변하는 것은 인터페이스입니다. 웹은 밀집된 테이블, 저장된 필터, 대량 편집 도구를 보여줄 수 있습니다. 모바일은 현재 작업과 다음 행동을 강조해야 합니다. 모바일은 카메라 사진, 서명, 바코드 스캔, 위치 수집을 활용할 수 있고, 웹은 더 깊은 검토와 보고, 예외 처리를 지원할 수 있습니다.
오프라인 사용은 또 다른 현실적인 차이입니다. 현장 앱은 지하실, 도로, 고객 사이트에서 신호를 잃을 수 있습니다. 이는 동기화 설계, 충돌 처리, 기기에 캐시해야 하는 데이터에 영향을 줍니다. 관리자 웹 앱은 보통 안정적인 연결을 가정하므로 실시간 업데이트에 더 의존할 수 있습니다.
간단한 예는 검사 프로세스입니다. 사무실 팀은 웹 앱으로 방문을 배정하고 결과를 검토하며 잘못된 항목을 대량으로 수정합니다. 검사원은 모바일 앱으로 다음 방문을 열고 사진을 찍고 도착을 확인한 다음 보고서를 제출합니다. 서로 다른 화면, 동일한 검사 레코드입니다.
간단한 예시 시나리오
장비 수리를 처리하는 서비스 회사를 상상해 보세요. 사무실 팀은 노트북에서 일하고 기술자는 하루 대부분을 이동하며 보냅니다.
디스패처는 관리자 웹 앱을 사용해 새 작업지시서를 만듭니다. 고객 이름, 주소, 문제 상세, 우선순위, 예정 시간, 배정 기술자를 입력합니다. 이는 하나의 공유 레코드를 만듭니다. 웹 전용 버전의 작업이 아니라 하나의 실제 작업입니다.
나중에 기술자는 현장 모바일 앱을 열어 동일한 작업지시서를 봅니다. 화면은 다른 환경에서 사용되기 때문에 다르게 보이지만 기본 데이터는 같습니다. 기술자는 주소를 보고 고객에게 전화하고 작업 세부를 확인하며 다시 입력 없이 진행 상황을 업데이트할 수 있습니다.
현장에서 기술자는 손상 부품의 사진을 추가하고 몇 줄의 메모를 남기며 고객 서명을 캡처합니다. 이 모든 것이 동일한 작업 레코드에 저장됩니다. 모바일 앱이 사진이나 메모를 위한 자체 사이드 시스템을 만드는 것이 아닙니다. 단지 공유 데이터 모델에 정보를 더하는 것입니다.
사무실로 돌아와 관리자는 관리자 웹 앱을 열어 업데이트된 작업을 검토합니다. 현장에서 추가된 내용을 보고 작업을 승인하고 청구 또는 후속 조치로 보낼 수 있습니다. 누군가가 두 진실을 비교할 필요가 없습니다.
상태 이력이 이 유용성을 만듭니다. 디스패처가 작업을 "예정됨"으로 설정하고 기술자가 "진행 중"으로 표시하며 관리자가 이를 "완료"로 종결하면 모두 같은 타임라인을 봅니다. 누가 상태를 변경했는지, 언제 변경했는지, 그 방문 전후에 무슨 일이 있었는지 같은 간단한 질문에 답하기 훨씬 쉬워집니다.
피해야 할 흔한 실수
가장 큰 실수는 같은 규칙을 두 곳에 넣는 것입니다. 관리자 웹 앱이 작업을 "예정됨"에서 "진행 중"으로 이동할 수 있다고 하고 모바일 앱도 그 검사를 별도로 수행하면 규칙은 흐트러집니다. 상태 변경, 권한, 필수 검사 등은 백엔드에 두어 두 앱이 같은 논리를 따르도록 하세요.
또 다른 일반적 문제는 실제로 같은 작업인데 별개의 레코드를 만드는 것입니다. 팀이 사무실 뷰와 현장 뷰를 다르게 만들고 싶을 때 이런 일이 발생합니다. 그러면 관리자 앱에는 "약속(appointment)"이 있고 모바일 앱에는 "방문(visit)"이 있어 누군가 이를 동기화해야 합니다. 이는 보통 메모 불일치, 중복 업데이트, 어떤 레코드가 진짜인지에 대한 혼란으로 이어집니다.
필드도 함정이 될 수 있습니다. 한 팀이 "한 가지만 더"라는 이유로 열을 계속 추가하는 것은 쉽습니다. 그러나 모든 필드는 목적이 있어야 합니다. 왜 중요한지, 누가 사용하는지, 규칙이나 보고서, 의사결정에 영향을 주는지 물어보세요. 답이 불분명하면 실제 필요가 생길 때까지 빼두세요.
약한 연결성은 현장 첫날까지 무시되기 쉽습니다. 기술자가 지하실, 시골 도로, 신호가 약한 창고에서 모바일 앱을 열 수 있습니다. 앱이 모든 동작에 라이브 연결을 필요로 하면 작업이 중단됩니다. 어떤 데이터를 오프라인에서 사용할 수 있어야 하는지, 어떤 동작은 나중에 동기화해도 되는지, 기기가 다시 연결될 때 충돌을 어떻게 처리할지 계획하세요.
이름도 공유 시스템을 망가뜨릴 수 있습니다. 한 팀은 단계를 "할당됨"이라고 하고, 다른 팀은 "파견됨(Dispatched)"이라고 하며, 또 다른 팀은 "준비됨(Ready)"이라고 한다면 사람들은 이를 서로 다른 상태로 취급하기 시작합니다. 일찍 하나의 공통 용어집을 합의하고 모든 곳에서 사용하세요.
좋은 직감 검사법은 간단합니다: 한 작업에는 하나의 진실 원천이 있어야 하고, 한 규칙은 한 곳에 있어야 하며, 한 상태는 하나의 명확한 이름을 가져야 합니다.
빌드하기 전에 빠른 확인 목록
무엇이든 빌드하기 전에 계획을 종이에 테스트하세요. 모델을 몇 분 안에 설명할 수 있을 만큼 간단하면 보통 두 앱이 성장해도 안정적으로 유지할 수 있습니다.
좋은 검사법은 이렇습니다: 두 팀이 같은 레코드를 가리키며 같은 의미로 말할 수 있는가? 사무실 팀이 작업, 업무, 고객, 검사 보고서를 현장 팀과 다르게 본다면 분열은 초기에 시작됩니다.
짧은 체크리스트를 사용하세요:
- 하나의 핵심 레코드(예: 작업지시서)를 선택하고 두 앱이 같은 버전을 읽는지 확인하세요.
- 검증 규칙은 각 화면 안이 아니라 백엔드에 한 번 작성하세요.
- 모든 상태 변경을 단일 경로로 테스트하세요.
- 모델을 하나의 간단한 다이어그램으로 스케치하세요.
- 모바일 뷰는 필수 요소만 남겨 간소화하세요.
작은 시나리오가 도움이 됩니다. 관리자 웹 앱이 수리 방문을 스케줄하고 모바일 앱이 기술자가 현장에서 사용하는 경우를 생각해 보세요. 관리자 팀은 필터, 보고서, 전체 고객 이력이 필요하고 기술자는 오늘의 작업, 연락처, 안전 메모, 상태 업데이트 방법만 필요할 수 있습니다. 화면이 달라도 괜찮습니다. 비즈니스 규칙이 달라서는 안 됩니다.
실용적인 테스트 하나 더: 규칙을 변경했을 때 몇 군데를 건드려야 하는지 보세요. "완료 전 사진 필요"를 바꾸려면 백엔드 로직과 여러 화면을 수정해야 한다면 설계는 이미 분리되기 시작한 것입니다.
다음 단계
웹과 모바일에 하나의 백엔드를 원한다면 모든 화면이나 모든 팀 요청을 먼저 매핑하지 마세요. 매일 중요하게 사용되는 하나의 워크플로(예: 작업 생성, 할당, 상태 업데이트, 종료)로 시작하세요. 작은 워크플로가 테스트하기 쉽고 데이터 모델의 모호한 점을 빨리 드러냅니다.
화면을 다듬기 전에 백엔드 규칙을 만드세요. 어떤 필드가 필수인지, 누가 상태를 변경할 수 있는지, 데이터가 없을 때 무슨 일이 발생하는지, 어떤 동작이 알림이나 후속 작업을 트리거하는지 결정하세요. 규칙이 백엔드에 있으면 관리자 웹 앱과 현장 모바일 앱은 표면상 다르게 보이더라도 같은 논리를 따릅니다.
실용적인 순서는 간단합니다: 주요 레코드와 관계를 정의하고, 핵심 비즈니스 규칙과 상태 변경을 작성하고, 샘플 데이터로 워크플로를 테스트하고, 사무용 웹 뷰와 현장용 모바일 뷰를 설계한 다음 실제 사용자와 첫 버전을 검토하세요.
이 순서는 보통 두 개의 잘 다듬어진 앱을 만들었지만 서로 불일치하는 실수를 피하게 도와줍니다.
빠르게 진행하고 싶다면 AppMaster 같은 노코드 플랫폼이 도움이 될 수 있습니다. 데이터와 비즈니스 로직을 한곳에서 정의하고 그 기반 위에 웹 앱과 네이티브 모바일 앱을 구축할 수 있습니다.
첫 릴리스를 작게 유지하세요. 관리자 한 명에게 웹 앱으로 실제 작업을 하게 하고, 현장 직원 한 명에게 모바일 앱을 실제 교대 중에 사용하게 하세요. 그들이 주저하는 지점, 건너뛰는 것, 다음에 무엇이 일어나리라 기대하는지를 관찰하세요. 그 지점을 먼저 고치고 더 많은 워크플로로 확장하세요.
대부분 안전한 경로는 이렇습니다: 하나의 공유 모델, 한 세트의 규칙, 그리고 실제 작업을 중심으로 만들어진 두 가지 경험입니다.


