> ## Documentation Index
> Fetch the complete documentation index at: https://docs.goguava.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Adding a Guava Voice Agent to a Lovable App

> Deploy a Guava agent and build a Lovable frontend that talks to it over WebRTC

A Guava WebRTC integration has two parts:

1. **A hosted agent** that handles the conversation.
2. **Frontend code** that dials the agent from the browser using the [WebRTC SDK](/guides/webrtc-calls).

Guava agents currently run as long-running worker processes, which Lovable doesn't support. We recommend writing your agent in TypeScript and deploying it with [Guava's managed deployments](/guides/deployment), then having Lovable build the frontend.

<Note>
  Guava is planning support for Function-as-a-Service platforms, which will let you host agents directly in Lovable.
</Note>

<Tip>
  Just want a voice button on your site? The [drop-in widget](/guides/webrtc-widgets) is a single `<script>` tag that you can ask Lovable to add to `index.html`. You'll still need a deployed agent.
</Tip>

## Create a TypeScript agent

Install the CLI and log in by following the [Quickstart](/getting-started/quickstart). Then scaffold an inbound TypeScript project.

```bash theme={null}
guava create my-agent --direction inbound --base-image node-sandbox:24
cd my-agent && npm install
```

TypeScript isn't required, but it keeps your agent in the same language as your Lovable app.

## Attach the agent to a WebRTC code

Create a WebRTC code. This is the address your Lovable frontend will dial.

```bash theme={null}
guava webrtc create-code
```

In `main.ts`, attach your agent to the code with `listenWebrtc`.

```typescript main.ts theme={null}
agent.listenWebrtc("grtc-..."); // Replace with your WebRTC code.
```

See the [Agent](/sdk-reference/agent) reference to customize what your agent says and does.

## Test locally

Run your agent, then dial it from the browser at [app.goguava.ai/debug-webrtc](https://app.goguava.ai/debug-webrtc).

```bash theme={null}
guava run .
```

## Deploy the agent

Deploy your agent so it stays online for your Lovable app.

```bash theme={null}
guava deploy up .
```

See the [Deployment guide](/guides/deployment) for logs, scaling, and instance tiers.

## Build the frontend in Lovable

Paste a prompt like this into Lovable's chat, replacing `grtc-...` with your WebRTC code.

```text theme={null}
Add a "Talk to us" button that starts a voice call with my Guava agent using
the Guava WebRTC SDK (@guava-ai/guava-sdk/webrtc). Use the WebRTC code
grtc-... and show the call state while the call is active, with a button to
hang up. Follow these docs: https://docs.goguava.ai/guides/webrtc-calls
```

Lovable will install the SDK and wire up the call. From there, you can keep iterating in Lovable on the UI, for example passing the signed-in user to your agent with `customPayload`.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.