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

# Preview Deploys

> Get a unique preview URL for every pull request, automatically built and cleaned up when the PR closes.

## Overview

When you connect a GitHub repo to a Canvas app, every pull request gets its own preview deployment at a unique URL. Reviewers can test changes live before merging — no manual deploy needed.

***

## How it works

1. **Open a PR** targeting your app's connected branch
2. GitHub sends a `pull_request` webhook to Canvas
3. Canvas clones the PR's head branch, builds it, and deploys to a preview environment
4. The preview is live at `https://pr-{N}-{slug}.mxp.co`
5. **Push more commits** to the PR — the preview auto-updates
6. **Close or merge the PR** — the preview environment is cleaned up

***

## Preview URLs

Preview deploys follow a predictable URL pattern:

| PR   | App slug    | Preview URL                       |
| ---- | ----------- | --------------------------------- |
| #42  | `my-app`    | `https://pr-42-my-app.mxp.co`     |
| #17  | `taste`     | `https://pr-17-taste.mxp.co`      |
| #103 | `dashboard` | `https://pr-103-dashboard.mxp.co` |

Preview environments are fully functional — they use the same API proxy, auth configuration, and environment variables as your production app.

***

## Setup

Preview deploys work automatically once your repo is connected. No additional configuration is needed.

<Steps>
  <Step title="Connect your repo">
    ```bash theme={null}
    curl -X POST https://api.mixpeek.com/v1/apps/$APP_ID/connect-repo \
      -H "Authorization: Bearer $API_KEY" \
      -H "Content-Type: application/json" \
      -d '{
        "repo_url": "https://github.com/your-org/your-repo",
        "branch": "main"
      }'
    ```
  </Step>

  <Step title="Open a pull request">
    Open a PR targeting the connected branch (e.g., `main`). Canvas automatically detects the PR and starts building.
  </Step>

  <Step title="Review the preview">
    Visit `https://pr-{N}-{slug}.mxp.co` to see the live preview. The URL is also posted as a GitHub deployment status on the PR.
  </Step>
</Steps>

***

## Supported webhook events

| Event          | Action        | Canvas behavior                  |
| -------------- | ------------- | -------------------------------- |
| `pull_request` | `opened`      | Build and deploy preview         |
| `pull_request` | `synchronize` | Rebuild preview with new commits |
| `pull_request` | `reopened`    | Rebuild preview                  |
| `pull_request` | `closed`      | Clean up preview environment     |

***

## Preview vs staging vs production

| Environment    | URL pattern             | Use case                  |
| -------------- | ----------------------- | ------------------------- |
| **Production** | `{slug}.mxp.co`         | Live site                 |
| **Staging**    | `staging-{slug}.mxp.co` | Manual staging deploys    |
| **Preview**    | `pr-{N}-{slug}.mxp.co`  | Automatic per-PR previews |

Each preview environment is independent — multiple PRs can have active previews simultaneously.

***

## Cleanup

When a PR is closed (merged or not), Canvas automatically:

1. Removes the preview environment from the app's configuration
2. Deletes preview assets from S3

No manual cleanup is needed.

***

## Related

* [Deploy from Code](/canvas/apps/deploy)
* [Build Logs](/canvas/apps/build-logs)
* [GitHub Integration](/canvas/apps/github)
