Model Context Protocol로 AI 에이전트와 개발 도구를 Lovable에 연결해 앱을 프로그래밍 방식으로 빌드·반복·배포합니다.
Lovable MCP 서버
Model Context Protocol로 AI 에이전트와 개발 도구를 Lovable에 연결해 앱을 프로그래밍 방식으로 빌드·반복·배포합니다.
Lovable MCP 서버란?
Lovable은 https://mcp.lovable.dev에서 Model Context Protocol(MCP) 서버를 제공합니다. AI 클라이언트가 자연어로 Lovable 프로젝트를 관리할 수 있습니다.
연결된 AI 에이전트는 현재 사용하는 클라이언트를 벗어나지 않고 프로젝트 생성, Lovable에 메시지 전송, 코드 검사, 앱 배포 등을 수행합니다. Lovable MCP 서버는 모든 플랜에서 사용할 수 있습니다.
이 기능은 Lovable 에이전트가 사용자의 도구에 연결하는 채팅 커넥터(MCP 서버)와 다릅니다. Lovable MCP 서버는 외부 에이전트가 Lovable에 연결되도록 합니다.
MCP란?
MCP(Model Context Protocol)는 AI 에이전트가 외부 도구를 검색하고 호출할 수 있게 하는 공개 표준입니다. Lovable MCP 서버는 Lovable을 검색·호출·조합 가능한 도구로 제공합니다.
지원되는 AI 클라이언트
현재 OAuth 흐름은 다음 클라이언트로 제한됩니다.
- ChatGPT
- Claude(macOS·Windows용 Claude Desktop 및 claude.ai)
- Claude Code
- Cursor
- VS Code
현재 다른 MCP 클라이언트는 OAuth 흐름을 완료할 수 없습니다. 이 페이지에서는 위 앱을 '클라이언트'라고 부릅니다.
작동 흐름
- 에이전트가 Lovable MCP 서버에 연결합니다.
- 에이전트가 빌드 설명과 함께
create_project같은 도구를 호출합니다. - Lovable이 프로젝트를 빌드하고 프리뷰 URL을 반환합니다.
- 프리뷰를 검토하고 메시지를 더 보내 반복 작업을 계속합니다.
- 에이전트가 기능 추가, 문제 수정, 디자인 변경을 수행합니다.
- 결과가 만족스러우면
deploy_project로 게시합니다. 게시는 선택 사항입니다.
대상 사용자
- AI 클라이언트나 에디터를 떠나지 않고 Lovable 프로젝트를 만들고 반복하려는 ChatGPT, Claude Code, Cursor, VS Code 사용자
- 콘텐츠 생성, UI 스캐폴딩, 배포, URL 전달처럼 더 큰 에이전트 흐름에 Lovable을 포함하려는 팀
Lovable MCP 서버를 사용하는 이유
- 에이전트 기반 개발: 자연어로 Lovable 프로젝트를 스캐폴딩하고 반복합니다.
- 코드 검사: 프로젝트 파일과 diff, 편집 기록을 프로그래밍 방식으로 읽습니다.
- 도구 간 워크플로: 하나의 에이전트 세션에서 Lovable과 다른 MCP 도구를 조합합니다.
일반적인 사용 사례
| 시나리오 | 에이전트 프롬프트 예시 | 결과 |
|---|---|---|
| 새 앱 스캐폴딩 | 사용자 피드백 폼이 있는 'Feedback Hub' Lovable 프로젝트를 만들어줘 | 프로젝트 생성 및 첫 빌드 완료 |
| 기존 프로젝트 반복 | 내 프로젝트 [ID]에 다크 모드 토글을 추가해줘 | 에이전트가 메시지를 보내고 Lovable 완료까지 대기 |
| 최근 변경 검토 | 프로젝트의 최근 편집 세 건에서 바뀐 내용을 보여줘 | 최근 커밋의 unified diff 반환 |
| 앱 배포 | 프로젝트 [ID]를 배포하고 라이브 URL을 알려줘 | 프로젝트 게시 및 라이브 URL 반환 |
| 코드베이스 검사 | 모든 파일을 나열하고 기본 App.tsx를 읽어줘 | 파일 트리 및 내용 반환 |
| 여러 변형 비교 | 서로 다른 레이아웃과 스타일의 랜딩 페이지 세 개를 만들고 모두 배포해 URL을 알려줘 | 비교할 배포 프로젝트 세 개 반환 |
사전 준비 사항
- 모든 플랜의 Lovable 계정
- 외부 클라이언트 연결을 허용하는 워크스페이스의 타사 MCP 클라이언트 접근
- Free, Pro, Business에서는 기본 활성화
- Enterprise에서는 기본 비활성화. Admin 또는 owner가 Settings → Security → Privacy & security의 Third-party MCP clients에서 활성화할 수 있습니다.
- 지원되는 AI 클라이언트 중 하나
연결 전 확인 사항
연결한 클라이언트에는 사용자와 같은 계정 접근 권한이 부여됩니다.
- 범위는 프로젝트 하나가 아니라 전체 계정입니다. 접근 가능한 모든 프로젝트를 나열·읽기·편집할 수 있습니다.
- 호출은 실제 계정에서 실행됩니다. 실제 크레딧을 사용하고 실제 프로젝트를 편집합니다.
deploy_project는 앱을 배포하고 라이브 URL을 반환합니다. Free 및 Pro 플랜에서는 링크가 있는 누구나 앱에 접근할 수 있습니다. Business 및 Enterprise 플랜에서는 웹사이트 접근이 워크스페이스 기본값을 따르며, 내부 게시가 구성되어 있으면 URL이 워크스페이스 멤버로 제한될 수 있습니다.query_database는 전체 데이터베이스 권한으로 SQL을 실행합니다. 읽기, 쓰기, 스키마 변경을 모두 포함합니다.
연결 방법
Lovable MCP 서버는 OAuth를 사용합니다. 처음 연결할 때 클라이언트가 브라우저를 열어 Lovable 계정 인증을 요청합니다.
워크스페이스 admin과 owner는 Lovable의 Settings → Build & deploy → MCP server에서도 서버 URL, 일반 클라이언트 설정 단계, Third-party MCP clients 설정의 Manage access 바로 가기를 확인할 수 있습니다.
아래에서 사용하는 클라이언트를 선택하세요.
사용 가능한 도구
도구 호출은 Lovable 계정 권한으로 실제 프로젝트에 실행됩니다.
매개변수를 포함한 기계 판독용 참조는 mcp.lovable.dev/skill.md에 있습니다. 서버와 함께 관리되므로 현재 도구와 일치합니다. 스킬, Claude Code 플러그인, 설정 가이드는 lovablelabs/mcp에 공개되어 있습니다.
ID 및 워크스페이스
| 도구 | 설명 |
|---|---|
get_me | 인증된 사용자 프로필과 워크스페이스 조회 |
list_workspaces | 속한 워크스페이스 목록 조회 |
get_workspace | 플랜, 크레딧 잔액, 멤버 수, 설정을 포함한 상세 정보 조회 |
프로젝트
| 도구 | 설명 |
|---|---|
list_projects | 필터와 전체 텍스트 검색으로 프로젝트 검색·목록 조회 |
get_project | 에디터 URL, 프리뷰 URL, 현재 화면 스크린샷을 포함한 상세 정보 조회 |
create_project | 빌드 프롬프트인 initial_message로 프로젝트 생성. 템플릿·디자인 시스템 선택 가능 |
deploy_project | lovable.app 프로덕션 호스팅에 게시하고 라이브 URL 반환 |
remix_project | 기존 프로젝트를 워크스페이스로 복사. 원본 프로젝트는 워크스페이스에서 접근할 수 있어야 함(자신의 워크스페이스 프로젝트, 템플릿, 공개 remix가 허용된 프로젝트) |
set_project_visibility | 공유 대화 상자 옵션에 맞춰 에디터에서 프로젝트에 접근할 수 있는 사람을 설정: private(워크스페이스 대상, Can edit, 기본값), workspace_view(워크스페이스 대상, Can view, Business 또는 Enterprise 필요), draft(Restricted, 프로젝트에 초대된 사람만, Business 또는 Enterprise 필요). 게시된 앱 방문자가 아니라 에디터 접근만 제어 |
set_folder_visibility | 폴더를 개인 또는 워크스페이스 공개 범위로 설정 |
move_projects_to_folder | 최대 30개 프로젝트를 워크스페이스 폴더로 이동 |
list_template_projects | 사용할 수 있는 프로젝트 템플릿 목록 조회 |
list_design_systems | 워크스페이스의 디자인 시스템 목록 조회 |
에이전트 상호 작용
| 도구 | 설명 |
|---|---|
send_message | 프로젝트 AI 에이전트에 메시지를 보내고 응답 대기. plan_mode, files, wait=false 지원 |
get_message | 메시지 상태와 내용 조회 |
list_messages | 프로젝트의 최근 메시지를 최신순으로 조회 |
지식 및 스킬
| 도구 | 설명 |
|---|---|
get_workspace_knowledge | 워크스페이스 지식 조회 |
set_workspace_knowledge | 워크스페이스 지식 전체 교체 |
get_project_knowledge | 프로젝트 지식 조회 |
set_project_knowledge | 프로젝트 지식 전체 교체 |
list_workspace_skills | 워크스페이스 스킬 목록 조회 |
get_workspace_skill | 워크스페이스 스킬 전체 내용 조회 |
create_workspace_skill | Admin·owner가 워크스페이스 스킬 생성 |
update_workspace_skill | Admin·owner가 워크스페이스 스킬 수정 |
delete_workspace_skill | Admin·owner가 스킬을 영구 삭제 |
코드 검사
| 도구 | 설명 |
|---|---|
get_diff | 메시지 또는 commit SHA의 unified diff 조회 |
list_files | 특정 git ref의 전체 파일 목록 조회 |
read_file | 특정 git ref의 파일 하나 읽기 |
list_edits | 프로젝트 편집 기록을 페이지 단위로 조회 |
Cloud 데이터베이스
| 도구 | 설명 |
|---|---|
get_database_status | 프로젝트의 Lovable Cloud 활성화 상태 확인 |
enable_database | Lovable Cloud 활성화. 30~60초 소요 |
query_database | 읽기·쓰기·스키마 변경을 지원하는 SQL 실행 |
커넥터
| 도구 | 설명 |
|---|---|
list_connectors | 워크스페이스의 표준·seamless·MCP 커넥터와 활성화 상태 조회 |
list_connections | 인증된 커넥터 계정 목록 조회 |
list_custom_connectors | 카탈로그 및 사용자 지정 MCP 커넥터 조회 |
list_available_connectors | 추가할 수 있는 주요 MCP 커넥터 템플릿 조회 |
add_connector | Lovable UI에서 커넥터를 추가할 대시보드 URL 반환 |
remove_connector | 워크스페이스에서 MCP 커넥터 제거 |
분석
| 도구 | 설명 |
|---|---|
get_project_analytics | 게시된 프로젝트의 기간별 분석 조회: 방문자, 페이지뷰, 이탈률, 세션 시간 및 페이지·소스·기기·국가 분류. start_date와 end_date(RFC 3339) 필요 |
get_project_analytics_trend | 실시간 방문자 수와 5분 추세 조회 |
파일 업로드
| 도구 | 설명 |
|---|---|
get_file_upload_url | 메시지 첨부용 파일 업로드 presigned URL 생성 |
클라이언트별 도구
일부 클라이언트에서만 다음 도구가 표시됩니다.
render_project_widget: ChatGPT 같은 MCP Apps 지원 클라이언트에서create_project뒤 실시간 빌드 진행 위젯 표시import-claude-design-from-url: Claude 클라이언트에서 Claude 디자인을 새 Lovable 프로젝트로 가져오기
스킬
스킬은 AI 클라이언트가 Lovable MCP 서버를 효과적으로 사용하는 방법을 알려주는 재사용 가능한 지침 파일입니다. 언제 호출하고 어떤 순서로 도구를 사용하며 어떤 패턴을 따를지 정의합니다.
Lovable은 mcp.lovable.dev/skill.md에 스킬을 게시합니다. 서버와 함께 관리되므로 현재 도구와 일치합니다. 파일을 다운로드해 Claude Code의 .claude/skills/lovable-mcp/SKILL.md 같은 클라이언트 스킬 또는 지침 디렉터리에 추가하세요.