# Upload builds

A build can be uploaded to Widgetbook Cloud using the Widgetbook CLI.
We recommend to setup a CI/CD workflow to automatically upload builds for each commit and branch.

## Tutorial video

<YouTube id="-7w1VqZD004" />

## Upload build using CI/CD

<Info>
Uploading builds using CI/CD is the recommended way to publish Widgetbook Cloud builds for each of your commits.
If you're trying Widgetbook Cloud for the first time, following the [manual upload instructions](/cloud/builds/upload#upload-build-manually) is helpful to understand the process.
</Info>

To follow the CI/CD setup guide select your Git provider below

<CardGroup>
    <Card title="GitHub" href="/cloud/guides/github/upload">
        Upload builds with GitHub action.
    </Card>
    <Card title="GitLab" href="/cloud/guides/gitlab/upload">
        Upload builds with GitLab pipelines.
    </Card>
    <Card title="Azure DevOps" href="/cloud/guides/azure/upload">
        Upload builds with Azure Pipelines.
    </Card>
    <Card title="Bitbucket" href="/cloud/guides/bitbucket/upload">
        Upload builds with Bitbucket Pipelines.
    </Card>
</CardGroup>

## Upload build manually

To create a Widgetbook Build, follow these steps inside your Widgetbook project:

<Steps>
  <Step title="Generate the components registry">
    ```bash
    dart run build_runner build -d
    ```
  </Step>

  <Step title="Generate snapshots">
    Run your Widgetbook tests to write the snapshot images and metadata to `build/.widgetbook`.
    See [Run Scenarios](/testing/run-scenarios) for how to set up the test entry point.

    ```bash
    flutter test
    ```
  </Step>

  <Step title="Build the Widgetbook for the web">
    ```bash
    # Default target (i.e. `lib/main.dart`)
    flutter build web

    # Custom target
    flutter build web -t lib/main.widgetbook.dart
    ```
  </Step>

  <Step title="Install the Widgetbook CLI">
    Install the [Widgetbook CLI](/cli):

    ```bash
    dart pub global activate widgetbook_cli {{ versions.cli }}
    ```
  </Step>

  <Step title="Get your API key">
    Copy your **API key** from the Widgetbook Cloud **project settings page**.
  </Step>

  <Step title="Push the build to Widgetbook Cloud">
    ```bash
    widgetbook cloud build push --api-key PROJECT_API_KEY
    ```
  </Step>
</Steps>

<Info>
The `cloud build push` command uploads the following directories:

1. `build/.widgetbook/`: the snapshot images and metadata used for [Widgetbook Cloud Reviews](/cloud/reviews).
1. `build/web/`: the interactive Widgetbook build that you can browse online.

</Info>