메인 콘텐츠로 바로 가기

로블로브와 비트 코딩 빌더들을 위한

로블로브 앱을 iOS 및 Android 앱으로 변환

GitHub으로 로블로브 프로젝트를 내보내고 Capacitor으로 wrapping하고 Capgo 빌드를 사용하여 서명된 스토어 앱을 빌드합니다. 출시 후, 로블로브에서 각 푸시가 설치된 앱으로 live update를 통해 GitHub 액션을 통해 전달됩니다.

GitHub
Lovable, Capacitor, CI
2–3분
native 빌드
실시간 업데이트
Lovable에서 각 Public에 따라

Lovable 프로젝트

웹 앱을 prompts와 visual edits로 빌드하고 GitHub을 연결하여 code을 리포지토리에 저장합니다.

__CAPGO_KEEP_0__ export

Capacitor 셸

리포지토리를 클론하고 정적 dist 폴더를 빌드한 다음 iOS와 Android 프로젝트에 Capacitor을 추가합니다.

빌드 및 업데이트

Capgo 모바일 개발 루프

Capgo으로 서명된 바이너리를 빌드하세요. 빌드 후 GitHub에서 웹 변경 사항을 실시간으로 업데이트하여 배포하세요.

문제

Lovable 앱을 빌드합니다. 스토어는 더 많은 것을 필요로합니다.

앱은 브라우저에서 멈춥니다.

Lovable 프로젝트는 웹 앱입니다. 스토어 목록, 푸시 알림, 장치 기능은 모두 네이티브 셸을 필요로합니다.

Lovable는 네이티브 도구를 실행할 수 없습니다.

서명, Xcode, Android Studio, 스토어 업로드는 Lovable 외부에서 발생합니다. 리포지토리와 빌드 서비스가 필요합니다.

모든 변경 사항은 검토를 기다립니다.

첫 번째 스토어 릴리즈 후 각 새로운 버전은 스토어 검토를 다시 거치며, 24-48시간, 또는 더 오래 걸릴 수 있습니다.

스택

각 도구의 역할

Lovable의 웹 앱을 빌드합니다

스크린, 흐름, 복사본, 백엔드 wiring을 prompts와 함께 반복합니다. 단일 페이지 앱은 정적 dist 폴더를 wrapping하기 위해 제공합니다.

Capgo가 Capacitor을 wrapping합니다

GitHub은 code을 보유하고 있으며, Capacitor은 빌드된 웹 앱을 native iOS 및 Android 프로젝트에 추가합니다.

Capgo은 빌드 및 업데이트를 수행합니다

Capgo Build는 서명된 바이너리를 생성하고 스토어에 업로드합니다. Live updates는 설치된 앱에 최신 웹 변경 사항을 전송합니다.

해결책

Lovable에서 스토어까지의 Capgo 경로

Capgo 제품은 계속해서 제품을 개발하고 있습니다. Capacitor과 Capgo은 네이티브 빌드, 스토어 업로드 및 업데이트 단계를 추가합니다.

모바일로 가는 GitHub을 내보내고 Capacitor을 추가하세요

Lovable을 연결하고 GitHub을 복제한 후 정적 dist 폴더를 빌드하고 iOS 및 Android 프로젝트에 Capacitor을 추가합니다.

Capgo으로 만들기

Request signed iOS and Android builds from the CLI. iOS builds run on cloud Macs, and a typical build takes 2–3 minutes.

AI agent를 통해 릴리즈를 실행하세요

The Capgo MCP server lets Claude Code, Codex, or Cursor upload bundles, manage channels, and request builds. Capgo skills add Capgo-specific instructions for the agent.

모바일로 가는 진정한 감성의 개발

로블로블(Lovable) 개발자들은 Capgo을 통해 모바일 앱을 배포합니다.

로블로블 프로젝트에서 빌드와 라이브 업데이트를 저장합니다. 컴퓨터에서 이러한 명령을 실행하거나 코딩 에이전트가 이를 실행하도록 허용합니다.

  1. GitHub으로 내보내기 및 복제

    로블로블에서 GitHub을 연결합니다. 리포지토리를 복제하고 빌드가 dist 폴더에 index.html 파일을 생성하는지 확인합니다.

    git clone https://github.com/you/your-lovable-app.git
    cd your-lovable-app
    npm install
    npm run build
    로블로블에서 Capacitor 튜토리얼
  2. Capacitor 및 Capgo 추가

    Capgo 온보딩 가이드

    npm install @capacitor/core @capacitor/cli @capacitor/ios @capacitor/android
    npx cap init "Your App" com.company.app --web-dir dist
    npx cap add ios && npx cap add android
    npx @capgo/cli@latest init
    CLI 시작 가이드
  3. __CAPGO_KEEP_0__ 빌드 문서

    __CAPGO_KEEP_0__ 빌드

    npx @capgo/cli@latest build init
    npx @capgo/cli@latest build request --platform ios
    npx @capgo/cli@latest build request --platform android
    Capgo 빌드
  4. 로블로블을 통해 live update을 배포합니다.

    CAPGO_TOKEN을 GitHub 비밀번호로 추가하고 푸시 시 빌드 및 업로드를 위한 워크플로우를 설정하세요. 새로운 플러그인 또는 권한은 새로운 스토어 빌드를 필요로 합니다.

    # step in .github/workflows, with CAPGO_TOKEN from secrets
    npm ci && npm run build
    npx @capgo/cli@latest bundle upload --channel=production --auto-bump
    live update으로 Lovable Publish 가이드

AI agent 명령어

코딩 에이전트가 설정을 처리하세요

Lovable은 Capgo CLI를 실행할 수 없습니다. 로컬 코딩 에이전트인 Claude Code, Codex, 또는 Cursor에 이 코드를 복사한 후 붙여넣습니다. Capgo MCP 서버를 설치하고 Capacitor와 업데이터를 추가하며, 서명 대신 비밀을 발명하는 대신 TODO를 남깁니다.

코딩 에이전트에 대한 프롬프트

I want this project, exported from Lovable, to become a Capacitor mobile app using Capgo from the start.

Set up the project so an AI agent can use Capgo's MCP release tools through install-mcp:

1. Install the Capgo CLI MCP server for the active AI client. For Codex, run:
   - npx @capgo/cli@latest login
   - npx install-mcp 'npx @capgo/cli@latest mcp' --client codex
   Replace codex with cursor, claude-code, gemini-cli, or windsurf if that is the client this project uses.
2. Read Capgo's public MCP metadata when tool details are needed:
   - https://capgo.app/.well-known/mcp/server-card.json
   - https://capgo.app/.well-known/agent-skills/capgo-cli-mcp/SKILL.md
   If this client supports agent skills, also run: npx skills add Cap-go/capgo-skills
3. Add a short docs/agent-mobile-release.md file that tells the agent to use the Capgo CLI MCP server as a local stdio server, not a remote HTTP endpoint.
4. Add Capacitor for iOS and Android using the package manager already used by this project.
5. Configure capacitor.config.ts with:
   - appName: the current Lovable app name
   - appId: a production-style bundle ID I can edit later, such as com.company.app
   - webDir: the production build output folder
   - plugins.CapacitorUpdater.defaultChannel: production
6. Install and configure @capgo/capacitor-updater.
7. Add package scripts for:
   - building the web app
   - syncing Capacitor
   - uploading a production Capgo bundle
   - starting Capgo Build setup for iOS
   - requesting an iOS cloud build
8. Create a first production channel plan:
   - production for users
   - preview for stakeholder review
   - staging for internal testing
9. Keep normal docs and README commands copy-pasteable with npm/npx unless this project already uses another package manager. Keep the Capgo MCP install command exactly as shown above.
10. Do not fake native signing credentials. Leave clear TODOs for the Capgo API key, Apple team details, and bundle ID.
11. After making changes, summarize exactly what changed and what command I should run next.

Capacitor로 빌드된 앱

템플릿 및 학습 제품은 자연스럽게 모바일 후보가 됩니다

생성 및 학습 앱은 웹 스타일의 흐름이 저장할 수 있는 모바일 경험으로 변할 때 패키징, 서명 및 업데이트가 깨끗하게 처리되는 것을 보여줍니다.

초대 카드 디자인 앱 아이콘 EVENTS

초대 카드 디자인

응답형 웹에서 모바일로 자연스럽게 매핑되는 템플릿 기반 디자인 흐름

구글 플레이 설치
20,000,000
스토어 평점
4.6
무한 일본어 앱 아이콘 교육

무한 일본어

작은 수업과 온보딩 개선이 누적되는 학습 앱

구글 플레이 설치
1.8M
스토어 평점
4.6
StudySmarter - 학교 & 대학 앱 아이콘 교육

StudySmarter - 학교 & 대학

웹 제품의 반복이 모바일 패키징 이후에도 계속될 수 있는 학습 워크플로.

구글 플레이 설치
6,500,000
스토어 평점
4.8

고객 증명

Capgo를 사용하는 개발 팀이 평가한 것

5.0/5 팀 9,400+ 리뷰를 읽으십시오 __CAPGO_KEEP_0__

Korean

/ko/solutions/lovable-vibecoding-to-mobile/

“Capgo Build helped us simplify our Capacitor app release process. We can build and ship iOS and Android apps from one clear workflow.”

Kapil

K

Kapil

NuTriQ의 창립자

“제품을 OTA로 즉시 업데이트할 수 있는 기능은 앱 스토어의 전체 리뷰 사이클을 기다리지 않고 운영상의 큰 이점이었습니다.”

Luis Dominguez의 초상화

“Capgo을 사용하기 시작한 후 모든 것이 더 빠르며, 사용자에게 필요한 시간을 제공할 수 있게 되었고, 일상 생활을 무시하지 않도록 해 주었습니다.”

FAQ

질문하는 Lovelable 개발자들

Lovable을 모바일 앱으로 출시하는 데 필요한 짧은 답변

Lovable은 App Store로 직접 게시할 수 있나요?

아니요. Lovable은 웹 앱을 빌드합니다. export하여 GitHub에 넣고, Capacitor으로 wrapping하고, Capgo Build를 사용하여 iOS와 Android 앱을 빌드하고, App Store Connect와 Google Play에 업로드합니다.

Lovable을 Capacitor로 변환하는 튜토리얼

Mac이나 Xcode가 필요하나요?

아니요. Capgo Build는 클라우드 Mac 머신에서 iOS 빌드를 실행합니다. App Store와 Android용 Google Play 개발자 계정도 필요합니다.

Capgo Build 문서

__CAPGO_KEEP_0__ Build는 Lovable에서 변경 사항을 모바일 앱에 반영할 수 있나요?

Yes, 웹-layer 변경 사항에 대해. GitHub 동기화가 활성화된 경우, Publish는 커밋을 푸시하고, GitHub 액션은 업로드를 위한 번들 업로드를 시작하고, 설치된 앱은 업데이트 다운로드를 시작합니다. 새로운 플러그인 또는 권한은 새로운 스토어 빌드를 필요로 합니다.

Lovable Publish를 live update에 대한 안내

내 Lovable 프로젝트는 Next.js를 사용합니다. 작동합니까?

Yes, 정적 내보내기와 함께. Capacitor의 webDir를 out 폴더로 대신 dist 폴더로 설정하면 Vite의 싱글 페이지 앱은 그대로 작동합니다.

Next.js와 Capacitor

AI agent가 릴리스 단계를 처리할 수 있나요?

Yes. npx @capgo/cli mcp starts a local MCP server that Claude Code, Codex, or Cursor can use to upload bundles, manage channels, and request builds. Capgo skills add Capgo-specific instructions for the agent.

Capgo MCP 서버

Lovable 앱을 스토어에 배포하세요

14일 무료试用을 시작하고, 프로젝트를 GitHub로 내보내고, CLI에서 첫 번째 iOS 및 Android 빌드를 요청하세요.