# correspond

> A React library to help with peer-to-peer connections / messaging

Latest version **1.0.7** (published 2018-12-06) · MIT license · 0 weekly downloads

## Install

```sh
npm install correspond
pnpm add correspond
yarn add correspond
bun add correspond
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.7 |
| Published | 2018-12-06 |
| First published | 2018-12-06 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 3 |
| Unpacked size | 108.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 2 |
| Author | Ryan Lanciaux |
| Maintainers | ryanlanciaux |
| Keywords | webrtc, react |

## Links

- npm: https://www.npmjs.com/package/correspond
- Repository: https://github.com/ryanlanciaux/correspond
- Homepage: https://github.com/ryanlanciaux/correspond#readme
- Issues: https://github.com/ryanlanciaux/correspond/issues
- npm.io page: https://npm.io/package/correspond

## Dependencies (3)

- [cuid](https://npm.io/package/cuid.md) ^2.1.4
- [react](https://npm.io/package/react.md) ^16.6.3
- [webrtc-adapter](https://npm.io/package/webrtc-adapter.md) ^6.4.8

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.7 (latest) — 2018-12-06
- 1.0.6-alpha — 2018-12-06
- 1.0.5-alpha — 2018-12-06
- 1.0.4-alpha — 2018-12-06
- 1.0.3-alpha — 2018-12-06
- 1.0.2-alpha — 2018-12-06
- 1.0.1-alpha — 2018-12-06
- 1.0.0-alpha — 2018-12-06

## README

# Correspond - A module for establishing Peer-to-peer WebRTC connections with React

This repository consists of two main packages: **correspond** and **correspond-signaling**.

**correspond** Is the series of React components and helpers for establishing a peer-to-peer WebRTC connection through the correspond-signaling server.

**correspond-signaling** Establishes a peer-to-peer WebRTC connection through WebSockets initially.

## Quick start

First, Create two projects, a server-side node application that will work as the signaling layer for the WebRTC connection and a React front-end application.

### Server

- Add the signaling module. `yarn add correspond-signaling` (or `npm install correspond-signaling`)

- Create an instance of the signaling module:

```javascript
var startSignalingServer = require("correspond-signaling");
startSignalingServer(8088); // run on port 8088
```

- Run the application `node server.js` (or whatever you name the server)

### Client

- Add `correspond` to your React project. `yarn add correspond` (or `npm install correspond`)
- Define a code path for establishing the session as the Host (e.g. something like react/@reach router).

```javascript
  import { Correspondent } from 'correspond'
  ...
  <Correspondent socketAddress={SOCKET_ADDRESS}>
    {connectionProps => <Host {...connectionProps} />}
  </Correspondent>
```

- Define another code path for establishing a session as a client

```javascript
  import { Correspondent } from 'correspond'
  ...
  <Correspondent socketAddress={SOCKET_ADDRESS}>
    {connectionProps => <Client {...connectionProps} />}
  </Correspondent>
```

- Create Host component using the `Host` container component from `correspond`. This Host depends on the `connectionProps` from the `Correspondent` component above.

```javascript
import { Host } from "correspond";
...
  <Host {...props}>
    {({
      hasSocketConnection,
      hasDataChannel,
      sendMessage,
      accessCode,
      subscribe
    }) => {
      ...
    }
```

- Create a Client component using the `Client` container component from `correspond`. This Client depends on the `connectionProps` from the `Correspondent` component above.

```javascript
import { Client } from "correspond";
...
  <ClientWrapper {...props}>
    {({
      hasDataChannel,
      sendMessage,
      subscribe,
      establishConnectionWithKey
    }) => ( /* standard component stuff using these props*/ )}
  </ClientWrapper>
```

## Examples

See the examples under the `packages/example-*` directories

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