"뉴스 요약해서 경쟁사 관련된 것만 정리해서 매일 오전 9시에 알람 보내줘." AI가 뭔가 만들어줬어요. py 파일이 생겼고, 실행하니까 잘 돌아가요. 근데 컴퓨터 끄니까 작동이 멈추는데요?
맞아요. 이거 진짜 많이들 겪는 상황이에요.
분명 AI가 만들어줬고, 실행하면 잘 돼요. 근데 컴퓨터 안 켜놓으면 안 돌아가요. "매일 9시에 자동으로"가 아니라 "내가 실행해야만" 돌아가는 거예요.
왜 이렇게 되는 걸까요?
AI가 만들어준 건 "로컬에서 돌아가는 스크립트"예요. 근데 우리가 원한 건 "서버에서 자동으로 돌아가는 서비스"였어요.
프로그램 종류가 다르면, 만들어지는 것 자체가 달라요. 이걸 모르면 "되긴 되는데 내가 원한 게 아닌" 상황이 계속 반복돼요.
오늘부터 PART 3: 기술 개념 - 큰 그림이 시작돼요.
첫 번째로 "프로그램의 종류"를 배워볼게요.
프로그램의 종류는 왜 알아야 하나요?
같은 기능이라도 어디서 돌아가게 만드느냐에 따라 완전히 다르게 만들어져요.
📱 스마트폰 앱으로 만들면
- 앱스토어에서 다운받아서 설치
- 스마트폰에서만 돌아감
- 오프라인에서도 작동 가능
🌐 웹으로 만들면
- 브라우저에서 바로 접속 (설치 필요 없음)
- 스마트폰, 컴퓨터 어디서든 접속
- 인터넷 연결 필요
🤖 자동화/봇로 만들면
- 사람이 직접 안 열어도 됨
- 매일 자동으로 할 일 정리
- 화면 없이 작동 핵심은 "어디서 돌아가느냐"예요.
AI한테 프로그램 만들어달라고 할 때:
- "웹으로 만들어줘" vs "모바일 앱으로 만들어줘"
- "브라우저에서 돌아가게" vs "자동으로 실행되게"
이 한 마디 차이가 완전히 다른 결과를 만들어요.
큰 그림: 프로그램의 종류
프로그램은 크게 두 가지로 나눌 수 있어요.
| 👤 사람이 직접 쓰는 것 | 🤖 알아서 돌아가는 것 |
| 화면이 있음 | 화면 없음 (또는 최소한) |
| 사용자가 클릭하고 입력함 | 한번 세팅하면 자동으로 실행 |
| 🌐 웹 서비스 | 🤖 자동화/봇 |
| 브라우저에서 접속 | 정해진 시간에 자동 실행 |
| 예) 노션, 유튜브 | 예) 뉴스 요약 봇, 슬랙 봇 |
| 📱 모바일 앱 | |
| 스마트폰에 설치 | |
| 예) 카카오톡, 배민 | |
| 💻 데스크톱 앱 | |
| 컴퓨터에 설치 | |
| 예) Photoshop, VS Code |
어디서 돌아가는지가 중요해요: 웹(브라우저) vs 앱(폰) vs 봇(서버)
바이브 코더가 주로 만드는 건:
- 웹 서비스 - 가장 많이 만듦. 배포도 쉬움
- 자동화/봇 - 반복 작업 대신 처리. 훅에서 본 "뉴스 요약 봇" 같은 것
- 모바일 앱 - 스마트폰 전용 기능 필요할 때
- 데스크톱 앱 - 요즘은 웹으로 대체되는 추세라 우선순위 낮음
하나씩 자세히 볼게요.
1. 웹 서비스
브라우저에서 돌아가는 프로그램.
✅ 장점 - 설치 필요 없음 (URL만 알면 바로 접속) - 모든 기기에서 접속 가능 (컴퓨터, 스마트폰, 태블릿) - 업데이트 쉬움 (내가 고치면 모든 사용자한테 바로 반영) - 배포 쉬움 (서버에 올리기만 하면 끝) ❌ 단점 - 인터넷 연결 필요 - 스마트폰 고유 기능 (카메라, GPS 등) 쓰기 어려움
웹 서비스의 예시
익숙한 서비스들로 볼게요.
📝 노션 (notion.so)
- 브라우저에서 접속
- 문서 작성, 관리
- 컴퓨터, 스마트폰 어디서든 같은 화면
📺 유튜브 (youtube.com)
- 브라우저에서 접속
- 영상 보고, 검색하고, 댓글 남기기
📄 구글독스 (docs.google.com)
- 브라우저에서 접속
- 문서 작성, 공유
🎯 공통점
→ 전부 브라우저에서 돌아감
→ 설치 안 해도 됨
→ 어디서든 URL만 알면 접속 AI한테 요청할 때
🎯 왜 정확히 말해야 할까요?
"앱 만들어줘"라고만 하면 AI는 추측해요. 근데 AI가 모바일 앱으로 만들었는데, 여러분은 웹을 원했다면? 처음부터 다시 만들어야 해요.
프로그램 종류가 다르면 구조가 완전히 달라요. 웹 코드를 모바일 앱 코드로 바꾸는 건 "새로 만들기"예요.
그래서 처음부터 정확히 말해야 해요.
❌ "앱 만들어줘" → AI가 추측해서 만듦. 나중에 바꾸려면 전부 다시.
✅ "브라우저에서 돌아가는 웹앱으로 만들어줘" → AI가 정확히 이해. 처음부터 제대로 만들어짐.
✅ "웹 서비스로 만들 건데, React 써줘" → 기술 스택까지 지정하면 더 명확함.
막연한 "앱 만들어줘" vs 구체적인 "웹앱 만들어줘"
2. 모바일 앱
스마트폰에 설치해서 쓰는 프로그램.
✅ 장점 - 스마트폰 고유 기능 활용 (카메라, GPS, 푸시 알림 등) - 오프라인에서도 작동 가능 - 빠르고 부드러운 동작 - 앱스토어에 등록 가능 ❌ 단점 - 앱스토어 심사 필요 - 설치 과정 필요 - iOS/Android 따로 만들어야 할 수도 있음 - 업데이트 배포 복잡 (사용자가 업데이트 해야 함)
모바일 앱의 예시
💬 카카오톡
- 앱스토어에서 다운
- 푸시 알림 (새 메시지 오면 알림)
- 오프라인에서도 이전 대화 볼 수 있음
📸 인스타그램
- 카메라 바로 접근
- 사진 찍고 바로 업로드
- 빠르게 스크롤
🚗 배민
- GPS로 내 위치 자동 인식
- 푸시 알림 (주문 상태 알림)
🎯 공통점
→ 전부 스마트폰에 설치
→ 스마트폰 고유 기능 활용
→ 앱스토어에서 다운 웹 vs 모바일 앱, 뭘 선택해야 할까요?
✅ 빨리 만들어서 테스트하고 싶을 때 ✅ 컴퓨터에서도 써야 할 때 ✅ 설치 없이 바로 쓰게 하고 싶을 때 ✅ 업데이트를 자주 해야 할 때 예) 사내 도구, 간단한 서비스, MVP 테스트 이럴 때 모바일 앱으로 만드세요 ✅ 카메라, GPS 같은 스마트폰 기능이 필요할 때 ✅ 푸시 알림이 중요할 때 ✅ 오프라인에서도 써야 할 때 ✅ 부드러운 동작이 중요할 때 (게임, 영상 편집 등) 예) 메신저, SNS, 배달 앱, 실시간 위치 추적
바이브 코더 초보라면 웹부터 시작하세요. 웹이 만들기도 쉽고, 배포도 쉽고, 고치기도 쉬워요.
AI한테 요청할 때
🎯 iOS와 Android, 한 번에 만들 수 있나요?
네, "크로스 플랫폼" 기술을 쓰면 한 번 만들어서 둘 다 돌아가게 할 수 있어요. 대표적인 게 React Native, Flutter예요.
이걸 모르면:
- "iOS 앱 만들어줘" → iOS만 됨
- "아, Android도 필요한데?" → 또 만들어야 함
이걸 알면:
- "React Native로 iOS/Android 둘 다 돌아가게 만들어줘" → 한 번에 해결
❌ "앱 만들어줘" → 웹인지 모바일인지 불명확
✅ "모바일 앱으로 만들어줘. React Native 써서" → 모바일 앱이고, 기술 스택도 명확
✅ "iOS랑 Android 둘 다 돌아가게 만들어줘" → 크로스 플랫폼 요구사항 명확
3. 자동화/봇
사람이 직접 안 열어도 자동으로 실행되는 프로그램.
화면이 없고, 정해진 작업을 자동으로 처리해요.
✅ 장점 - 반복 작업을 대신 처리 - 사람이 안 해도 자동으로 실행 - 시간 절약 (매일 30분 걸리던 작업이 0분으로) ❌ 단점 - 화면이 없어서 결과 확인이 필요함 - 실행 환경 세팅 필요 (어디서 돌릴지)
자동화/봇의 예시
📊 마케팅 지표 대시보드
"GA, 메타, 네이버 광고 데이터 각각 로그인해서 엑셀에 복붙하는 거
매일 아침마다 30분씩 걸려요..."
→ 자동으로 각 채널에서 데이터 수집
→ 한 곳에 정리해서 슬랙으로 전송
→ 매일 아침 9시에 알아서 도착
📝 주간 보고서 자동 작성
"매주 금요일마다 이번 주 실적 정리하느라 2시간..."
→ 데이터 자동 수집
→ AI가 요약 + 인사이트 정리
→ 보고서 형식으로 만들어서 이메일 발송
🔍 경쟁사 모니터링
"경쟁사 뉴스, 가격 변동, SNS 반응 매일 체크하는 거 힘들어요"
→ 경쟁사 뉴스/블로그/SNS 자동 수집
→ 우리 회사 관련 내용만 필터링
→ AI가 요약해서 매일 아침 슬랙으로
📧 고객 문의 자동 분류
"문의 메일 100개 넘게 오는데 하나하나 읽고 분류하는 거..."
→ 문의 메일 자동 분류 (환불/배송/제품문의 등)
→ 긴급한 건 담당자한테 바로 알림
→ 자주 묻는 질문은 자동 응답
🎯 공통점
→ 매일/매주 반복하는 지루한 업무
→ 한번 세팅하면 알아서 돌아감
→ 내가 안 해도 되니까 다른 일에 집중 가능 AI한테 요청할 때
🎯 자동화 vs 웹, 어떻게 구분해서 요청하나요?
핵심은 화면이 필요한지, 자동으로 돌아가는지예요.
웹: 사람이 접속해서 버튼 누르고 사용 자동화: 정해진 시간에 자동으로 실행, 화면 없음
이걸 명확히 안 하면:
- "뉴스 모아주는 거 만들어줘" → AI가 웹으로 만들 수도 있음
- 원한 건 "매일 아침 자동으로" 실행인데, 웹으로 만들어지면 매번 접속해야 함
❌ "뉴스 모아주는 거 만들어줘" → 웹으로 만들지, 자동화로 만들지 불명확
✅ "매일 아침 자동으로 뉴스 수집해서 슬랙으로 보내주는 스크립트 만들어줘" → 자동화/봇라는 게 명확 → 실행 시간, 결과 전달 방식까지 명확
✅ "Python으로 자동화/봇 만들 건데, 매일 밤 12시에 실행되게 해줘" → 언어, 실행 시간까지 명확
하이브리드: 웹과 앱의 중간
요즘엔 "웹 기술로 만들었지만 앱처럼 동작"하는 것도 있어요.
🌐 + 📱 웹인데 앱처럼 쓸 수 있음 특징: - 브라우저에서 접속 - 홈 화면에 아이콘 추가 가능 - 오프라인에서도 작동 - 푸시 알림 가능 예) 트위터 모바일 웹, 인스타그램 웹 💡 "웹으로 만들되, 앱처럼 동작하게" 크로스 플랫폼 앱 (React Native, Flutter) 📱 한 번 만들면 iOS/Android 둘 다 작동 특징: - 한 번만 개발 (iOS용, Android용 따로 안 만들어도 됨) - 웹 기술 활용 (React 같은 거 씀) - 네이티브 앱보다는 느림 (근데 대부분 괜찮음) 예) 배민, 당근마켓 (React Native로 만들어짐) 💡 "모바일 앱인데 iOS/Android 한 번에"
바이브 코더 입장에서는:
- PWA: 웹으로 만들 때 "나중에 앱처럼 쓸 수 있게 해줘"라고 요청
- 크로스 플랫폼: 모바일 앱 만들 때 "React Native로 만들어줘"라고 요청
이것만 알면 돼요. 지금은 "이런 것도 있구나" 정도만 알아두세요. 나중에 자세히 다룰게요.
실제 대화 예시: 프로그램 종류 정하기
바이브 코더가 AI와 어떻게 대화하는지 상황극으로 보여드릴게요.
예시: 할 일 관리 서비스 만들기
나: "할 일 관리 서비스 만들 건데,
웹으로 할지 모바일 앱으로 할지 추천해줘."
AI: "어떻게 쓸 계획이신가요?
- 컴퓨터에서도 써야 하나요?
- 스마트폰 고유 기능(카메라, GPS)이 필요한가요?
- 빨리 만들어서 테스트하는 게 우선인가요?"
나: "컴퓨터에서도 쓸 거고,
빨리 만들어서 테스트하고 싶어.
카메라나 GPS는 필요 없어."
AI: "그럼 웹으로 만드는 게 좋겠네요.
브라우저에서 바로 접속 가능하고,
컴퓨터/스마트폰 어디서든 쓸 수 있어요.
배포도 쉬워서 빠르게 테스트할 수 있습니다."
나: "좋아, 웹으로 가자."
2단계: 기술 스택 결정
나: "웹으로 만들 건데, 기술 스택 추천해줘."
AI: "할 일 관리 서비스라면:
- React (화면 만들기)
- Supabase (데이터 저장)
이 조합 추천드려요.
React는 화면 만들기 쉽고,
Supabase는 백엔드 없이 DB 쓸 수 있어요."
나: "오케이, React + Supabase로 가자.
브라우저에서 돌아가는 웹앱으로 만들어줘."
AI: "네, 웹앱 프로젝트 시작하겠습니다!"
3단계: 만들고 확인하기
AI: "할 일 관리 웹앱 기본 구조 만들었어요. 확인해보세요."
나: "어떻게 확인하면 돼?"
AI: "브라우저에서 localhost:3000 접속하시면 돼요.
먼저 기능 단위로 확인해보세요:
1. 할 일 추가 버튼 눌러보기
2. 추가된 할 일이 목록에 보이는지 확인
3. 삭제 버튼 눌러보기
이렇게 하나씩 확인하면서 안 되는 부분 말씀해주세요."
[기능 단위로 직접 확인]
- 할 일 추가 → 잘 됨
- 목록 표시 → 잘 됨
- 삭제 → 어? 삭제가 안 되네?
나: "삭제 버튼 눌렀는데 안 지워져."
AI: "삭제 로직 확인해볼게요... 아, DB 연결 부분에 문제가 있네요.
수정할게요."
💡 AI가 코드 짜면 끝이 아니에요
기능 단위로 직접 확인해야 해요.
버튼 만들었으면 눌러보고, 저장 기능 만들었으면 저장해보고.
이 "확인 → 피드백" 과정이 없으면 나중에 다 꼬여요. 이게 기술적 대화예요.
"앱 만들어줘"가 아니라:
- "웹으로 할지 모바일로 할지 추천해줘"
- [AI 추천 듣고]
- "웹으로 가자"
- "기술 스택 추천해줘"
- [AI 추천 듣고]
- "React + Supabase로, 브라우저에서 돌아가는 웹앱으로 만들어줘"
- [만들어지면] 기능 단위로 직접 확인
- 안 되는 부분 발견하면 피드백
이렇게 단계별로 정하고, 확인하고, 피드백하면서 대화하는 거예요.
정리: 프로그램 종류별 비교표
| 웹 서비스 | 모바일 앱 | 자동화/봇 | 데스크톱 앱 | |
|---|---|---|---|---|
| 실행 환경 | 브라우저 | 스마트폰 | 서버/컴퓨터 | 컴퓨터 |
| 설치 필요 | ❌ 없음 | ✅ 필요 | ❌ 없음 | ✅ 필요 |
| 업데이트 | ⚡ 즉시 | 🐢 심사 | ⚡ 즉시 | 🐢 재설치 |
| 배포 난이도 | ⭐ 쉬움 | ⭐⭐⭐ 어려움 | ⭐⭐ 보통 | ⭐⭐⭐ 어려움 |
| 바이브 코더 | 🎯 추천 | 중급자용 | 🎯 추천 | 비추천 |
| 언제 쓰나요 | 빨리 테스트 | 스마트폰 | 반복 작업 | 전문 프로그램 |
| 다양한 기기 | 고유 기능 | 자동화 |
바이브 코더 초보라면: 1순위: 웹 서비스 2순위: 자동화/봇 3순위: 모바일 앱 (나중에)
오늘의 핵심 정리
→ 웹 (브라우저), 모바일 앱 (스마트폰), 자동화 (자동 실행) ✅ 웹 서비스 = 브라우저에서 접속 → 설치 없음, 배포 쉬움, 업데이트 즉시 반영 → 바이브 코더가 가장 많이 만듦 ✅ 모바일 앱 = 스마트폰에 설치 → 스마트폰 기능 활용 (카메라, GPS, 푸시 알림) → 앱스토어 심사 필요, 배포 복잡 ✅ 자동화/봇 = 사람 없이 자동 실행 → 반복 작업 대신 처리 → 화면 없음, 정해진 시간에 실행 ✅ AI한테 요청할 때: "앱 만들어줘" (❌ 불명확) → "브라우저에서 돌아가는 웹앱으로 만들어줘" (✅ 명확)
셀프체크
오늘 배운 내용, 제대로 이해했는지 확인해볼까요?
□ 카카오톡은 무슨 앱인가요?
□ 노션 웹 버전은 무슨 앱인가요?
□ 이 시리즈에서는 주로 무엇을 만드나요?
(정답: 네이티브 앱 - 설치/알림/오프라인 지원 / 웹앱 - 설치 X, 브라우저 사용 / 웹앱 - 배포와 테스트가 쉬워서)
다음 글 예고
오늘은 프로그램의 종류를 배웠어요. "어디서 돌아가느냐"에 따라 웹, 모바일 앱, 자동화/봇로 나뉘고, AI한테 "브라우저에서 돌아가게" 같은 식으로 말할 수 있게 됐어요.
다음 글에서는 프론트엔드 vs 백엔드를 알아볼게요.
웹 서비스를 만든다고 했을 때:
- "화면에 보이는 부분"과 "뒤에서 처리하는 부분"이 나뉘어요
- AI한테 "로그인 UI는 프론트에, 인증 로직은 백엔드에 만들어줘"라고 말할 수 있게 돼요
- "백엔드 없이도 만들 수 있어?"라는 질문에 답을 알게 돼요
프로그램 종류를 알았으니, 이제 그 안의 구조를 알아볼 차례예요.
이 시리즈 로드맵
PART 1: 마인드셋 (4편) ✅ 완료!
[ 1~4편 ] AI는 신입사원, 바이브 코딩, 유능한 상사 되기
↓
PART 2: 도구 세팅 (5편) ✅ 완료!
[ 5~9편 ] Claude Code, 터미널, VS Code, Git, 환경 세팅
↓
PART 3: 기술 개념 - 큰 그림 (6편)
[ 10편 ] 프로그램의 종류 ← 지금 여기!
[ 11편 ] 프론트엔드 vs 백엔드
[ 12편 ] 데이터는 어디에 저장되나
[ 13편 ] 서비스들이 대화하는 방법: API
[ 14편 ] 프로젝트 구조
[ 15편 ] 데이터 흐름
↓
PART 4: 기술 개념 - 설계 (5편)
[ 16~20편 ] 자료구조, 아키텍처, 디자인 패턴, 상태 관리
↓
PART 5~7: 프로젝트 (12편)
PART 8: 독립 성장 (3편)
"앱 만들어줘"에서 "브라우저에서 돌아가는 웹앱으로 만들어줘"로. 이 한 마디 차이가 AI가 정확히 이해하는 차이예요.
궁금한 점이나 다뤘으면 하는 주제가 있으면 댓글로 남겨주세요!