Git Integration & CollaborationFetch in Bruno Button

Fetch in Bruno Button

Bruno allows you to share your Git-synchronized collection via an embedded “Fetch in Bruno” (FiB) button turning the import/cloning process into a single click!

This button can be placed in websites, articles, and documentation, with support for both HTML and Markdown formats.

Import collections from Git

This feature helps you to share your collections in an easy and flexible way - meeting the user wherever they are. Once imported, the user now has a Git-synced collection and can seamlessly pull down new changes as updates are made.

Make sure you have Bruno version 1.40.0 or above installed on your system to use this feature.

Things You Need

  1. Bruno installed on your system.
  2. A collection that has been initialized as a Git repository either through the UI or from the CLI.

How to Share Your Collection

  1. Open Bruno.
  2. Either go to the collection Overview tab or click on the ... and select Share.

collection-settings

  1. Copy the generated link (HTML or Markdown).

share-option

  1. Embed the link into your website, article, or documentation(e.g. GitHub Readme).
Fetch in Bruno

Manual Embedding Options

HTML Format

<div
  class="bruno-fetch-button"
  data-bruno-collection-url="https://linktoGitCollection.git"
></div>
<script src="https://fetch.usebruno.com/button.js"></script>

Markdown Format

[<img src="https://fetch.usebruno.com/button.svg" alt="Fetch in Bruno" style="width: 130px; height: 30px;" width="128" height="32">](https://fetch.usebruno.com?url=https://linktoGitCollection.git "target=_blank rel=noopener noreferrer")

How to Open Your Shared Collection

  1. Click on any Fetch in Bruno button.
  2. A popup will appear. Click on Open In Bruno.

open-in-bruno

  1. Choose the location where you’d like to store your collection.

collection-location

  1. You will see a list of available Bruno collections in the repository.

clone-collection

Once the collection is loaded in Bruno, you’ll be able to see the folder, requests, and all associated parameters.

Customizations

You can replace the Fetch in Bruno title and logo with your preferred logo and name. Simply follow the changes below in the markdown link:

[<img src="your-custom-image.svg" alt="your-custom-name"]

Make sure to keep everything else as it is.

Import collections from OpenAPI Specifications

In addition to importing Git repositories, the Fetch in Bruno button now supports importing OpenAPI specifications directly. This allows you to easily convert any OpenAPI specification into a Bruno collection with a single click.

Make sure you have Bruno version 2.3.0 or above installed on your system to use these features.

How to Use

  1. Choose your preferred embedding format:

HTML Format

<div
  class="bruno-fetch-button"
  data-bruno-collection-url="https://linktoOpenAPIspec.json"
  data-bruno-source-type="openapi"
></div>
<script src="https://fetch.usebruno.com/button.js"></script>

Markdown Format

[<img src="https://fetch.usebruno.com/button.svg" alt="Fetch in Bruno" width="130" height="30">](https://fetch.usebruno.com?url=https://linktoOpenAPIspec.json&type=openapi "target=_blank rel=noopener noreferrer")
  1. Replace https://linktoOpenAPIspec.json with your OpenAPI specification URL.
  2. Embed this code in your website, documentation, or any HTML page.

When users click the button, Bruno will automatically:

  • Fetch the OpenAPI specification from the provided URL
  • Convert it into a Bruno collection
  • Open it in the Bruno app and prompt the user to choose a location to save the collection
ConsumerIntroduction