AI로 기획자에서 개발자가 된 송샘블로그 홈 →바이브 코딩, 웹앱 하나로 시작하세요: TWA로 플레이스토어 앱까지
TWA는 내 웹앱을 주소창 없이 안드로이드 앱처럼 여는 방법입니다. 웹앱은 AI와 만들고 바로 확인하며 고치기 좋아서, 바이브 코딩을 처음 시작할 때 좋은 출발점이 됩니다.
바이브 코딩을 처음 시작한다면 웹앱 하나를 만들고, TWA로 감싸 플레이스토어에 올려 보는 것을 권합니다. TWA는 내 웹앱을 주소창 없이 안드로이드 앱처럼 여는 방법입니다. 제가 만들어 보니 웹앱은 AI와 만들고 바로 확인하며 고치기 좋았고, TWA를 더하면 처음 만든 것이 "내 앱"이 되는 비교적 짧은 길이 됩니다.
바이브 코딩이란?
바이브 코딩은 코드를 한 줄씩 직접 짜는 대신, AI에게 말로 설명하고 결과를 보며 프로그램을 만들어 가는 방식입니다. 2025년 2월 AI 연구자 안드레이 카파시가 처음 쓴 말로 알려져 있습니다. 코드를 잘 몰라도 "이런 화면에 이런 기능이 있으면 좋겠다"를 설명할 수 있으면 시작할 수 있습니다.
다만 무엇을 만들지가 중요합니다. 처음부터 복잡한 앱을 만들려고 하면 금방 막히기 쉽습니다. 그래서 저는 웹앱으로 시작하라고 말씀드립니다. 웹앱은 인터넷 브라우저에서 쓰는 프로그램으로, 주문 관리, 일정표, 간단한 계산기 같은 것도 웹앱으로 만들 수 있습니다.
TWA란 무엇인가?
TWA(Trusted Web Activity)는 구글이 만든 안드로이드 기능으로, 내 웹사이트를 앱 화면에 그대로 띄우는 방법입니다. 앱을 열면 주소창 없이 웹사이트가 앱처럼 화면을 채웁니다. 실제로 화면을 그리는 것은 휴대폰의 크롬 브라우저입니다.
핵심은 웹사이트와 앱이 같은 개발자의 것이라는 관계를 확인하는 것입니다. 웹사이트에 확인 파일(Digital Asset Links)을 올려 두면, 앱과 웹사이트가 서로 짝인 것을 크롬이 확인하고 주소창을 숨겨 줍니다.
HTTPS 연결과 앱 설정도 필요하지만, 구글의 Bubblewrap이나 PWABuilder 같은 도구를 쓰면 안드로이드 코드를 처음부터 직접 작성하는 부담을 줄일 수 있습니다.
| 앱을 새로 만들기 | TWA로 감싸기 | |
|---|---|---|
| 필요한 실력 | 안드로이드 개발(코틀린 등) | 웹사이트 하나 |
| 고칠 때 | 앱을 다시 올리고 심사 | 웹 화면·기능은 웹만 고치면 반영 |
| 화면 | PC·휴대폰·앱 따로 | 웹 하나로 PC·휴대폰·앱 |
| 아이폰 | 따로 만들어야 함 | 지원 안 됨(다른 방법 필요) |
왜 바이브 코딩을 TWA로 시작하면 좋을까?
- 첫 결과를 빨리 봅니다: 작은 기능부터 만들고 브라우저에서 바로 확인할 수 있습니다. 처음 시작할 때는 "되네!" 하는 경험이 중요한데, 웹앱은 그 경험을 비교적 빨리 줍니다.
- 고치고 바로 확인할 수 있습니다: 웹의 화면과 기능을 고치면 앱에도 반영됩니다. 이런 수정은 보통 앱을 다시 제출할 필요가 없어, AI와 만들고 확인하고 고치는 일을 빠르게 반복할 수 있습니다. 다만 앱 자체의 설정을 바꾸면 재배포가 필요할 수 있습니다.
- 하나로 세 곳에 나갑니다: 화면 크기에 맞게 만들면 웹앱 하나를 PC와 휴대폰 브라우저, 안드로이드 앱에서 함께 쓸 수 있습니다.
- "내 앱"이 생깁니다: 필요한 테스트와 심사를 통과하면 플레이스토어에 내가 만든 앱이 생깁니다. 생각보다 큰 동기가 되고, 만들면서 배우라는 말을 실천하기에 좋은 목표입니다.
처음에는 작은 기능 하나부터
처음부터 큰 앱을 만들 필요는 없습니다. 오늘 할 일과 마감일, 회의 일정 등을 내 방식대로 정리하는 나만의 스케줄러도 좋은 시작입니다.
무엇을 만들지 정하고, 화면과 기능의 구조를 잡고, 필요한 자료를 준비해 보세요. 그다음 AI와 함께 만들고 직접 써 보면서 고쳐 가면 됩니다. 저도 추가 기능이 필요해서 시작했습니다. "이런 게 하나 있으면 좋겠다"는 생각부터 출발해 보세요.
시작 전에 알아 둘 것
좋은 점만 있는 것은 아닙니다. 미리 알고 시작하면 덜 막힙니다.
- 신규 개인 개발자 계정은 테스트가 먼저입니다: 2023년 11월 13일 이후 만든 개인 계정은 앱을 공개하기 전에 최소 12명의 테스터가 14일 동안 연속으로 참여하는 비공개 테스트를 거쳐야 합니다. 주변에 부탁할 사람을 미리 생각해 두세요.
- 확인 파일이 맞지 않으면 주소창이 보입니다: 앱을 열었는데 위에 주소창이 남아 있다면, 대부분 웹사이트의 확인 파일 설정 문제입니다. 막히면 AI에게 그 화면과 설정을 그대로 보여 주고 물어보면 됩니다.
- 아이폰은 다른 길이 필요합니다: TWA는 안드로이드 기능입니다. 아이폰 앱은 다른 방법을 써야 합니다.
- 웹이 느리면 앱도 느립니다: 앱은 결국 웹사이트를 보여 주는 것이라, 웹사이트의 품질이 곧 앱의 품질입니다.
정리
- 바이브 코딩은 작은 웹앱 하나로 시작하기 좋습니다.
- TWA는 그 웹앱을 주소창 없이 안드로이드 앱처럼 열어 구글 플레이에 올리는 방법입니다.
- 웹의 화면과 기능은 웹만 고치면 앱에 반영되니, AI와 빠르게 고치며 배우기 좋습니다.
- 신규 개인 계정의 테스트(12명·14일)와 아이폰 미지원은 미리 알아 두세요.
원팩에서 만드는 업무 시스템 FROX도 웹을 중심에 두고 PC와 휴대폰에서 함께 쓰도록 만듭니다. 작게 시작해 고쳐 가는 방식은 같습니다.
출처
프로그램 기획자로 일하다, 2년 동안 하루 5~12시간씩 AI와 일하며 개발자가 됐습니다. 지금은 원팩에서 AI가 결합된 업무 시스템 FROX를 만듭니다.