Lovable로 첫 성공 경험 만들기

처음에는 '잘 만든 앱'보다 '끝까지 가본 경험'이 중요합니다

처음 바이브 코딩 도구를 열면 이상하게 마음이 커집니다. "이왕이면 로그인도 넣고, 결제도 붙이고, 관리자 페이지도 만들고, 나중에는 앱스토어에도 올리고 싶다"는 생각이 자연스럽게 듭니다. 이상한 일이 아닙니다. 눈앞의 입력창 하나가 마치 개발팀 전체처럼 느껴지기 때문입니다.

하지만 첫 번째 성공 경험은 거대한 앱에서 나오지 않습니다. 오히려 반대입니다. 첫 성공은 "내가 설명한 것이 화면으로 나타났다", "버튼을 눌렀더니 목록에 추가됐다", "수정 요청을 했더니 정말 바뀌었다", "링크를 다른 사람에게 보낼 수 있었다" 같은 작은 순간에서 만들어집니다.

Lovable은 이 첫 경험을 만들기에 좋은 앱 빌더형 도구입니다. 자연어로 원하는 앱을 설명하면 화면을 만들고, 기본 기능을 붙이고, 미리보기에서 확인하고, 배포까지 이어갈 수 있습니다. Lovable 공식 문서도 첫 프로젝트를 시작하는 방법을 "프롬프트를 입력하고, 결과를 확인하고, 대화로 수정하고, 필요하면 백엔드와 배포를 연결하는 흐름"으로 안내합니다.¹

여기서 중요한 점은 Lovable이 만능이라는 뜻이 아니라는 것입니다. 유명한 도구가 초보자에게 쉬운 도구는 아닙니다. Claude Code, Cursor, Codex 같은 개발자형 도구는 코드베이스, 터미널, GitHub, 테스트 같은 개발 흐름에 더 가깝습니다. 반면 Lovable은 처음부터 "말로 앱을 만들어보고 싶은 사람"에게 더 친절한 출발점을 제공합니다.

처음에는 앱 빌더형 도구로 성공 경험을 만드는 것이 중요합니다. 그리고 그 경험이 쌓이면 그다음에 Replit Agent, Bolt.new, v0, Google AI Studio Build mode, Cursor 같은 도구의 역할도 더 분명하게 보입니다.

Lovable은 어떤 도구인가요?

Lovable은 "내가 원하는 앱을 채팅으로 설명하면 AI가 웹앱 형태로 만들어주는 도구"라고 이해하면 됩니다. 식당 비유로 말하면, 우리는 사장님이 되어 "이런 손님을 위한 이런 메뉴와 이런 분위기의 가게를 열고 싶어요"라고 설명합니다. Lovable은 그 말을 듣고 메뉴판, 인테리어, 주방 동선, 임시 오픈까지 한 번에 준비해주는 팀처럼 움직입니다.

물론 실제 개발팀처럼 모든 것을 완벽하게 판단하지는 못합니다. 그래서 우리는 사장님 역할을 계속해야 합니다. 메뉴가 잘못 적혔는지, 손님 동선이 이상하지 않은지, 주문이 제대로 들어가는지 직접 확인해야 합니다.

Lovable에서 초보자가 특히 편하게 느끼는 지점은 다음 세 가지입니다.

• 자연어 프롬프트로 시작할 수 있습니다. "독서 기록 앱을 만들어줘", "강의 후기를 수집하는 폼을 만들어줘"처럼 문장으로 시작할 수 있습니다.

• 미리보기로 바로 확인할 수 있습니다. 완성된 코드를 먼저 이해해야 하는 것이 아니라, 화면을 보고 버튼을 눌러보며 판단할 수 있습니다.

• 수정도 대화로 이어갈 수 있습니다. "삭제 전에 확인창을 띄워줘", "모바일에서 카드가 한 줄로 보이게 해줘"처럼 한 가지씩 고칠 수 있습니다.

Lovable은 React, TypeScript, Tailwind CSS 같은 웹 개발 기술을 바탕으로 결과물을 만들 수 있고, 필요하면 Supabase나 Lovable Cloud 같은 백엔드 기능을 연결할 수 있습니다.² 하지만 초보자는 이 기술 이름을 모두 외울 필요가 없습니다. 지금은 "화면을 만드는 부분", "데이터를 저장하는 부분", "배포해서 공유하는 부분"이 한 흐름 안에 들어있다고 이해하면 충분합니다.

이 장에서 만들 성공 경험의 기준

이 장에서 말하는 성공은 "당장 돈을 받는 서비스 출시"가 아닙니다. 첫 성공의 기준을 너무 높게 잡으면 시작하기도 전에 지칩니다.

오늘의 성공 기준은 이 정도면 충분합니다.

• 앱 아이디어를 한 문장으로 설명할 수 있다.

• 핵심 기능 1~3개만 담은 첫 프롬프트를 쓸 수 있다.

• 생성된 앱을 미리보기에서 직접 눌러볼 수 있다.

• 마음에 들지 않는 부분을 한 번에 하나씩 수정 요청할 수 있다.

• 공유 가능한 링크로 배포하거나, 최소한 배포 직전까지 점검할 수 있다.

예를 들어 "운동 루틴 기록 앱"을 처음부터 헬스장 회원 관리 서비스로 만들 필요는 없습니다. 첫 버전은 운동 날짜, 운동 이름, 세트 수, 메모를 입력하고 목록으로 보는 정도면 충분합니다. "예약 문의 앱"도 처음부터 자동 문자 발송, 결제, 직원별 권한 관리까지 넣지 않아도 됩니다. 이름, 연락처, 희망 날짜, 문의 내용을 받고 관리자 화면에서 확인하는 정도로 시작하면 됩니다.

바이브 코딩은 코딩을 안 배워도 된다는 뜻이 아닙니다. 내가 원하는 것을 AI가 이해하게 설명하는 기술입니다. Lovable은 그 기술을 비교적 부담 없이 연습할 수 있는 연습장에 가깝습니다.

Lovable로 시작하기 좋은 앱, 아직 미루는 앱

Lovable로 처음 만들기 좋은 앱은 구조가 단순한 앱입니다. 사용자가 입력하고, 저장하고, 목록으로 보고, 필요하면 수정하거나 삭제하는 앱이 좋습니다. 이전 장들에서 다룬 독서 기록 앱, 할 일 관리 앱, 강의 후기 수집 앱, 프롬프트 보관함 앱이 여기에 해당합니다.

첫 앱으로 좋은 예시는 다음과 같습니다.

반대로 처음부터 미루는 편이 좋은 앱도 있습니다. 결제, 의료 정보, 법률 상담, 금융 데이터, 민감한 개인정보를 다루는 앱은 초보자의 첫 프로젝트로 적합하지 않습니다. 로그인, 권한 관리, 결제, 대규모 데이터, 보안 정책은 모두 난이도가 올라가는 기능입니다.

예를 들어 "학원 수강료 결제 앱"은 예약 문의 앱보다 훨씬 어렵습니다. 결제 실패, 환불, 영수증, 개인정보, 관리자 권한, 결제 키 보안까지 생각해야 하기 때문입니다. "직원 평가 관리 앱"도 민감합니다. 누가 어떤 평가를 볼 수 있는지 권한 정책이 매우 중요합니다. "병원 증상 기록 앱"은 의료 정보에 해당할 수 있으므로 초보자가 바로 공개 서비스로 만들기에는 위험합니다.

Lovable이 이런 기능을 어느 정도 만들어줄 수 있더라도, AI가 만든 앱도 반드시 사람이 검토해야 합니다. 작동하는 것과 서비스로 운영 가능한 것은 다릅니다.

첫 프롬프트는 작게, 하지만 구체적으로

Lovable에서 가장 흔한 실수는 "좋은 앱 하나 만들어줘"라고 쓰는 것입니다. 사람에게도 이렇게 말하면 곤란합니다. 어떤 사람을 위한 앱인지, 무엇을 입력해야 하는지, 결과를 어떻게 보여줘야 하는지 알 수 없기 때문입니다.

좋은 첫 프롬프트는 작은 기획서처럼 써야 합니다. 그렇다고 길고 어려운 문서를 만들 필요는 없습니다. 다음 여섯 가지만 들어가면 됩니다.

• 나는 누구인지

• 어떤 앱을 만들고 싶은지

• 누가 사용할 앱인지

• 핵심 기능 1~3개가 무엇인지

• 화면은 어떻게 구성되면 좋을지

• 처음 버전에서 제외할 기능은 무엇인지

아래 프롬프트는 Lovable에 바로 넣어볼 수 있는 첫 요청 예시입니다.

나는 코딩을 모르는 1인 강사입니다.
수업이 끝난 뒤 수강생 후기를 쉽게 모으는 웹앱을 만들고 싶습니다.

사용자는 강의를 들은 수강생이고, 저는 관리자로 후기를 확인합니다.

첫 버전에는 다음 기능만 넣어주세요.
1. 수강생이 이름, 강의명, 만족도 점수, 좋았던 점, 개선할 점을 입력할 수 있는 후기 제출 폼
2. 제출 후 "후기가 접수되었습니다"라는 확인 메시지 표시
3. 관리자가 제출된 후기를 카드 목록으로 확인하는 화면

화면 구성은 다음과 같이 해주세요.
- 첫 화면: 강의 후기 제출 폼
- 관리자 화면: 제출된 후기 목록

디자인은 깔끔한 교육 서비스 느낌으로, 흰 배경과 부드러운 파란색 포인트를 사용해주세요.
모바일에서도 사용하기 편하게 만들어주세요.

처음 버전에서는 로그인, 결제, 이메일 발송, 엑셀 다운로드 기능은 제외해주세요.
MVP로 작게 만들어주세요.

이 프롬프트의 핵심은 "넣을 것"과 "뺄 것"이 함께 있다는 점입니다. 초보자는 넣을 기능만 말하고 제외할 기능을 말하지 않는 경우가 많습니다. 그러면 AI가 친절해 보이려고 이것저것 붙이다가 오히려 복잡한 앱을 만들 수 있습니다.

Lovable 작업 흐름: 요청하고, 눌러보고, 하나씩 고치기

Lovable의 기본 흐름은 복잡하지 않습니다. 공식 문서에서도 프롬프트로 시작하고, 채팅 기반 편집과 시각 편집, 버전 되돌리기, 백엔드 연결, 배포와 공유로 이어지는 구조를 설명합니다.³

초보자는 이 흐름을 여섯 단계로 기억하면 좋습니다.

1단계: 아이디어를 한 문장으로 줄이기

먼저 앱을 한 문장으로 말해봅니다.

"수강생 후기를 모아서 강사가 한눈에 보는 앱."

이 문장이 길어지면 앱도 길어집니다. "수강생을 관리하고, 결제하고, 출석 체크하고, 과제 제출하고, 자동 알림까지 보내는 앱"은 첫 버전이 아닙니다. 그것은 나중 버전입니다.

2단계: 핵심 기능 1~3개만 요청하기

처음 요청에는 기능을 적게 넣습니다. 예를 들어 강의 후기 앱이라면 제출 폼, 제출 완료 메시지, 후기 목록이면 충분합니다. 예약 문의 앱이라면 문의 폼, 문의 목록, 상태 변경 정도면 됩니다.

3단계: 미리보기에서 직접 눌러보기

생성된 화면이 나오면 감상만 하지 말고 실제 사용자처럼 눌러봐야 합니다. 이름을 입력해보고, 빈칸으로 제출해보고, 모바일 화면도 확인해봅니다. 이 단계에서 "예쁘다"보다 "작동한다"가 더 중요합니다.

4단계: 한 번에 하나씩 수정하기

수정 요청은 작게 나눕니다. "전체적으로 더 좋게 해줘"가 아니라 "후기 목록에서 만족도 점수가 높은 순으로 정렬되게 해줘"처럼 말해야 합니다. 바이브 코딩 초보자에게 가장 중요한 습관입니다.

후기 목록 화면에서 만족도 점수가 높은 후기부터 위에 보이도록 정렬해주세요.
다른 기능은 변경하지 말고, 정렬 방식만 수정해주세요.

5단계: 필요할 때만 백엔드 연결하기

처음 미리보기에서는 데이터가 브라우저 안에서만 임시로 유지될 수 있습니다. 새로고침하면 사라지는 경우도 있습니다. 실제로 여러 사람이 제출한 내용을 저장하려면 백엔드가 필요합니다. 백엔드는 손님에게 보이지 않는 주방입니다. 사용자가 입력한 데이터를 받아 저장하고, 필요할 때 다시 꺼내줍니다.

Lovable에서는 Lovable Cloud나 Supabase 같은 백엔드 연결을 사용할 수 있습니다.⁴ 초보자는 처음부터 백엔드를 붙이기보다, 화면과 기본 흐름이 안정된 뒤 연결하는 편이 안전합니다.

6단계: 배포 전 점검하고 공유하기

배포는 가게 문을 열고 손님이 들어올 수 있게 하는 일입니다. Lovable에서는 프로젝트를 게시해 공유 가능한 URL을 만들 수 있습니다. 다만 배포 전에 버튼, 모바일 화면, 한국어 문구, 개인정보 수집 항목을 꼭 확인해야 합니다.

첫 배포는 세상 전체에 공개하는 거대한 발표가 아닙니다. 동료 한 명, 가족 한 명, 수강생 한 명에게 보내 피드백을 받는 작은 테스트라고 생각하면 됩니다.

Knowledge File은 앱의 '작은 기획서'입니다

Lovable에서 작업하다 보면 AI가 처음의 의도를 잊은 것처럼 행동할 때가 있습니다. 처음에는 "강사용 후기 앱"이었는데, 어느 순간 일반 설문조사 앱처럼 바뀌거나, 디자인 톤이 달라지거나, 제외했던 로그인 기능을 다시 제안할 수 있습니다.

이럴 때 도움이 되는 것이 Custom Knowledge, 흔히 Knowledge File이라고 부르는 기능입니다. Lovable 문서에서는 Custom Knowledge를 프로젝트의 기능, 디자인, 목표를 한곳에 정리하는 청사진처럼 설명합니다.⁵

쉽게 말하면 Knowledge File은 앱의 "가게 운영 원칙"입니다. 직원이 바뀌어도 "우리 가게는 조용한 동네 카페이고, 대표 메뉴는 핸드드립이며, 키즈카페처럼 운영하지 않는다"는 원칙이 있으면 방향이 흔들리지 않습니다.

초보자는 Knowledge File에 다음 내용을 짧게 넣어두면 좋습니다.

프로젝트 이름: 강의 후기 수집 앱

앱의 목적:
1인 강사가 수업 후 수강생 후기를 쉽게 수집하고, 관리자가 목록으로 확인하는 앱입니다.

주요 사용자:
- 수강생: 후기 제출 폼을 작성합니다.
- 강사/관리자: 제출된 후기를 확인합니다.

핵심 기능:
1. 후기 제출 폼
2. 제출 완료 메시지
3. 관리자용 후기 목록
4. 후기 상태 표시: 확인 전 / 확인 완료

디자인 톤:
깔끔한 교육 서비스 느낌, 흰 배경, 부드러운 파란색 포인트, 모바일 우선 디자인

처음 버전에서 제외할 기능:
로그인, 결제, 이메일 자동 발송, 엑셀 다운로드, 복잡한 통계, 외부 API 연동

중요한 원칙:
MVP를 유지합니다. 새로운 기능을 추가할 때는 기존 기능을 망가뜨리지 않도록 먼저 영향 범위를 설명한 뒤 수정합니다.

이렇게 프로젝트 맥락을 남겨두면 매번 긴 설명을 반복하지 않아도 됩니다. 물론 Knowledge File이 모든 문제를 막아주지는 않습니다. 하지만 AI가 프로젝트의 목적과 제한선을 계속 참고하게 해 결과물의 일관성을 높이는 데 도움이 됩니다.

Supabase가 나오면 겁먹지 말고 세 단어만 기억하세요

Lovable로 앱을 만들다 보면 Supabase라는 이름을 만날 수 있습니다. 여기서 많은 초보자가 멈춥니다. "이제 개발자 영역으로 넘어간 것 아닌가?"라는 생각이 들기 때문입니다.

겁먹지 않아도 됩니다. 처음에는 세 단어만 기억하면 됩니다.

인증은 출입증 확인입니다. 누가 들어왔는지 확인하는 기능입니다. 회원가입, 로그인, 로그아웃이 여기에 들어갑니다.

데이터베이스는 장부 또는 엑셀 파일입니다. 사용자가 입력한 후기, 예약 문의, 할 일 목록을 저장하는 곳입니다.

권한 정책은 "누가 어떤 장부를 볼 수 있는가"를 정하는 규칙입니다. 예를 들어 수강생은 자기 후기를 제출만 하고, 다른 사람의 후기는 보면 안 됩니다. 관리자는 전체 후기를 볼 수 있어야 합니다.

Supabase 같은 백엔드를 연결할 때는 코드를 모두 이해하려고 하기보다 다음 질문을 먼저 던지면 됩니다.

이 앱에서 Supabase를 연결하기 전에 초보자도 이해할 수 있게 설명해주세요.
1. 어떤 데이터 테이블이 필요한가요?
2. 각 테이블에는 어떤 항목이 저장되나요?
3. 로그인한 사용자와 관리자 권한은 어떻게 구분되나요?
4. 사용자가 다른 사람의 데이터를 볼 위험은 없나요?
5. 배포 전에 확인해야 할 보안 설정은 무엇인가요?
아직 코드는 수정하지 말고 설명만 해주세요.

이 프롬프트의 마지막 문장이 중요합니다. "아직 코드는 수정하지 말고 설명만 해주세요." 복잡한 기능은 바로 구현시키기 전에 먼저 설명을 듣고 판단해야 합니다. Lovable의 Chat Mode나 계획 중심 대화는 이런 상황에서 유용합니다. 일부 가이드에서도 Chat Mode를 코드 수정 전 계획, 디버깅, 구현 방식 검토에 활용하라고 권합니다.⁶

Lovable에서 바로 써먹는 수정 프롬프트

Lovable을 잘 쓰는 사람은 한 번에 완벽한 프롬프트를 쓰는 사람이 아닙니다. 결과를 보고, 문제를 하나 고르고, 구체적으로 고치는 사람입니다. 아래 프롬프트들은 그대로 복사해 앱 이름과 기능만 바꿔 써도 됩니다.

기능 추가 프롬프트

현재 앱에 검색 기능을 추가해주세요.
대상 화면은 관리자 목록 화면입니다.
사용자가 검색창에 이름이나 키워드를 입력하면 해당 단어가 포함된 항목만 보이게 해주세요.
기존 입력 폼과 저장 기능은 변경하지 마세요.
검색 결과가 없을 때는 "검색 결과가 없습니다"라는 문구를 보여주세요.

목록 항목에 삭제 기능을 추가해주세요.
삭제 버튼을 누르면 바로 삭제하지 말고, "정말 삭제하시겠습니까?" 확인창을 먼저 보여주세요.
사용자가 확인을 누른 경우에만 삭제하고, 삭제 후에는 "삭제되었습니다"라는 안내 메시지를 표시해주세요.

관리자 목록에 상태 변경 기능을 추가해주세요.
각 항목의 상태는 "확인 전"과 "확인 완료" 두 가지입니다.
관리자가 버튼을 누르면 상태가 바뀌고, 상태에 따라 배지 색상이 다르게 보이게 해주세요.
다른 기능은 변경하지 마세요.

디자인 수정 프롬프트

전체 디자인을 업무용 SaaS 느낌으로 정리해주세요.
흰 배경, 연한 회색 구분선, 파란색 포인트 컬러를 사용해주세요.
카드는 너무 둥글지 않게 하고, 표와 목록이 읽기 쉽게 간격을 정리해주세요.
기능 동작은 바꾸지 말고 시각 디자인만 수정해주세요.

모바일 우선 디자인으로 개선해주세요.
스마트폰 화면에서는 입력 폼과 버튼이 한 줄에 너무 좁게 붙지 않도록 세로로 배치해주세요.
버튼은 엄지손가락으로 누르기 쉽게 크게 만들고, 목록 카드는 한 화면에 자연스럽게 쌓이게 해주세요.

공공기관 보고서 느낌으로 디자인을 바꿔주세요.
튀는 색상은 줄이고, 제목과 항목 구분이 명확하게 보이게 해주세요.
표, 카드, 입력 폼의 글자 크기를 읽기 편하게 조정해주세요.

오류 수정 프롬프트

문제가 있습니다.
후기 제출 폼에서 내용을 입력하고 제출 버튼을 눌러도 관리자 목록에 새 항목이 보이지 않습니다.

재현 순서:
1. 첫 화면에서 이름과 강의명, 만족도, 후기를 입력합니다.
2. 제출 버튼을 누릅니다.
3. 관리자 목록 화면으로 이동합니다.
4. 방금 제출한 후기가 보이지 않습니다.

원인을 먼저 설명하고, 기존 디자인은 유지한 채 저장과 목록 표시가 연결되도록 수정해주세요.

모바일 화면에서 카드 목록이 오른쪽으로 삐져나갑니다.
특히 긴 문장이 들어간 후기 카드에서 문제가 보입니다.
화면 너비에 맞게 줄바꿈되도록 수정하고, 가로 스크롤이 생기지 않게 해주세요.
기존 기능은 변경하지 마세요.

삭제 버튼을 누르면 항목이 삭제되지만, 새로고침하면 다시 나타납니다.
현재 데이터 저장 방식이 어떻게 되어 있는지 먼저 설명해주세요.
그다음 새로고침 후에도 삭제 상태가 유지되도록 수정해주세요.
필요한 경우 데이터 저장 방식 변경이 필요한지 알려주세요.

흔한 실수와 고치는 방법

Lovable에서 초보자가 자주 겪는 문제는 도구가 어려워서라기보다 요청 방식이 너무 크거나 모호해서 생깁니다.

첫 번째 실수는 한 번에 큰 앱을 요구하는 것입니다. "수강생 관리, 결제, 출석, 과제, 알림, 통계, 관리자 권한이 있는 학원 운영 앱을 만들어줘"라고 하면 결과가 그럴듯해 보여도 어딘가 엉성할 가능성이 큽니다. 고치는 방법은 간단합니다. 먼저 후기 수집, 예약 문의, 출석 체크처럼 한 흐름만 떼어냅니다.

두 번째 실수는 결과가 마음에 들지 않는다고 처음부터 다시 생성하는 것입니다. 처음 생성된 앱의 70~80%가 괜찮다면 버리지 말고 고쳐야 합니다. 계속 새로 만들면 좋은 부분까지 잃어버립니다. "헤더 높이만 줄여줘", "삭제 확인창만 추가해줘"처럼 부분 수정이 더 안전합니다.

세 번째 실수는 "예쁘게 해줘", "더 전문적으로 해줘"처럼 모호하게 말하는 것입니다. 예쁜 것이 무엇인지 사람마다 다릅니다. "업무용 SaaS 느낌", "흰 배경과 파란색 포인트", "카드 간격 24px 정도", "모바일에서 버튼 크게"처럼 기준을 줘야 합니다.

네 번째 실수는 백엔드를 너무 빨리 붙이는 것입니다. 화면 구조도 안정되지 않았는데 로그인과 데이터베이스를 먼저 연결하면, 이후 되돌리거나 수정할 때 더 복잡해질 수 있습니다. 먼저 프론트엔드, 즉 사용자가 보는 화면과 기본 동작을 정리하고, 그다음 저장과 로그인으로 넘어가는 편이 좋습니다.

다섯 번째 실수는 배포 후 보안을 확인하지 않는 것입니다. 특히 API 키, 환경변수, 개인정보는 조심해야 합니다. 환경변수는 금고 비밀번호처럼 다뤄야 합니다. 앱 화면이나 공개 코드에 그대로 보이면 안 됩니다.

배포 전 Lovable 점검 체크리스트

Lovable에서 배포 버튼을 누르기 전에는 잠깐 멈춰야 합니다. 배포는 어렵지 않지만, 공개 링크가 생긴다는 것은 다른 사람이 볼 수 있다는 뜻입니다.

다음 항목을 확인해보세요.

• 버튼이 모두 작동하는가?

• 입력한 데이터가 목록에 정상적으로 보이는가?

• 새로고침 후 데이터가 사라져도 되는 앱인가, 아니면 저장이 필요한 앱인가?

• 모바일 화면에서 입력창과 버튼이 깨지지 않는가?

• 한국어 문구가 어색하지 않은가?

• 삭제 기능에 확인창이 있는가?

• 개인정보를 꼭 필요한 만큼만 받고 있는가?

• 관리자 화면을 아무나 볼 수 있는 구조는 아닌가?

• API 키나 비밀 정보가 화면에 노출되지 않는가?

• 공유 링크를 다른 브라우저나 휴대폰에서 열어봤는가?

특히 "관리자 화면을 아무나 볼 수 있는가?"는 초보자가 자주 놓치는 부분입니다. 후기 수집 앱이나 예약 문의 앱에서 관리자 화면이 공개되어 있으면 다른 사람의 이름, 연락처, 문의 내용이 노출될 수 있습니다. 개인용 MVP라면 괜찮을 수 있지만, 실제 사용자를 받는 순간부터는 권한 관리가 필요합니다.

오늘의 실습 미션: Lovable로 작은 앱 하나 끝까지 가보기

이번 장의 미션은 복잡하지 않습니다. 아래 세 가지 중 하나를 골라 Lovable에서 첫 버전을 만들어보세요.

• 독서 기록 앱: 책 제목, 저자, 한 줄 메모, 별점을 저장하고 목록으로 보기

• 강의 후기 수집 앱: 수강생이 후기를 제출하고 관리자가 목록으로 보기

• 예약 문의 앱: 고객이 예약 희망일과 문의 내용을 남기고 관리자가 확인하기

처음 프롬프트는 아래 템플릿을 사용하면 됩니다.

나는 [나의 상황]입니다.
[사용자]를 위한 [앱 이름]을 만들고 싶습니다.

이 앱의 목적은 [해결하려는 문제]입니다.

첫 버전에는 다음 기능만 넣어주세요.
1. [핵심 기능 1]
2. [핵심 기능 2]
3. [핵심 기능 3]

화면 구성은 다음과 같이 해주세요.
- 첫 화면: [주요 입력 또는 목록 화면]
- 두 번째 화면: [관리자 또는 상세 화면이 필요하면 작성]

디자인은 [원하는 분위기] 느낌으로 해주세요.
모바일에서도 편하게 사용할 수 있게 해주세요.

처음 버전에서는 [제외할 기능]은 넣지 마세요.
MVP로 작게 만들어주세요.

작업 전에 이해가 안 되는 부분이 있으면 먼저 질문해주세요.

생성된 뒤에는 반드시 세 번 이상 수정해보세요. 예를 들어 첫 번째는 문구 수정, 두 번째는 기능 수정, 세 번째는 모바일 디자인 수정으로 나누면 좋습니다. 이 반복이 Lovable을 배우는 핵심입니다.

한 장 요약

Lovable은 비개발자가 첫 MVP를 만들어보기에 적합한 앱 빌더형 도구입니다. 자연어 프롬프트로 시작하고, 미리보기에서 확인하고, 대화로 수정하고, 필요하면 백엔드와 배포까지 이어갈 수 있습니다.

하지만 Lovable이 모든 것을 대신 책임져주지는 않습니다. 결제, 로그인, 권한 관리, 개인정보, API 키, 환경변수처럼 서비스 운영에 가까운 요소는 반드시 사람이 확인해야 합니다. 특히 누가 어떤 데이터를 볼 수 있는지, 비밀 정보가 노출되지 않는지는 배포 전에 꼭 점검해야 합니다.

Lovable 활용 전략의 핵심은 도구 사용법을 외우는 것이 아닙니다. "MVP로 작게 요청하기 → 결과를 직접 확인하기 → 문제를 구체적으로 설명해 수정 요청하기 → 필요할 때만 백엔드와 배포를 확장하기"라는 제작 순서를 몸에 익히는 것입니다.

첫 앱은 작아도 됩니다. 오히려 작아야 끝까지 갈 수 있습니다. 그리고 한 번 끝까지 가본 사람은 두 번째 앱에서 훨씬 덜 겁먹습니다. 이제 다음 장에서는 Replit Agent를 살펴보며, Lovable보다 조금 더 개발 환경에 가까운 도구에서는 어떤 점이 달라지는지 비교해보겠습니다.

참고

¹Quick start - Lovable Documentation

²Lovable 공식 사이트

³Quick start - Lovable Documentation

⁴Quick start - Lovable Documentation

⁵Lovable Best Practices 정리

⁶Lovable Best Practices 정리