러버블(Lovable) 입문 가이드: AI로 웹앱 만들고 배포까지, 백엔드 연결이 핵심

핵심 메시지

• 러버블은 자연어로 지시하면 리액트 기반 웹 앱을 만들어주는 AI 앱 빌더로, 코드를 보지 않고도 화면과 기능을 만들 수 있다.
• 가장 중요한 선택은 첫 프롬프트를 넣기 전에 이뤄진다. 러버블이 관리하는 내장 클라우드 대신 자기 이름으로 만든 슈파베이스 계정을 연결해야 나중에 데이터를 들고 나올 수 있다.
• 첫 프롬프트는 무엇을 만드는지, 누가 쓰는지, 지금 만들 것과 만들지 말 것, 디자인 방향을 나눠서 적는 구조가 좋다.
• 로그인, 데이터베이스, 실시간 갱신, 파일 업로드, AI 요약 기능, 결제까지 대부분 대화로 붙일 수 있지만, 구글 로그인처럼 외부 설정이 필요한 단계는 직접 따라 해야 한다.
• 공개 전에는 행 수준 보안 설정과 보안 점검을 확인해야 한다. 데이터를 누가 읽고 고칠 수 있는지를 정하는 것이 이 구조의 안전장치다.

쉽게 이해하기

러버블은 자연어 지시만으로 웹 애플리케이션을 만들어주는 AI 앱 빌더다. 리액트와 HTML, 자바스크립트로 된 결과물을 대신 작성해주기 때문에 코드를 몰라도 화면을 만들 수 있고, 개발자라면 코드를 그대로 깃허브로 내보내 직접 손볼 수도 있다. 영상에서는 피드백 게시판 앱을 처음부터 만들어 실제 주소로 배포하는 전 과정을 다뤘다.

영상이 가장 강조한 대목은 첫 프롬프트를 넣기 전에 백엔드를 연결하라는 것이다. 러버블은 기본적으로 자체 클라우드 환경에 데이터베이스를 만들어주는데, 이 경우 사용자가 그 데이터베이스에 직접 접근하거나 나중에 다른 곳으로 옮기기 어렵다. 반면 자기 계정으로 만든 슈파베이스 프로젝트를 연결해두면 러버블이 알아서 관리하면서도 소유권은 사용자에게 남는다. 나중에 바꿀 수 없는 선택이라는 점에서 시작 단계의 판단이 중요하다.

프롬프트를 쓰는 방식에도 요령이 있다. 앱이 무엇인지, 누가 쓰는지, 지금 단계에서 무엇을 만들고 무엇은 만들지 말지, 그리고 원하는 디자인 방향까지 나눠 적으면 결과가 안정된다. 큰 변경을 요청할 때는 곧바로 실행시키지 말고 계획 모드로 전환해 무엇을 할 것인지 먼저 받아 보고 검토한 뒤 승인하는 편이 안전하다. 결과가 마음에 들지 않으면 기록을 통해 이전 버전으로 되돌릴 수도 있다.

기능을 붙이는 과정은 대체로 대화로 진행된다. 구글 로그인과 데이터베이스 구조를 요청하고, 실시간 갱신을 켜고, 파일 첨부에 개수와 용량 제한을 두고, 관리자 화면에 AI 요약 버튼을 만드는 식이다. AI 요약처럼 연산이 필요한 기능은 백엔드에서 실행되는 함수로 만들어지며, 필요한 인증 키가 자동으로 준비돼 별도 설정 없이 동작했다. 다만 구글 로그인처럼 외부 콘솔에서 직접 설정해야 하는 단계는 안내를 따라 사용자가 처리해야 한다.

공개 직전에 챙길 것은 보안이다. 데이터베이스 테이블마다 누가 무엇을 읽고 고칠 수 있는지 정하는 행 수준 보안 규칙이 자동으로 만들어지는데, 이 규칙이 사실상 데이터를 지키는 울타리다. 러버블에도 보안 점검 기능이 있어 발견된 문제를 정리해 보여준다. 점검을 마치면 발행 버튼으로 바로 배포되고, 유료 요금제에서는 직접 구매한 도메인을 연결할 수 있다.

주요 인사이트

• AI 앱 빌더의 실질적 잠금 장치는 코드가 아니라 데이터다. 화면 코드는 언제든 내보낼 수 있지만, 데이터베이스가 플랫폼 내부 환경에 묶여 있으면 이전이 어려워진다. 시작할 때 백엔드 소유권을 확보해두는 선택이 그래서 중요하다.
• 화면이 그럴듯하게 보이는 것과 앱이 실제로 동작하는 것은 다르다. 영상에서도 첫 결과물은 글을 올리면 화면에는 나타나지만 새로고침하면 사라졌다. 백엔드를 붙이기 전까지는 겉모습만 있는 상태라는 점을 분명히 보여준다.
• 대화로 만드는 방식에도 개발의 기본 개념은 그대로 필요하다. 데이터베이스 구조나 권한, 개발용과 운영용 환경 분리 같은 용어를 알고 요청할수록 결과가 정확해진다는 점이 반복해서 드러났다.
• AI가 만들어준 첫 디자인은 대체로 어디선가 본 듯한 모습이 되기 쉽다. 영상에서는 내장된 재디자인 기능을 써서 원하는 분위기를 따로 지시하는 방식으로 이를 바로잡았다.

자주 묻는 질문

관련 AI 소식