All Projects → iamgyz → use-socket.io-client

iamgyz / use-socket.io-client

Licence: other
https://www.npmjs.com/package/use-socket.io-client

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to use-socket.io-client

Reason-react-hooks
🧶 Some hooks in ReasonML for reason-react that can be useful
Stars: ✭ 14 (-70.21%)
Mutual labels:  react-hooks
aimscroll
🍹 Painless utility libary to handle scroll positions and methods in react
Stars: ✭ 12 (-74.47%)
Mutual labels:  react-hooks
acharep
🏠 App to find fraternities near your university
Stars: ✭ 23 (-51.06%)
Mutual labels:  react-hooks
google-place-autocomplete
🏆 Best practice with Google Place Autocomplete API on React
Stars: ✭ 68 (+44.68%)
Mutual labels:  react-hooks
MovieCards
React App that uses TMDb API to display movie data. Try it out! ->
Stars: ✭ 38 (-19.15%)
Mutual labels:  react-hooks
use-query-string
🆙 A React hook that serializes state into the URL query string
Stars: ✭ 50 (+6.38%)
Mutual labels:  react-hooks
style-hook
use css in js with react hook.
Stars: ✭ 16 (-65.96%)
Mutual labels:  react-hooks
react-hooks-gatsby
Learn how to use React Hooks, and how they work with Gatsby. Watch the livestream:
Stars: ✭ 18 (-61.7%)
Mutual labels:  react-hooks
use-app-state
🌏 useAppState() hook. that global version of setState() built on Context.
Stars: ✭ 65 (+38.3%)
Mutual labels:  react-hooks
jedisdb
redis like key-value state management solution for React
Stars: ✭ 13 (-72.34%)
Mutual labels:  react-hooks
react-antd-admin
基于vite2.x + react17.x + typescript4.x + antd4.x + react-router6.x + mobx6.x编写的一款简单高效的前后端分离的权限管理系统
Stars: ✭ 140 (+197.87%)
Mutual labels:  react-hooks
react-2048
A React implementation of 2048 game built with typescript and styled-components
Stars: ✭ 66 (+40.43%)
Mutual labels:  react-hooks
pojo-observer
A minimalist object observer with React hooks support. Allows you to separate concerns between presentation and interaction logic
Stars: ✭ 91 (+93.62%)
Mutual labels:  react-hooks
resynced
An experimental hook that lets you have multiple components using multiple synced states using no context provider
Stars: ✭ 19 (-59.57%)
Mutual labels:  react-hooks
use-local-storage
A flexible React Hook for using Local Storage.
Stars: ✭ 57 (+21.28%)
Mutual labels:  react-hooks
react-use-storage
React Hook to handle local and session storage
Stars: ✭ 18 (-61.7%)
Mutual labels:  react-hooks
concave
🧐 Lens-like state management (for React).
Stars: ✭ 13 (-72.34%)
Mutual labels:  react-hooks
react-hook-geolocation
A React hook to access data from the Geolocation API
Stars: ✭ 31 (-34.04%)
Mutual labels:  react-hooks
book-fullstack-react
Fullstack React: The Complete Guide to ReactJS and Friends by Anthony Accomazzo
Stars: ✭ 100 (+112.77%)
Mutual labels:  react-hooks
use-fetch-hook
A custom hook to fetch and cache data
Stars: ✭ 95 (+102.13%)
Mutual labels:  react-hooks

use-socket.io-client

Build Status

React(^16.8.0) hook for socket.io-client, manipulate socket.io client without any side effect.

//In legacy, you would write like this:
import io from 'socket.io-client';
socket = io('ws://host:port');

//Now, you could easily write this inside the body of a function component:
import useSocket from 'use-socket.io-client';
const [socket] = useSocket('ws://host:port')

Installation

$ npm i use-socket.io-client

Example

import useSocket from 'use-socket.io-client';

//You can treat "useSocket" as "io"
const [socket] = useSocket('ws://localhost:8080',{
    autoConnect: false,
    //any other options
  });
  
//connect socket
socket.connect();

//add event
socket.on('message',(text)=>{
  console.log(text);
});

//emit
socket.emit('message','this is demo..');
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].