Lovable Cloud — SKILL.md

---
name: "Lovable Cloud"
description: "Use Lovable Cloud for backend infrastructure — built-in hosting, serverless functions, database, AI features, usage monitoring, and publishing. For browser automation of Lovable's cloud platform."
version: "1.0.0"
author: "skynet"
category: "dev"
agents: ["claude-code"]
tags: ["lovable", "cloud", "backend", "hosting", "deployment", "browser-automation"]
tools_required: ["chrome-mcp"]
---

# Lovable Cloud

# Lovable Cloud

Lovable Cloud provides built-in backend infrastructure for your projects — hosting, serverless functions, and AI features, all managed through the Lovable UI.

## Prerequisites

- Chrome MCP browser tools available
- Logged in to lovable.dev with a project

## What is Lovable Cloud?

Lovable Cloud is the built-in backend that comes with every Lovable project. It includes:
- **Hosting**: Automatic deployment and hosting of your app
- **Serverless functions**: Backend logic without managing servers
- **AI features**: Built-in AI capabilities for your app
- **Database**: When connected with Supabase via connectors

## Cloud & AI Balance

Monitor and manage your cloud usage.

```
1. Navigate to: lovable.dev/projects/<id>/settings/usage
2. Or: Settings sidebar > Cloud & AI balance
3. The page shows:

   Cloud + AI overview:
   - Monthly included usage resets on the 1st of each month
   - Top-up balance (for overage)
   - "Top up" button to add credits

   Cloud usage:
   - Free balance used / total (e.g., $0 / $25)
   - Top-ups used

   AI usage:
   - Free balance used / total (e.g., $0 / $1)
   - Top-ups used

   Project breakdown:
   - Expandable section showing per-project usage
```

## Publishing Your App

Publishing makes your app live on the internet.

```
1. In the project editor, find the "Publish" button in the top-right corner
2. Click "Publish"
3. Your app is now live and accessible via:
   - Lovable preview URL (always available)
   - Custom domain (if configured in Domains settings)
4. Each publish creates a new deployment
```

## Preview vs Published

- **Preview** (green "Preview" button in toolbar): Shows the current state of your project in the editor. Always available.
- **Published**: The live version accessible to the public. Must explicitly click "Publish" to update.

## Cloud Backend Features

When you tell Lovable to build features that need a backend, it uses Cloud automatically:

```
Examples of what triggers Cloud usage:
- "Add user authentication" -> uses Cloud for auth
- "Create an API endpoint" -> uses Cloud serverless functions
- "Store data in a database" -> uses Cloud + Supabase connector
- "Add AI-powered features" -> uses Cloud AI
- "Set up file uploads" -> uses Cloud storage
```

## Managing Cloud Costs

```
1. Each plan includes free monthly Cloud + AI usage
2. Free tier resets on the 1st of each month
3. If you exceed the free tier, you can:
   - Top up credits via the "Top up" button
   - See invoice history and manage payments
4. Monitor per-project usage in the "Project breakdown" section
```

## Workspace Domains

Manage domains at the workspace level (across all projects).

```
1. Go to Settings > Workspace domains
2. Configure domains that can be shared across projects
3. Individual project domains are managed in each project's Domains settings
```

## Browser Automation Tips

### Publishing
The "Publish" button is in the top-right of the project editor toolbar. Use find:
```
find: "Publish button"
```

### Cloud Balance Page
Direct URL: lovable.dev/projects/<id>/settings/usage

### Top Up
The "Top up" button opens a payment flow. Use with caution — this involves real money.

## Running on Mac Minis

These instructions can also be executed on the Mac Minis (bots, vault, jarvis) using the mac-control MCP server instead of chrome-in-chrome.

### Via mac-control MCP Server (Port 8200)

The mac-control server on each Mac exposes the same GUI automation primitives:

```bash
# Take a screenshot to see the screen
curl -s http://bots.local:8200/tools/screenshot

# Open a URL in Chrome
curl -s http://bots.local:8200/tools/open_url -d '{"url": "https://lovable.dev/dashboard"}'

# Click at screen coordinates
curl -s http://bots.local:8200/tools/click -d '{"x": 500, "y": 300}'

# Type text
curl -s http://bots.local:8200/tools/type_text -d '{"text": "Build a landing page..."}'

# Press keyboard shortcut
curl -s http://bots.local:8200/tools/key_press -d '{"keys": "return"}'

# Run AppleScript
curl -s http://bots.local:8200/tools/applescript -d '{"script": "tell app \\"Google Chrome\\" to activate"}'

# Find text on screen (OCR)
curl -s http://bots.local:8200/tools/find_on_screen -d '{"text": "Submit"}'
```

### Via Chrome DevTools Protocol (Port 9222)

For direct browser control without GUI coordinates:

```bash
# List open tabs
curl -s http://bots.local:9222/json

# Navigate a tab to a URL
curl -s http://bots.local:9222/json/new?https://lovable.dev/dashboard

# Execute JavaScript in a tab (via WebSocket — use a CDP client)
```

### Via SSH + cliclick (Simple Fallback)

```bash
# Open URL
ssh bots 'open https://lovable.dev/dashboard'

# Wait for page load
sleep 3

# Screenshot + analyze
ssh bots 'screencapture /tmp/screen.png'
scp bots:/tmp/screen.png ./screen.png

# Click at coordinates
ssh bots '/opt/homebrew/bin/cliclick c:500,300'

# Type text
ssh bots '/opt/homebrew/bin/cliclick t:"Build a landing page..."'

# Submit
ssh bots '/opt/homebrew/bin/cliclick kp:return'
```

### Recommended Machine

Use **bots** (192.168.86.50) for browser automation — it has full GUI support, screencapture works, and Chrome with remote debugging is running.