# react-universal-websocket

> Universal WebSocket Provider for Universal React Applications

Latest version **1.0.5** (published 2018-07-20) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-universal-websocket
pnpm add react-universal-websocket
yarn add react-universal-websocket
bun add react-universal-websocket
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.5 |
| Published | 2018-07-20 |
| First published | 2018-07-16 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Unpacked size | 139.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Author | Max Goh |
| Maintainers | maxgoh |

## Links

- npm: https://www.npmjs.com/package/react-universal-websocket
- Repository: https://github.com/MaxGoh/React-Web-Socket
- Homepage: https://github.com/MaxGoh/React-Web-Socket#readme
- Issues: https://github.com/MaxGoh/React-Web-Socket/issues
- npm.io page: https://npm.io/package/react-universal-websocket

## Dependencies (3)

- [ws](https://npm.io/package/ws.md) ^5.2.2
- [isomorphic-ws](https://npm.io/package/isomorphic-ws.md) ^4.0.1
- [hoist-non-react-statics](https://npm.io/package/hoist-non-react-statics.md) ^2.5.5

## Recent versions

- 1.0.5 (latest) — 2018-07-20
- 1.0.4 — 2018-07-17
- 1.0.3 — 2018-07-16
- 1.0.2 — 2018-07-16
- 1.0.0 — 2018-07-16

## README

# React-Universal-WebSocket
[![contributions welcome](https://img.shields.io/badge/contributions-welcome-brightgreen.svg?style=flat)](https://github.com/dwyl/esta/issues)

Websocket Provider for Universal React

### Installation

`$ yarn add react-universal-websocket`

### Example Usage

```
// Root.jsx
import React from 'react';
import App from './App';
import { WebSocketProvider } from 'react-universal-websocket';

export default function Root() {
  return (
    <WebSocketProvider socketURL="ws://www.example.com/socketserver">
      <App />
    </WebSocketProvider>
  );
}
```

```
// App.jsx
import React, { Component } from 'react';
import { instanceOf } from 'prop-types';
import { withWebSocket, WebSocket } from 'react-universal-websocket';

class App extends Component {
  static propTypes = {
    socket: instanceOf(WebSocket).isRequired
  };

  constructor(props) {
    super(props);
    const { socket } = this.props;

    this.state = {
        message: []
    };

    socket.onopen = event => {
        socket.send('Hello WebSocket');

        socket.onmessage = event => {
            message.push(event.data);
        }
    };
  }

  render() {
    const { message } = this.state;
    return (
      <div>
        <ul>
          {
            message.map((msg, index) => <li key{index}>{msg}</li>)
          }
        </ul>
      </div>
    );
  }
}

export default withWebSocket(App);
```

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