# @bufbuild/connect-web

> Connect is a family of libraries for building and consuming APIs on different languages and platforms. [@bufbuild/connect](https://www.npmjs.com/package/@bufbuild/connect) brings type-safe APIs with Protobuf to TypeScript.

Latest version **0.13.0** (published 2023-08-17) · Apache-2.0 license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install @bufbuild/connect-web
pnpm add @bufbuild/connect-web
yarn add @bufbuild/connect-web
bun add @bufbuild/connect-web
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 0.13.0 |
| Published | 2023-08-17 |
| First published | 2022-03-09 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 51 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1816 |
| Maintainers | srikrsna-buf, cmahony, gwong-buf, dfyock-buf, jdailey_buf, sayers-buf, psachs-buf, bufbot, tstamm-buf, bufdev |

## Links

- npm: https://www.npmjs.com/package/@bufbuild/connect-web
- Repository: https://github.com/connectrpc/connect-es
- Homepage: https://github.com/connectrpc/connect-es#readme
- Issues: https://github.com/connectrpc/connect-es/issues
- npm.io page: https://npm.io/package/@bufbuild/connect-web

## Dependencies (1)

- [@bufbuild/connect](https://npm.io/package/@bufbuild/connect.md) 0.13.0

## Recent versions

- 0.13.0 (latest) — 2023-08-17
- 0.12.0 — 2023-07-25
- 0.11.0 — 2023-06-29
- 0.10.1 — 2023-06-21
- 0.10.0 — 2023-06-14
- 0.9.1 — 2023-05-30
- 0.9.0 — 2023-05-17
- 0.8.6 — 2023-04-11
- 0.8.5 — 2023-04-04
- 0.8.4 — 2023-03-15
- 0.8.3 — 2023-03-07
- 0.8.2-1 — 2023-03-07
- 0.8.2 — 2023-03-06
- 0.8.1 — 2023-02-25
- 0.8.0 — 2023-02-23
- … 23 more at https://npm.io/package/@bufbuild/connect-web/versions

## README

# @bufbuild/connect-web

Connect is a family of libraries for building and consuming APIs on different languages and platforms.
[@bufbuild/connect](https://www.npmjs.com/package/@bufbuild/connect) brings type-safe APIs with Protobuf to
TypeScript.

`@bufbuild/connect-web` provides the following adapters for web browsers, and any other platform that has
the fetch API on board:


### createConnectTransport()

Lets your clients running in the web browser talk to a server with the Connect protocol:

```diff
import { createPromiseClient } from "@bufbuild/connect";
+ import { createConnectTransport } from "@bufbuild/connect-web";
import { ElizaService } from "./gen/eliza_connect.js";

+ // A transport for clients using the Connect protocol with fetch()
+ const transport = createConnectTransport({
+   baseUrl: "https://demo.connectrpc.com",
+ });

const client = createPromiseClient(ElizaService, transport);
const { sentence } = await client.say({ sentence: "I feel happy." });
console.log(sentence) // you said: I feel happy.
```

### createGrpcWebTransport()

Lets your clients running in the web browser  talk to a server with the gRPC-web protocol:

```diff
import { createPromiseClient } from "@bufbuild/connect";
+ import { createGrpcWebTransport } from "@bufbuild/connect-web";
import { ElizaService } from "./gen/eliza_connect.js";

+ // A transport for clients using the Connect protocol with fetch()
+ const transport = createGrpcWebTransport({
+   baseUrl: "https://demo.connectrpc.com",
+ });

const client = createPromiseClient(ElizaService, transport);
const { sentence } = await client.say({ sentence: "I feel happy." });
console.log(sentence) // you said: I feel happy.
```


## Getting started

To get started with Connect, head over to the [docs](https://connectrpc.com/docs/node/getting-started)
for a tutorial, or take a look at [our example](https://github.com/connectrpc/connect-es/tree/main/packages/example).

Connect plays nice with Vue, Svelte, Remix, Next.js, Angular and many others. Take a look at
[our examples](https://github.com/connectrpc/examples-es) for various frameworks.

---
_Source: https://npm.io/package/@bufbuild/connect-web · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._