앱이라고 하면 꼭 스마트폰 앱만 떠올라야 할까
"앱을 만들어보고 싶어요."
이 말을 들으면 많은 사람이 먼저 스마트폰 화면을 떠올립니다. 앱스토어에서 내려받는 앱, 홈 화면에 아이콘이 생기는 앱, 카카오톡이나 배달 앱처럼 매일 사용하는 앱 말입니다. 그래서 첫 앱을 만들자고 하면 마음속에서 부담이 확 커집니다.
"앱스토어에 올려야 하나?"
"아이폰용, 안드로이드용을 따로 만들어야 하나?"
"설치까지 되는 진짜 앱을 만들어야 앱이라고 할 수 있나?"
다행히 처음부터 그렇게 생각할 필요는 없습니다. 바이브 코딩으로 초보자가 처음 만들 결과물은 대부분 설치형 모바일 앱이 아니라 링크로 열리는 작은 웹앱에 가깝습니다. 이것은 부족한 출발이 아니라 아주 현실적인 출발입니다.
앱의 핵심은 어디에 설치되느냐가 아닙니다. 누군가의 문제를 해결하느냐입니다. 독서 기록을 남기고 싶어서 쓰는 도구, 강의 후기를 모으는 도구, 예약 문의를 정리하는 도구, 운동 루틴을 체크하는 도구라면 형태가 단순해도 앱입니다.
이 장에서는 우리가 앞으로 만들 결과물이 어떤 모양인지 차분히 정리해보겠습니다. 앱, 웹앱, 모바일 앱의 차이를 이해하면 도구 선택도 쉬워지고, AI에게 요청하는 말도 훨씬 분명해집니다.
앱은 문제를 해결하는 디지털 도구다
앱은 영어로 애플리케이션, 즉 어떤 목적을 위해 사용하는 프로그램을 뜻합니다. 하지만 초보자에게는 이렇게 이해하는 편이 더 쉽습니다.
앱은 사용자가 특정 문제를 해결하기 위해 쓰는 디지털 도구입니다.
여기서 중요한 단어는 '문제'입니다. 앱은 예쁜 화면만으로 완성되지 않습니다. 사용자가 어떤 불편을 겪고 있고, 그 불편을 어떻게 줄여주는지가 핵심입니다.
예를 들어보겠습니다. 독서 기록 앱은 "책을 읽고 나서 내용이 금방 잊힌다"는 문제를 해결합니다. 할 일 관리 앱은 "오늘 해야 할 일을 머릿속으로만 기억하다가 놓친다"는 문제를 줄여줍니다. 강의 후기 수집 앱은 "수강생 의견을 카카오톡, 문자, 구글폼, 메모장에 흩어져 받는다"는 불편을 한곳에 모아줍니다.
이렇게 보면 앱은 거창한 서비스가 아닙니다. 작은 불편을 덜어주는 도구입니다. 집 안에서 자주 쓰는 가위, 테이프, 메모지처럼 디지털 세계에도 작은 도구가 필요합니다. 바이브 코딩은 그런 작은 도구를 직접 만들어보는 방법입니다.
앱을 처음 생각할 때는 "세상에 없던 혁신적인 아이디어가 있을까?"보다 "내가 반복해서 귀찮아하는 일이 무엇일까?"라고 묻는 편이 좋습니다. 첫 앱은 사업 아이템이 아니라 실험 도구에 가깝습니다.
웹앱은 링크로 여는 앱이다
웹앱은 웹 애플리케이션의 줄임말입니다. 쉽게 말하면 설치하지 않고 인터넷 브라우저에서 링크로 접속해 사용하는 앱입니다.
브라우저란 크롬, 사파리, 엣지처럼 인터넷 주소를 입력하고 웹사이트를 보는 프로그램입니다. 웹앱은 바로 그 브라우저 안에서 작동합니다. 사용자는 앱스토어에서 내려받지 않아도 됩니다. 링크를 누르면 열립니다.
예를 들어 회사에서 사용하는 설문 페이지, 예약 신청 페이지, 간단한 고객 관리 화면, 온라인 계산기, 회의록 정리 도구는 대부분 웹앱 방식으로 만들 수 있습니다. 겉으로는 웹사이트처럼 보이지만, 안에서는 사용자가 입력하고 저장하고 검색하고 수정하는 기능이 작동합니다.
웹앱을 식당에 비유해보겠습니다. 모바일 앱은 내 동네에 정식 매장을 내는 것과 비슷합니다. 간판도 달고, 인테리어도 하고, 배달 앱 등록도 하고, 운영 기준도 맞춰야 합니다. 반면 웹앱은 팝업스토어에 가깝습니다. 주소를 알려주면 손님이 찾아올 수 있고, 메뉴를 바꾸거나 배치를 고치기도 상대적으로 쉽습니다.
그래서 초보자의 첫 앱은 웹앱이 좋습니다. 처음부터 정식 매장을 열기보다 작은 팝업스토어를 열어보고, 손님이 무엇을 불편해하는지 확인한 뒤 고치는 편이 훨씬 현실적입니다.
웹앱의 대표적인 특징은 다음과 같습니다.
설치 없이 링크로 접속할 수 있습니다.
수정한 내용을 다시 배포하면 사용자가 최신 버전을 볼 수 있습니다.
컴퓨터와 스마트폰에서 모두 열 수 있습니다.
앱스토어 심사 없이 주변 사람에게 공유해 테스트하기 쉽습니다.
이 네 가지 특징 때문에 Lovable, Replit Agent, Bolt.new 같은 앱 빌더형 도구로 처음 만들기에 웹앱이 잘 맞습니다. 유명한 개발자형 도구를 쓰지 않아도, 작은 웹앱을 만드는 경험만으로도 충분히 많은 것을 배울 수 있습니다.
모바일 앱은 설치하는 앱이다
모바일 앱은 스마트폰에 설치해서 사용하는 앱입니다. 아이폰에서는 앱스토어, 안드로이드폰에서는 구글 플레이스토어를 통해 내려받는 경우가 많습니다. 홈 화면에 아이콘이 생기고, 알림을 보내거나 카메라, 위치, 연락처 같은 스마트폰 기능과 연결되기도 합니다.
우리가 매일 쓰는 메신저, 은행 앱, 지도 앱, 배달 앱은 모바일 앱입니다. 사용성이 좋고 스마트폰 기능을 깊게 활용할 수 있다는 장점이 있습니다. 하지만 초보자가 첫 결과물로 바로 목표 삼기에는 고려할 것이 많습니다.
모바일 앱은 운영체제라는 환경을 신경 써야 합니다. 운영체제는 스마트폰을 움직이는 기본 시스템입니다. 아이폰에는 iOS가 있고, 갤럭시 같은 안드로이드폰에는 Android가 있습니다. 같은 기능이라도 두 환경에서 다르게 작동할 수 있습니다. 또한 앱스토어에 올리려면 계정, 심사, 정책, 개인정보 처리, 업데이트 과정도 이해해야 합니다.
물론 언젠가는 모바일 앱을 만들 수도 있습니다. 하지만 첫 앱을 만드는 단계에서는 "스마트폰에 설치되는 앱이어야 진짜 앱"이라는 생각을 잠시 내려놓는 것이 좋습니다. 처음에는 링크로 접속되는 웹앱으로도 충분합니다.
예를 들어 가족 일정 공유 앱을 만든다고 해봅시다. 첫 버전은 웹앱으로 만들어 가족 단톡방에 링크를 공유하면 됩니다. 가족이 링크를 눌러 일정 목록을 보고, 필요한 내용을 입력할 수 있으면 이미 쓸모가 있습니다. 나중에 정말 자주 쓰게 되고 알림 기능까지 필요해지면 그때 모바일 앱이나 더 고급 기능을 고민해도 늦지 않습니다.
웹사이트와 웹앱은 어떻게 다를까
웹사이트와 웹앱은 겉으로 비슷해 보입니다. 둘 다 링크로 열리고, 브라우저에서 봅니다. 하지만 목적이 조금 다릅니다.
웹사이트는 주로 정보를 보여주는 데 집중합니다. 회사 소개 페이지, 식당 홈페이지, 강사 프로필 페이지, 행사 안내 페이지가 그렇습니다. 사용자는 읽고, 확인하고, 문의 버튼을 누릅니다.
웹앱은 사용자의 행동에 따라 결과가 바뀝니다. 입력하고, 저장하고, 수정하고, 삭제하고, 검색하고, 필터링합니다. 예를 들어 독서 기록 앱에서는 사용자가 책 제목과 메모를 입력합니다. 할 일 관리 앱에서는 할 일을 추가하고 완료 표시를 합니다. 예약 문의 앱에서는 고객이 날짜와 연락처를 남기고, 운영자는 목록을 확인합니다.
비유하자면 웹사이트는 안내문에 가깝고, 웹앱은 도구함에 가깝습니다. 안내문은 읽으면 되고, 도구함은 직접 꺼내서 사용합니다.
처음 바이브 코딩을 할 때 AI에게 "웹사이트를 만들어줘"라고 말하면 정보 페이지 위주로 만들어질 수 있습니다. 반대로 "사용자가 입력한 내용을 저장하고 목록에서 확인할 수 있는 웹앱을 만들어줘"라고 말하면 앱에 가까운 결과가 나옵니다. 이 차이를 아는 것만으로도 첫 프롬프트의 품질이 달라집니다.
초보자의 첫 결과물로 웹앱이 좋은 이유
처음에는 완성도보다 작동 경험이 중요합니다. 내가 설명한 내용이 화면이 되고, 버튼이 생기고, 입력한 데이터가 목록에 나타나는 경험을 해봐야 합니다. 웹앱은 이 첫 경험을 만들기에 좋습니다.
첫째, 공유가 쉽습니다. 웹앱은 링크 하나로 다른 사람에게 보여줄 수 있습니다. 독서 기록 앱을 친구에게 보내거나, 강의 후기 수집 앱을 수강생에게 보내거나, 예약 문의 앱을 고객에게 보낼 수 있습니다. 파일을 설치하라고 설명할 필요가 없습니다.
둘째, 수정이 비교적 쉽습니다. 첫 버전은 대부분 마음에 들지 않습니다. 버튼 이름이 어색하고, 입력 항목이 많고, 모바일에서 카드가 좁게 보일 수 있습니다. 웹앱은 이런 부분을 고친 뒤 다시 배포하거나 미리보기 링크를 갱신하기가 상대적으로 수월합니다.
셋째, 배포가 단순합니다. 배포는 만든 앱을 다른 사람이 접속할 수 있게 공개하는 일입니다. 앞 장에서 말한 식당 비유를 이어가면, 배포는 가게 문을 열고 손님이 들어올 수 있게 하는 과정입니다. 앱스토어 앱은 가게를 정식으로 등록하고 심사를 받는 느낌이라면, 웹앱 배포는 작은 공간을 열고 링크를 나눠주는 느낌에 가깝습니다.
넷째, 실패 비용이 낮습니다. 첫 앱은 실패해도 괜찮아야 합니다. 아니, 실패를 통해 배우는 편이 더 자연스럽습니다. 웹앱은 작게 만들고, 지우고, 다시 만들고, 고치는 실험에 잘 맞습니다.
그래서 이 책에서 반복해서 말하는 기준은 분명합니다. 유명한 도구가 초보자에게 쉬운 도구는 아닙니다. 처음에는 Lovable, Replit Agent, Bolt.new 같은 앱 빌더형 도구로 작은 웹앱을 만들며 성공 경험을 쌓는 것이 좋습니다. Claude Code, Codex, Cursor 같은 개발자형 도구는 이미 만든 앱을 더 깊게 고치거나 개발자와 협업할 때 더 어울립니다.
반응형 디자인은 왜 필요할까
웹앱은 컴퓨터에서도 열리고 스마트폰에서도 열립니다. 그런데 컴퓨터 화면과 스마트폰 화면은 크기가 완전히 다릅니다. 컴퓨터에서는 넓게 보이던 표가 스마트폰에서는 옆으로 잘릴 수 있고, 예쁘게 배치된 카드가 모바일에서는 너무 좁아질 수 있습니다.
이때 필요한 개념이 반응형 디자인입니다. 반응형 디자인은 화면 크기에 따라 앱의 모양이 자연스럽게 바뀌도록 만드는 방식입니다. 큰 화면에서는 좌우로 넓게 보여주고, 작은 화면에서는 위아래로 쌓이게 만드는 식입니다.
반응형 디자인을 옷에 비유해보겠습니다. 같은 옷이라도 사람의 몸에 맞게 사이즈가 달라져야 편합니다. 컴퓨터 화면은 큰 사이즈, 태블릿은 중간 사이즈, 스마트폰은 작은 사이즈입니다. 반응형 디자인은 앱이 화면이라는 몸에 맞게 옷을 갈아입는 일입니다.
초보자가 만들 웹앱은 대개 스마트폰에서 많이 열립니다. 강의 후기 링크를 받은 수강생도 스마트폰으로 입력할 가능성이 높고, 예약 문의를 남기는 고객도 이동 중에 휴대폰으로 볼 가능성이 높습니다. 그러니 "컴퓨터에서 보이니까 됐다"로 끝내면 안 됩니다.
모바일 화면에서는 특히 다음을 점검해야 합니다.
버튼이 손가락으로 누르기에 충분히 큰가?
입력창이 너무 작거나 서로 붙어 있지 않은가?
글자가 작아서 읽기 어렵지 않은가?
목록 카드가 화면 밖으로 삐져나가지 않는가?
중요한 버튼이 아래쪽에 숨거나 잘리지 않는가?
한 화면에 너무 많은 정보를 넣지 않았는가?
저장, 삭제, 완료 같은 핵심 행동이 분명히 보이는가?
여기서 핵심은 예쁜 디자인보다 사용 가능성입니다. 특히 모바일에서는 손가락으로 누릅니다. 마우스로 클릭할 때는 괜찮던 작은 버튼도 스마트폰에서는 불편할 수 있습니다. 앱을 만든 뒤에는 반드시 스마트폰으로 직접 열어보고, 손가락으로 눌러보아야 합니다.
예시로 보는 앱, 웹앱, 모바일 앱의 차이
같은 아이디어라도 어떤 형태로 만들지에 따라 난이도가 달라집니다. 예시 세 가지로 비교해보겠습니다.
첫 번째는 독서 기록 도구입니다. 웹사이트로 만들면 "내가 읽은 책 목록을 소개하는 페이지"가 됩니다. 방문자는 책 제목과 감상문을 읽을 수 있습니다. 웹앱으로 만들면 사용자가 책 제목, 저자, 별점, 메모를 직접 입력하고 목록으로 볼 수 있습니다. 모바일 앱으로 만들면 스마트폰에 설치하고, 독서 시간 알림이나 카메라로 책 표지 찍기 같은 기능까지 붙일 수 있습니다.
두 번째는 예약 문의 도구입니다. 웹사이트라면 매장 소개, 운영 시간, 전화번호가 중심입니다. 웹앱이라면 고객이 날짜, 시간, 인원, 요청사항을 입력하고 사장님이 문의 목록을 확인할 수 있습니다. 모바일 앱이라면 고객용 앱과 관리자용 앱을 따로 만들고, 푸시 알림이나 결제 기능까지 고려할 수 있습니다.
세 번째는 운동 루틴 기록 도구입니다. 웹사이트라면 운동 방법을 설명하는 콘텐츠가 중심입니다. 웹앱이라면 오늘 한 운동, 세트 수, 반복 횟수, 체감 난이도를 입력하고 기록을 볼 수 있습니다. 모바일 앱이라면 운동 알림, 웨어러블 기기 연동, 오프라인 저장 같은 기능까지 생각할 수 있습니다.
이 비교에서 알 수 있는 것은 단순합니다. 초보자의 첫 단계에서는 웹앱이 가장 균형이 좋습니다. 웹사이트보다 더 쓸모 있는 기능을 만들 수 있고, 모바일 앱보다 훨씬 가볍게 시작할 수 있습니다.
AI에게 "웹앱"이라고 말해야 하는 이유
바이브 코딩에서는 내가 쓰는 말이 결과물의 방향을 정합니다. AI에게 "앱 만들어줘"라고만 말하면 너무 넓습니다. AI는 정보 페이지를 만들 수도 있고, 모바일 앱처럼 복잡한 구조를 제안할 수도 있고, 로그인과 데이터베이스까지 한 번에 넣으려 할 수도 있습니다.
초보자라면 처음 요청에서 결과물의 형태를 분명히 말하는 것이 좋습니다.
예를 들어 이렇게 말할 수 있습니다.
나는 코딩을 모르는 초보자입니다.
설치형 모바일 앱이 아니라, 링크로 접속해서 사용할 수 있는 간단한 웹앱을 만들고 싶습니다.
첫 버전은 MVP로 작게 만들어주세요.
사용자가 입력한 내용을 저장하고 목록에서 확인할 수 있으면 됩니다.
로그인, 결제, 알림, 복잡한 관리자 기능은 처음 버전에서 제외해주세요.
모바일에서도 보기 편한 반응형 디자인으로 만들어주세요.이 프롬프트에는 중요한 기준이 들어 있습니다. 설치형 모바일 앱이 아니라 웹앱이라는 점, 첫 버전은 MVP라는 점, 제외할 기능이 있다는 점, 모바일 반응형이 필요하다는 점입니다. 이런 조건을 써주면 AI가 과하게 복잡한 방향으로 가는 것을 줄일 수 있습니다.
바로 써먹는 프롬프트: 웹앱으로 시작하기
아래 프롬프트는 첫 웹앱을 만들 때 복사해서 바꿔 쓸 수 있는 기본 템플릿입니다. 대괄호 안의 내용을 내 상황에 맞게 바꾸면 됩니다.
나는 코딩을 모르는 [직장인/강사/소상공인/부모/크리에이터]입니다.
[해결하고 싶은 문제]를 줄이기 위한 간단한 웹앱을 만들고 싶습니다.
이 앱의 사용자는 [사용자]입니다.
앱의 목적은 [목적]입니다.
필요한 기능은 다음과 같습니다.
1. [입력 기능: 예: 책 제목과 메모 입력]
2. [목록 기능: 예: 입력한 기록을 카드 형태로 보기]
3. [수정 또는 삭제 기능: 예: 잘못 입력한 기록 수정/삭제]
화면은 다음처럼 구성해주세요.
1. 상단: 앱 이름과 짧은 설명
2. 입력 영역: 사용자가 정보를 입력하는 폼
3. 목록 영역: 저장된 내용을 확인하는 카드 목록
디자인은 [깔끔한 업무용/다이어리 느낌/모바일 우선/따뜻한 가족 앱 느낌]으로 해주세요.
처음 버전에서는 로그인, 결제, 알림, 복잡한 관리자 페이지는 제외해주세요.
설치형 모바일 앱이 아니라 브라우저 링크로 접속하는 웹앱으로 만들어주세요.
모바일에서도 버튼과 입력창이 잘 보이는 반응형 디자인으로 만들어주세요.
MVP로 작게 시작할 수 있게 만들어주세요.처음부터 완벽한 앱을 요구하지 않아도 됩니다. 오히려 처음에는 작게 요청해야 합니다. 기능이 적을수록 AI가 이해하기 쉽고, 내가 결과물을 확인하기도 쉽습니다.
모바일 점검 요청 프롬프트
앱을 만든 뒤에는 AI에게 모바일 사용성을 점검해달라고 요청할 수 있습니다. 이때도 "예쁘게 해줘"보다 구체적으로 말하는 편이 좋습니다.
현재 웹앱을 스마트폰에서 사용할 때 불편한 부분이 없는지 점검해주세요.
특히 다음 기준으로 확인하고 개선해주세요.
1. 버튼이 손가락으로 누르기에 충분히 큰지
2. 입력창 사이 간격이 좁지 않은지
3. 글자 크기가 모바일에서 읽기 쉬운지
4. 목록 카드가 화면 밖으로 넘치지 않는지
5. 저장, 수정, 삭제 버튼이 명확하게 보이는지
6. 한 화면에 정보가 너무 많지 않은지
전체 디자인은 유지하되, 모바일 우선 반응형 디자인으로 개선해주세요.이 프롬프트는 거의 모든 초보자용 웹앱에 사용할 수 있습니다. 독서 기록 앱, 강의 후기 수집 앱, 예약 문의 앱, 운동 루틴 기록 앱 모두 모바일 점검이 필요합니다.
흔한 실수: 처음부터 모바일 앱을 만들려고 한다
첫 번째 흔한 실수는 처음부터 앱스토어에 올릴 모바일 앱을 상상하는 것입니다. 물론 상상 자체가 나쁜 것은 아닙니다. 문제는 첫 목표가 너무 무거워진다는 데 있습니다.
초보자가 처음부터 모바일 앱, 로그인, 결제, 알림, 지도, 채팅, 관리자 페이지를 모두 넣으려고 하면 AI도 방향을 잡기 어렵고, 만든 사람도 무엇을 확인해야 할지 모르게 됩니다. 결과물은 그럴듯해 보여도 실제로는 제대로 작동하지 않을 수 있습니다.
고치는 방법은 간단합니다. 먼저 웹앱으로 줄입니다. 그리고 가장 중요한 기능 하나를 남깁니다. 예약 문의 앱이라면 "고객이 문의를 남기고 운영자가 목록을 확인한다" 정도면 첫 버전으로 충분합니다. 결제, 자동 문자, 달력 연동은 나중 단계입니다.
두 번째 실수는 웹사이트와 웹앱을 혼동하는 것입니다. "운동 루틴 앱을 만들어줘"라고 했는데 운동 방법 소개 페이지가 나왔다면, AI가 웹사이트로 이해했을 가능성이 있습니다. 이때는 "사용자가 직접 운동 기록을 입력하고 저장할 수 있는 웹앱으로 바꿔줘"라고 수정 요청을 하면 됩니다.
세 번째 실수는 컴퓨터 화면만 보고 끝내는 것입니다. 초보자가 만든 웹앱은 주변 사람에게 링크로 공유되는 경우가 많고, 그 사람들은 대부분 스마트폰으로 엽니다. 컴퓨터에서는 멀쩡해도 모바일에서 입력창이 잘리거나 버튼이 너무 작으면 실제로 쓰기 어렵습니다.
고치는 프롬프트: 웹사이트처럼 나왔을 때
AI가 정보 페이지 위주로 만들어버렸다면 아래처럼 수정 요청을 해보세요.
현재 결과물이 정보를 보여주는 웹사이트에 가깝습니다.
제가 원하는 것은 사용자가 직접 입력하고 저장하고 다시 확인할 수 있는 웹앱입니다.
다음 기능을 중심으로 다시 구성해주세요.
1. 사용자가 [입력할 정보]를 입력하는 폼
2. 입력한 내용을 저장하는 기능
3. 저장된 내용을 카드 목록으로 보여주는 기능
4. 각 항목을 수정하거나 삭제하는 기능
소개 문구는 줄이고, 실제로 사용할 수 있는 입력과 목록 기능을 중심으로 만들어주세요.
첫 버전은 MVP로 단순하게 유지해주세요.이런 수정 요청은 바이브 코딩에서 매우 중요합니다. AI가 한 번에 내 의도를 완벽하게 맞히지 못하는 것은 자연스러운 일입니다. 바이브 코딩은 AI에게 한 번 명령하고 끝내는 일이 아니라, 결과를 보고 다시 설명하며 고쳐나가는 과정입니다.
실습 미션: 내 첫 웹앱의 형태 정하기
이번 장의 실습은 코드를 쓰는 일이 아닙니다. 내가 만들고 싶은 결과물이 웹사이트인지, 웹앱인지, 모바일 앱인지 구분해보는 연습입니다.
먼저 종이나 메모 앱을 열고 다음 질문에 답해보세요.
이 도구는 정보를 보여주기만 하면 되는가, 사용자가 무언가를 입력해야 하는가?
입력한 내용이 나중에 다시 보여야 하는가?
다른 사람에게 링크로 공유하면 충분한가?
스마트폰 설치가 꼭 필요한 이유가 있는가?
첫 버전에서 알림, 결제, 로그인 없이도 쓸모가 있는가?
사용자는 주로 컴퓨터에서 쓸까, 스마트폰에서 쓸까?
답을 적다 보면 대부분의 첫 아이디어는 웹앱으로 충분하다는 사실을 알게 됩니다. 예를 들어 "수강생 후기 모으기"는 설치형 앱이 필요 없습니다. 링크를 보내고, 수강생이 입력하고, 강사가 목록을 확인하면 됩니다. "가족 여행 준비물 체크리스트"도 마찬가지입니다. 가족 단톡방에 링크를 공유하면 첫 버전은 충분히 작동합니다.
마지막으로 아래 문장을 완성해보세요.
내가 처음 만들 앱은 [문제]를 해결하기 위한 웹앱이다.
사용자는 [사용자]이고, 링크로 접속해서 [핵심 행동]을 할 수 있으면 된다.
첫 버전에서는 [제외할 기능]은 넣지 않는다.
모바일에서도 보기 편하게 만든다.이 문장은 앞으로 첫 프롬프트의 뼈대가 됩니다. 앱을 만들기 전 이 정도만 정리해도 AI에게 훨씬 정확하게 요청할 수 있습니다.
한 장 요약
앱은 꼭 스마트폰에 설치되는 것만 뜻하지 않습니다. 앱은 사용자가 특정 문제를 해결하기 위해 쓰는 디지털 도구입니다. 독서 기록, 할 일 관리, 강의 후기 수집, 예약 문의 정리처럼 작고 구체적인 문제를 해결한다면 그것도 충분히 앱입니다.
웹앱은 설치 없이 브라우저 링크로 접속해 사용하는 앱입니다. 초보자의 첫 결과물로 웹앱이 좋은 이유는 분명합니다. 공유하기 쉽고, 수정하기 쉽고, 배포가 비교적 단순하며, 실패 비용이 낮습니다. 처음부터 앱스토어용 모바일 앱을 목표로 하기보다 링크로 열리는 작은 웹앱을 만드는 편이 훨씬 현실적입니다.
모바일 앱은 스마트폰에 설치해 사용하는 앱입니다. 강력하지만 초보자의 첫 단계로는 고려할 것이 많습니다. 알림, 결제, 로그인, 심사, 운영체제 차이 같은 요소가 들어오면 난이도가 빠르게 올라갑니다. 따라서 첫 앱은 웹앱으로 만들고, 정말 필요해질 때 모바일 앱을 고민해도 충분합니다.
웹앱을 만들 때는 반응형 디자인도 꼭 점검해야 합니다. 사용자가 스마트폰으로 접속할 가능성이 높기 때문입니다. 버튼 크기, 글자 크기, 입력창 간격, 목록 카드의 폭, 핵심 버튼의 위치를 직접 확인해야 합니다.
이번 장에서 기억할 문장은 하나입니다.
처음에는 앱스토어 앱보다 링크로 열리는 작은 웹앱이 훨씬 현실적인 출발점입니다.
다음 장에서는 이제 도구 지도를 펼쳐보겠습니다. Lovable, Replit Agent, Bolt.new 같은 초보용 앱 빌더형 도구와 v0, Google AI Studio Build mode 같은 중간 단계 도구, Claude Code, Codex, Cursor 같은 개발자형 도구가 어떻게 다른지 구분해볼 것입니다. 유명한 도구가 반드시 쉬운 도구는 아닙니다. 나에게 맞는 첫 도구를 고르는 일이 바이브 코딩의 첫 성공 경험을 좌우합니다.
이 노트는 보도·비평·교육·연구 목적으로 작성되었습니다. 저작권 문의가 있으시면 에서 알려주세요.