AI로 개발을 처음 시작할 때 꼭 알면 좋은 것들 (feat. 프로토타입 그 이후)
최근 AI로 개발을 처음 시작한 지인이 직접 만든 웹 애플리케이션 프로토타입을 보여주었습니다. Claude(클로드)에 프롬프트를 입력해 HTML 파일 하나로 깔끔하게 동작하는 앱이었죠. 감탄도 잠시, 제가 문득 질문을 던졌습니다.

"데이터베이스(DB)는 어떻게 하실 건가요?" "네? 데이터베이스요...?"
그 순간 우리의 대화는 깊어졌습니다. Claude가 만들어준 HTML 파일은 브라우저를 닫거나 새로고침하면 입력했던 데이터가 모두 사라지는 '일회성 화면'이었기 때문입니다.
이제 막 AI 프롬프트로 개발에 재미를 붙인 입문자분들이 진짜 '쓸 만한 서비스'를 만들기 위해 알아야 할 핵심 개념과 무료 도구들을 소개합니다.
1. 데이터베이스(DB)란?
데이터베이스는 정보를 안전하게 기억하는 '디지털 창고'입니다. 웹 화면은 새로고침하면 모든 기억을 잃어버리지만, 데이터베이스가 있으면 사용자의 아이디, 글, 비밀번호 등을 영구적으로 저장하고 언제든 다시 꺼내 쓸 수 있습니다.
2. 웹 서버란?
웹 서버는 내가 만든 앱을 인터넷 세상에 24시간 켜두는 '컴퓨터'입니다. 내 개인 노트북에서만 열리던 HTML 페이지를 웹 서버에 올려두면, 전 세계 누구나 주소(URL)를 입력해 내가 만든 앱에 접속할 수 있게 됩니다.
3. 데이터베이스 무료 서비스: 수파베이스(Supabase)
AI가 코드를 짜줘도 데이터베이스를 직접 구축하는 건 초보자에게 통곡의 벽입니다. 이때 가장 추천하는 서비스가 바로 수파베이스(Supabase)입니다.
무엇인가요? 복잡한 서버 개발 없이 클릭 몇 번으로 데이터베이스를 만들 수 있게 도와주는 서비스입니다.
왜 좋나요? 엑셀처럼 생긴 화면에서 마우스로 데이터를 관리할 수 있고, AI에게 "수파베이스 연결하는 코드 짜줘"라고 하면 찰떡같이 연동 코드를 만들어 줍니다. 게다가 초기 프로토타입을 만들기엔 차고 넘치는 강력한 무료 요금제를 제공합니다.
4. 웹 서버 무료 서비스: 클라우드플레어(Cloudflare)
내가 만든 앱을 전 세계에 무료로, 그것도 가장 빠르게 배포하고 싶다면 클라우드플레어(Cloudflare)의 컴퓨팅 서비스인 Workers나 Pages가 정답입니다.
무엇인가요? 서버를 직접 사거나 관리할 필요 없이, 코드만 올리면 전 세계 수백 개 컴퓨터에 내 앱을 동시에 복사해서 실행해 주는 '서버리스(Serverless)' 서비스입니다.
왜 좋나요? 매일 10만 건의 요청까지 완벽하게 무료입니다. 트래픽이 몰려도 서버가 터질 걱정이 없으며, 초보자가 무서워하는 '폭탄 과금' 위험이 없어 안심하고 쓸 수 있습니다.
★ Supabase 네이티브 연동 가능: 클라우드플레어 대시보드 클릭 단 몇 번으로 Supabase 데이터베이스 정보(URL 및 API Key)를 안전하게 연결하고 환경 변수로 불러와 사용할 수 있어 초보자도 쉽게 연동이 가능합니다.
5. Claude CLI, Gemini CLI, Codex: 웹을 넘어 터미널로!
혹시 아직도 Claude나 Gemini 웹사이트 창에 코드를 복사·붙여넣기 하고 계시나요? 그렇다면 CLI(커맨드 라인 인터페이스) 도구나 개발 도구를 도입할 때입니다.
무엇이 다른가요? 웹 브라우저를 켜지 않고, 개발자들이 쓰는 검은 창(터미널)이나 코드 편집기 안에서 AI를 명령어(코드 생성해줘)로 바로 호출하는 방식입니다.
CLI로 하면 좋은 점:
코드 파일을 일일이 복사해서 웹에 붙여넣을 필요가 없어 개발 속도가 수십 배 빨라집니다.
AI가 내 프로젝트의 전체 구조와 여러 파일 간의 관계를 스스로 파악하므로, 훨씬 더 정확하고 완성도 높은 코드를 짜줍니다.
6. 초보자를 위한 마법의 프롬프트 공유
앞서 소개해 드린 Supabase와 Cloudflare를 엮어서 번거로운 설정 없이 한 번에 애플리케이션을 만들 수 있는 프롬프트 양식입니다. Claude나 Gemini에 그대로 복사해서 빈칸을 채워 사용해 보세요.
💡 Cloudflare + Supabase 앱 생성 프롬프트
"나는 지금 [만들고 싶은 서비스 이름, 예: 개인 메모 저장 앱] 서비스를 만들려고 해.
백엔드 데이터베이스는 Supabase를 사용할 거고, 웹 서버 및 배포는 Cloudflare Workers(또는 Pages) 환경을 사용할 거야.
Cloudflare와 Supabase는 대시보드에서 네이티브 연동(바인딩)을 통해 간편하게 연결하여 사용할 수 있으니, 이를 고려해서 두 서비스가 유기적이고 안전하게 연동되어 동작하는 풀스택 애플리케이션 코드를 작성해 줘.
[포함되어야 할 기능]
사용자가 데이터를 입력하고 저장하는 기능
저장된 데이터를 화면에 리스트로 불러오는 기능
Supabase의 환경 변수(URL, Anon Key)를 Cloudflare wrangler.toml 설정 파일에 연동/바인딩하여 연동하는 방법 안내
초보자도 쉽게 따라 할 수 있도록 프로젝트 초기 설정 방법부터 파일 구조, 완벽한 소스 코드까지 단계별로 친절하게 설명해 줘."
*Supabase
*Cloudflare
7. 맺음말: 이제 프로토타입을 넘어 진짜 서비스로!
AI 덕분에 코딩의 문턱이 대폭 낮아진 지금, 우리는 아이디어만 있으면 단 몇 분 만에 눈에 보이는 화면을 만들어낼 수 있는 위대한 시대에 살고 있습니다.
하지만 사용자가 직접 로그인하고, 소중한 데이터를 기록하고, 언제 어디서나 접속할 수 있는 '진짜 서비스'가 되기 위해서는 데이터베이스(창고)와 웹 서버(컴퓨터)라는 든든한 날개가 반드시 필요합니다.
오늘 소개해 드린 Supabase와 Cloudflare는 비용 걱정 없는 강력한 무료 요금제와 AI가 가장 좋아하는 단순하고 명확한 연동 구조를 갖춘 최고의 조합입니다.
"새로고침하면 사라지던 아쉬운 프로토타입"은 이제 그만! 지금 바로 여러분만의 첫 디지털 창고와 컴퓨터를 마련하여, 세상 사람들에게 진짜 사랑받고 가치를 주는 서비스를 세상에 선보여 보세요. AI가 여러분의 든든한 풀스택 파트너가 되어 줄 것입니다.
#AI개발 #초보개발자 #코딩독학 #Supabase #Cloudflare #Hono프레임워크 #Claude #Gemini #프롬프트엔지니어링 #프로토타입 #웹개발입문 #서버리스 #DB입문 #개발블로그






댓글 (0)