반응형

전체 글 117

BD(Business Developer)의 PB(Product Builder) 되기 #9 — 앱에 화면 여러 개 만들기 (탭·화면 이동·버튼)

지난 글 끝에서 "다음엔 데이터 창고에 첫 표를 만든다"고 했다. 그런데 그 사이에 꼭 넣고 싶은 기능이 하나 생각났다. 매장에서 일하면서 늘 아쉬웠던 공지다.그래서 순서를 바꿨다. 이번 글은 그 기능을 핑계로, 직원 앱에 화면을 여러 개 만들고 오가게 하는 법을 배운 이야기다.(기능을 어떻게 만들었는지는 출시 전까지 조금 아껴 두려고 한다. 대신 배운 건 다 적는다.)오늘의 목표하고 싶은 기능이 생겼을 때, 바로 만들지 않고 설계서에 먼저 적기직원 앱에 탭(아래쪽 버튼)과 화면 이동 만들기버튼을 누르면 다른 화면까지 같이 바뀌는 구조 이해하기가상 아이폰에서 눌러 보며 확인하기1. 기능이 떠오르면, 먼저 설계서에예전 같았으면 "공지 기능 만들어 줘" 한 줄을 던졌을 것이다. 이번엔 Claude에게 기능을..

BD(Business Developer)의 PB(Product Builder) 되기 #8 — 직원 앱 첫 화면 띄우기 (Expo·Supabase)

지난 글에서는 사장님이 PC로 보는 웹 화면을 만들었다. 이번엔 직원들이 쓸 휴대폰 앱 차례다.목표는 단순했다. "내 폰에 내 앱 첫 화면 띄우기." 그런데 이 한 화면을 띄우기까지 "버전이 안 맞아요"를 두 번, "로그인하세요"를 한 번, "도쿄에 만들어졌네?"를 한 번 만났다.오늘의 목표맥 안에 가상 아이폰을 띄우기직원 앱의 뼈대를 만들고 첫 화면 보기진짜 폰 두 대(아이폰, 갤럭시)에서 내 앱 열어 보기데이터를 담을 창고, Supabase 프로젝트 만들기1. 맥 안에 가상 아이폰 띄우기지난 글에서 Xcode를 깔아 뒀다. Xcode 안에는 iOS 시뮬레이터가 들어 있다. 맥 화면 안에서 돌아가는 가상 아이폰이다. 진짜 아이폰이 없어도 아이폰 앱이 어떻게 보이는지 확인할 수 있다.가상 아이폰을 쓰려면..

BD(Business Developer)의 PB(Product Builder) 되기 #7 — 첫 화면 만들기 (사장님 웹 목업)

기획서도, 설계서도 다 썼다. 이제 진짜 "만들기"다.그런데 첫 화면을 띄우기도 전에 "도구만 30GB"라는 말을 듣고 멈칫했다. 결국 무거운 도구는 미루고, 브라우저에서 바로 눌러 볼 수 있는 사장님용 웹 화면부터 만들었다.오늘의 목표사장님이 쓰는 웹 화면의 목업을 만들어서 직접 눌러 보기휴대폰 앱은 무엇으로 확인할지 정하기만들어 보면서 바뀐 생각을 설계서에 다시 적기💡 목업(mockup)은 진짜 데이터 없이, 가짜 데이터로 화면 모양과 흐름만 먼저 만든 것이다. 집을 짓기 전에 모델하우스를 먼저 지어 보는 것과 비슷하다. 눌러 보고 어색한 곳을 고치는 비용이 제일 싼 단계다.1. "도구만 30GB?" — 무엇부터 만들까설계서에 적어 둔 순서는 도구 준비 → 웹 목업이었다. 휴대폰 앱을 맥에서 확인하..

앱 개발 일지 2026.10.21

BD(Business Developer)의 PB(Product Builder) 되기 #6 — HR 앱이 매장 운영 앱이 되다 (설계 더하기)

지난 글에서 설계서를 다 썼다. 그런데 매장에서 실제로 쓰는 구글 시트와 문서를 다시 열어 보니, 빠진 일이 너무 많았다.서류 받기, 오픈·마감 체크리스트, 레시피, 발주. 이걸 다 더하고 나니 이 앱은 더 이상 "HR 관리"만 하는 앱이 아니게 됐다.오늘의 목표매장에서 실제로 하는 일을 앱 기능으로 옮기기지금 쓰는 구글 시트·문서 구조를 그대로 살펴보고 설계에 반영하기늘어난 기능을 언제, 어떤 순서로 만들지 다시 정하기1. 설계서를 다 쓰고 나서 생각난 것들설계를 마치고 매장 일을 하나씩 떠올려 보니, 근무표·교대·휴가 말고도 매일 손이 가는 일이 많았다. 생각나는 대로 Claude에게 말했다.직원·알바를 처음 초대하면 필수 서류(통장사본, 신분증)를 요청하기바로 못 내면 나중에 첨부하고, 고칠 수도 ..

앱 개발 일지 2026.10.20

BD(Business Developer)의 PB(Product Builder) 되기 #5 — 어떻게 만들지 정하기 (설계)

지난 글에서 무엇을 만들지 정했다. 이번엔 어떻게 만들지 정할 차례다.이번에도 코드는 한 줄도 없다. Claude가 묻고 내가 고르는 대화만으로 설계서 한 장을 만들었다.오늘의 목표기획서에 "나중에 정하자"고 남겨 둔 숙제 풀기어떤 도구(기술)로 만들지 정하기앱이 저장할 정보 목록 만들기정한 내용을 설계서 한 장으로 정리하기💡 설계는 집으로 치면 도면 그리기다. 기획에서 "방 3개, 거실 넓게"를 정했다면, 설계에서는 벽을 어디에 세우고 어떤 자재를 쓸지 정한다. 도면 없이 벽부터 세우면 나중에 허물어야 한다.1. 기획서 숙제 6개를 하나씩기획서 맨 끝에 "설계에서 정할 것" 6개를 남겨 뒀었다. Claude가 이걸 한 번에 하나씩, 선택지 2~3개와 함께 물어봤다. 선택지마다 장단점이 한 줄씩 붙어 ..

앱 개발 일지 2026.10.20

BD(Business Developer)의 PB(Product Builder) 되기 #4 — 무엇을 만들지 정하기 (기획)

0단계 준비가 끝났다. 이번 글부터 진짜 앱 이야기다.코드는 한 줄도 안 쓰고, Claude와 대화만으로 어떤 앱을 만들지 정했다. 결과물은 기획서 한 장이다.오늘의 목표누가 쓰는지, 어떤 불편을 푸는지 정하기꼭 있어야 하는 기능 고르기첫 버전(MVP)에 넣을 것과 뺄 것, 만드는 순서 정하기웹으로 갈지 앱으로 갈지 정하기정한 내용을 기획서 한 장으로 정리하기1. Claude가 한 번에 하나씩 물어본다기획이라고 해서 거창한 문서를 혼자 써야 하는 줄 알았는데, 실제로는 Claude가 질문을 하나씩 던지고 내가 고르는 식으로 진행됐다. 질문마다 선택지가 2~3개 나오고, 마음에 드는 게 없으면 직접 적으면 된다.내가 받은 질문은 이 순서였다.예전에 설계만 해 둔 근무관리 앱 아이디어를 이어갈까, 새로 정할..

앱 개발 일지 2026.10.19

BD(Business Developer)의 PB(Product Builder) 되기 #3 — Claude에게 작업 규칙 알려 주기 (CLAUDE.md, 권한 모드)

지난 글까지 계정, 앱, 개발 도구, GitHub 연결을 끝냈다. 이번엔 Claude에게 일하는 방식을 알려 준다.매번 "한국어로, 천천히, 쉽게"를 말하지 않도록 규칙서를 만들고, Claude가 얼마나 물어보고 움직일지 정한다. 0단계 준비의 마지막 회차다.오늘의 목표Claude가 매번 읽는 규칙서 CLAUDE.md를 이해하고 내 규칙 채워 넣기Claude가 허락받는 범위를 정하는 권한 모드를 「편집 자동 수락」으로 바꾸기1. CLAUDE.md — Claude의 작업 규칙서CLAUDE.md가 뭐길래CLAUDE.md는 Claude Code가 이 폴더에서 일을 시작할 때마다 자동으로 읽는 메모다. 새 직원에게 건네는 "우리 팀 일하는 방식" 한 장짜리 문서라고 생각하면 된다.여기에 "대화는 한국어로", "..

앱 개발 일지 2026.10.18

BD(Business Developer)의 PB(Product Builder) 되기 #2 — Homebrew, Node.js, GitHub 연결

지난 글에서 계정과 Claude 앱, 작업 폴더를 준비했다. 이번엔 맥에 개발 도구를 깔고, 맥과 GitHub를 연결한다.처음으로 터미널(검은 창)에 명령어를 직접 쳐 보는 회차다. 겁먹을 필요 없다. 복사해서 붙여 넣기만 하면 된다.오늘의 목표맥용 설치 도우미 Homebrew 깔기앱 개발의 기본 도구 Node.js 깔기터미널에서 GitHub를 다루는 gh에 로그인하고, 공개 저장소용으로 git 설정 점검하기시작 전에: Homebrew와 Node.js가 뭐길래?이름부터 낯설다. 나도 처음엔 이게 뭔지 몰랐다. 설치하기 전에 정체부터 알고 가자.🍺 Homebrew(홈브루): 맥용 "설치 도우미"프로그램을 대신 찾아서 깔아 주는 심부름꾼이다.보통 앱을 깔려면 웹사이트를 찾아가서 → 다운로드하고 → 설치 파..

앱 개발 일지 2026.10.18

BD(Business Developer)의 PB(Product Builder) 되기 #1 — 계정, 앱, 작업 폴더 준비

지난 글에서 앱 개발의 전체 지도를 그렸다. 이제 진짜 0단계, 준비다.아무것도 안 되어 있는 사람 기준으로 계정 두 개를 만들고, Claude 앱을 깔고, Claude가 일할 폴더를 만든다.오늘의 목표Claude 유료 플랜과 GitHub 계정 준비하기Claude 데스크톱 앱을 설치하고 Code 탭 열기Claude가 일할 작업 폴더 만들기1. 계정 두 개 준비하기계정무엇에 쓰나비용Claude (유료 플랜)같이 코드를 짜는 AI. 코드를 직접 만들어 주는 Claude Code는 유료 플랜부터 들어 있다Pro 월 $22 (부가세 포함, 연간 결제 시 월 $18)GitHub코드를 인터넷에 백업하는 금고무료Claude 유료 플랜claude.ai에 접속해서 구글 계정(또는 이메일)으로 가입왼쪽 아래 내 이름 → ..

앱 개발 일지 2026.10.18

BD(Business Developer)의 PB(Product Builder) 되기 #0 — 코드보다 지도 먼저

나는 BD(Business Developer, 사업개발가)다. 새로운 사업 기회를 찾고 사람과 회사를 연결해서 일이 되게 만드는 사람이다.AI 시대가 되면서, 진짜 사업개발가라면 이제 프로덕트를 직접 만들어 보는 역량까지 필요하다고 생각했다.예전 같으면 개발자 없이는 엄두도 못 냈을 일을, 이제는 AI 덕분에 나 혼자서도 꽤 많이 할 수 있다.그래서 이번엔 아예 처음부터 끝까지, 기획부터 출시까지 직접 해 보기로 했다.이 연재는 BD가 PB(Product Builder, 제품을 직접 만드는 사람)가 되어 가는 기록이다.개발 경험이 전혀 없는 상태에서 AI(Claude Code)와 함께 앱을 하나 만들어 보기로 했다.첫 글은 코드가 아니라 지도다. 앱 서비스가 뭘로 이루어져 있고, 어떤 순서로 만들어지는지..

앱 개발 일지 2026.10.18
반응형