# cBridge SDK

## Overview

The [cBridge SDK](https://cbridge-docs.celer.network/developer/cbridge-sdk) enables new and existing applications to integrate with a rich subset of features available in cBridge to build in-app transfer functionality into their applications. Libraries and packages are available and allow you to implement functionalities into your dApp quickly. The cBridge SDK also allows you to customize UI and enable the native asset-transfer UX for users.

\
In addition, the [cBridge Transfer Web Widget](https://cbridge-docs.celer.network/developer/cbridge-transfer-web-widget) provides a lightweight version of the cBridge SDK, which makes the integration easier and allows you to enable cBridge transfers with the complete source files supported.

## SDK Working Flow

The following graph reveals a general `cBridge` SDK integration inside your application. In most cases, you need to support only two functions(red lines in the graph):

1. Send requests to `cBridge` gateway through `cBridge` SDK
2. Send the corresponding on-chain transaction to `cBridge` contract

<figure><img src="https://lh4.googleusercontent.com/ZQa0UMH6o3MDudY_IjPyfHRMbgCzQUrmGzqv_HNmX8jg2W2TcPPnWzUnxuIFgGG6prtCcxbxwPAI9WMq-Fym6cOShnJ5mjchW-tZk7jyjea9WZoD8Xoma8iXvrTmvu2caRi9uRm0e-K__NCqueN0mg" alt=""><figcaption></figcaption></figure>

## Installation

It's highly recommended to communicate with `cBridge` gateway by using `grpc-web`.

1. All messages are defined in `protobuf`, `enum` value could be used directly, such as Completed, instead of an integer value 1. It helps mitigate bugs and errors due to random mapping issues
2. Inside `cBridge` gateway, there are some post APIs needing serialized byteArray as input. It takes some steps to prepare format accepted request information. Just in case you prefer RESTful API requests
3. Since cBridge iterates frequently, the best way to update everything is by using grpc. You can always check the latest grpc generated files and keep in touch with the newest cBridge gateway

### 1. Install the[ grpc-web](https://github.com/grpc/grpc-web)

To begin development with cBridge SDK, each developer needs to install `grpc-web`the `cBridge` gateway communication

```bash
// Install via yarn
yarn add grpc-web

// Install via npm
npm install grpc-web
```

### 2. Download cBridge type-script client and contract

Download auto-generated `protobuf` files(including `xxx_pb.d.ts`, `xxx_pb.js`) in[ cBridge typescript client repo](https://github.com/celer-network/cBridge-typescript-client).&#x20;

### 3. Import cBridge SDK into your projects

Import the file and type-defined messages. They can be used in your project. The following is the code snippet for type-script client usage in the `JavaScript` project.

```typescript
// import getTransferConfig request message
import {
GetTransferConfigsRequest
GetTransferConfigsResponse
}
from "../ts-proto/sgn/gateway/v1/gateway_pb";
// import grpc-web WebClient
import { WebClient }
from "../ts-proto/sgn/gateway/v1/GatewayServiceClientPb";
const request = new GetTransferConfigsRequest();
const client = new WebClient(`https://cbridge-prod2.celer.app/`, null, null);
const response = await client.getTransferConfigs(request, null);

```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.altlayer.io/altlayer-documentation/external-integrations/cross-chain-interoperability-using-celer/cbridge-sdk.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.