구미 상권 지도앱 전체 튜토리얼 — 말로 지시해서 집에서 만들기

발표를 못 보셨어도 괜찮습니다. 이 글 하나로 구미 상권 지도 웹앱을 집에서 처음부터 끝까지 다시 만듭니다. 위에서 아래로만 따라오시면 되고, 앱을 짜는 글자는 AI 팀이 씁니다.

전체 10단계이고, 걸리는 시간은 대기 시간을 포함해 90분에서 135분 사이입니다. 발표(라이브 데모)에서 본 흐름을 그대로 옮겼으니, 발표 게시글 [[구미-상권-지도앱-90분-게시글-2026-10-28]]과 함께 보시면 이해가 빠릅니다.

Step 0. 무엇을 만들까 — 결과물 미리 보기와 준비물

만들 것은 구미 상가 20,797개(2026년 6월 기준, 소상공인시장진흥공단 상가(상권)정보)를 지도 위에 점으로 보여 주는 웹앱입니다. 옆 패널에서 동네와 업종을 고르면 지도가 그곳으로 움직이고, 화면 주소를 복사하면 같은 화면을 다른 사람도 열 수 있습니다.

준비물은 세 가지입니다. 브라우저가 열리는 PC, 같은 브라우저가 있는 스마트폰, 그리고 인터넷 연결입니다. Herdr 접근 방법은 공식 안내에서 확인하셔야 합니다(🔍조사 필요 RT4: 시작 절차 확인 중).

여기서 확인하실 항목은 세 가지입니다.

• PC 브라우저에서 사이트가 열립니다.
• 스마트폰 브라우저에서도 사이트가 열립니다.
• 작업하는 동안 1~2시간을 비워 두셨습니다.

세 항목이 채워지면 다음으로 넘어가세요.

Step 1. 공공데이터 준비 — 상가(상권)정보 확보

쓸 자료는 소상공인시장진흥공단의 상가(상권)정보입니다. 2026년 6월 기준 구미시 상가는 20,797개이고, 이 값은 자료가 갱신되면 달라질 수 있습니다.

동별 자료는 행정동 기준으로만 공개됩니다. 법정동 이름과 다를 수 있으니, 뒤에서 동네를 고르실 때도 행정동 이름을 확인하세요. 이 자료에는 위치 값(좌표)이 들어 있어 지도에 점으로 표시할 수 있습니다. 상가(상권)정보에 위치 값이 포함된다는 확인을 받았습니다(RT3 확정).

내려받는 경로와 파일 형식은 확인 중입니다(🔍조사 필요 RT1: 내려받기 경로·로그인 여부·파일 형식, RT2: 출처 표기 문구). 확인되기 전에는 경로를 추측해 적지 않았습니다. 공식 안내 화면을 열어 두시고, 받은 파일은 한 폴더에 모아 두세요.

• 자료 파일을 한 폴더에 모았습니다.
• 화면이나 파일 이름에서 기준 시점을 확인했습니다.
• 출처 표기 문구를 메모해 두었습니다.

Step 2. Herdr 준비와 팀 구성

Herdr는 AI 팀원을 한 화면에서 지시하고 지켜보는 도구입니다. 팀을 처음 여는 준비 단계만 아래를 복사해 붙여넣기 1회 하시면 되고, 그 다음부터는 전부 말로 지시합니다. 본문에서 명령을 입력하는 곳은 이 한 곳뿐입니다.

herdr-team <팀이름> --preset <프리셋이름>

팀 이름과 프리셋 이름은 공식 안내의 표기를 그대로 채우시면 됩니다(🔍조사 필요 RT4: herdr-team 명령 표기·프리셋 목록 확인 중). 이 글에서 유일한 명령 입력이며, 복사 후 붙여넣기만 하면 됩니다.

내 PC에 무엇을 준비해야 하는지는 아직 확인 중입니다(🔍조사 필요 RT5: 세팅 최소 단계 확인 중). 대신 AI 팀이 안내하는 준비 안내를 따라가시면 되고, 이 글에서는 그 절차를 추측해 적지 않습니다.

Reviewer가 반려하면 Worker로 돌아가 고치고 다시 검사를 받습니다. 통과하면 다음 단계로 넘어갑니다.

Step 3. 말로 지시하기

첫 지시는 이렇게 시작하시면 됩니다. 아래 네 문장은 실제로 던져 본 예시입니다.

지시가 어설퍼도 괜찮습니다. AI 팀이 모르는 부분을 다시 물어 옵니다. 고쳐 말할 때는 바라는 결과 한 문장, 대상 범위, 예시 하나, 이 세 가지만 챙기시면 됩니다.

Step 4. 기획 단계 — 설계 글 읽고 고치기

Planner가 내놓는 것은 설계 글입니다. 무슨 화면을 어떤 자료로 어떻게 만들지 적혀 있고, 여기서 방향을 잡으면 뒤 작업이 흔들리지 않습니다.

읽으실 때는 세 가지만 보시면 됩니다.

• 지도에 무엇을 보여 줄지 적혀 있습니다.
• 어떤 자료를 쓸지 적혀 있습니다.
• 폰 화면을 어떻게 할지 적혀 있습니다.

빠진 항목이 있으면 그 자리에서 한 문장으로 요청하세요. "설계 글에 ○○을 더해 주세요" 정도면 충분합니다.

Step 5. 구현 단계 — 앱이 만들어지는 시간

Worker가 설계 글대로 앱을 만듭니다. 이 시간은 대기 시간이 길어서, 화면을 계속 들여다보지 않으셔도 됩니다.

기다리는 동안 하실 일은 세 가지입니다.

• Step 6에서 볼 검사 항목을 미리 읽어 둡니다.
• Step 8의 응용 미션 중 해 보고 싶은 것을 하나 고릅니다.
• 자료 출처 표기 문구를 메모장에 옮겨 둡니다.

완성 보고가 오면 바로 다음 단계로 가지 마시고, 자동 점검이 끝날 때까지 기다리세요. 점검이 도는 중에 화면을 고치면 결과를 믿기 어려워집니다.

Step 6. 검증 단계 — 검사 통과와 반려 요령

Reviewer는 완성된 앱을 검사합니다. 화면이 실제로 뜨는지, 누르면 반응하는지, 고른 동네로 지도가 움직이는지를 봅니다. 이때 동네 이름은 행정동 기준이니, 법정동과 달라도 검사 오류가 아닙니다.

반려는 실패가 아니라 정상 흐름입니다. 반려를 받으면 고칠 목록이 함께 오는데, 그중 하나만 골라 한 문장으로 요청하시면 됩니다. 여러 개를 한 번에 요청하면 원인이 섞여 다시 헷갈립니다.

통과 판정이 나오면 앱이 검사를 견뎠다는 뜻입니다. 이때 화면을 한 장 찍어 두시면 나중에 비교하기 좋습니다.

Step 7. 실행 단계 — 브라우저와 스마트폰에서 열기

공개 주소는 아직 없습니다. 지금 만들어진 결과물은 내 PC에서 도는 개발용 서버와, 파일로 뽑아 둔 결과 두 가지 형태로만 존재합니다. 그래서 확인은 내 PC 브라우저에서 먼저 하시고, 스마트폰은 같은 네트워크에 연결한 뒤 주소를 직접 입력해 접속해 보시면 됩니다.

폰에서 열리지 않으면 세 가지를 확인하세요. 같은 네트워크인지, 주소를 정확히 입력했는지, 브라우저를 새로 고쳤는지입니다. 그래도 안 되면 발표장 화면으로 확인하는 방법을 쓰시면 됩니다(공개 주소 없음, 발표자 확인 2026-10-28).

Step 8. 응용 단계 — 내 앱으로 바꾸기

미션을 고르셨다면 Step 3으로 돌아가 지시하는 방식으로 진행합니다. 한 번에 여러 기능을 바라면 대화가 길어지므로, 작게 쪼개서 하나씩 요청하세요. 화면이 작아 라벨이 겹쳐 보이면 "점 대신 표로 보게 해 주세요"라고 요청하시면 됩니다.

Step 9. 마무리 체크리스트와 FAQ

• 지도에 상가 점이 보입니다.
• 동네를 고르면 지도가 움직입니다.
• 업종 필터가 동작합니다.
• 폰에서도 열어 보았습니다.
• 지시 문장을 한 개 이상 직접 써 보았습니다.

다섯 항목 중 세 개만 채워도 절반은 끝난 것입니다. 나머지는 다음에 이어서 하셔도 됩니다.

문제해결

자동 점검 장치는 이름 규칙을 일정하게 만들어 두면 헛일이 줄어듭니다. 이 부분은 결과를 볼 때 함께 기억해 두시면 좋습니다.

자주 묻는 질문

참고자료

• 발표 게시글: [[구미-상권-지도앱-90분-게시글-2026-10-28]]
• 실제 작업 기록: [[2026-10-28-경북-상권-대시보드-T9-T10]]
• 자료 출처: 소상공인시장진흥공단 상가(상권)정보, 2026년 6월 기준
• Herdr 공식 안내: 🔍조사 필요 RT4(링크 확인 중)

사이트 발행 필드

제목 후보는 세 가지였고, 그중 T1을 채택했습니다.

확인이 필요한 항목