@exiasr/use-socketio

React hooks to use with https://socket.io/

Usage no npm install needed!

<script type="module">
  import exiasrUseSocketio from 'https://cdn.skypack.dev/@exiasr/use-socketio';
</script>

README

Build Status Coverage Status

Use socket.io using React Hooks (React v16.8+)

Usage

Installation

$ yarn add use-socketio

In your code

import { ClientSocket, useSocket } from "use-socketio";

const Twitter = () => {
  const [tweets, setTweet] = useState([]);

  const socket = useSocket("tweet", newTweet =>
    setTweet([newTweet, ...tweets])
  );

  return tweets.length ? (
    <ul>
      {tweets.map(tweet => (
        <li key={tweet.id}>{tweet.text}</li>
      ))}
    </ul>
  ) : (
    <p>Actually waiting for the websocket server...</p>
  );
};

const App = () => (
  <ClientSocket url="https://some-tweet-socket-listener/">
    <Twitter />
  </ClientSocket>
);