TL;DR
In this post I introduce useful custom React.js hooks that take websocket clients to the next level.
Introduction
In t...
For further actions, you may consider blocking this person and/or reporting abuse
So I tried the same approach, but with phoenix sockets. It was messy and hard to implement. Instead I created a middleware for the reducer. It works wonders.github.com/trixtateam/phoenix-to-r...
Looks awesome! I starred your repo. This aproach looks great, tho I personally prefer context/hooks over Redux.
Hi, I am learning socket.io with NodeJs and ReactJS. Please point me in the right direction.
Suppose, I want users to connect to a server (Express.JS) using socket.io - securely. I am using auth token - JWT for that. How does it work.
I mean, do I need to send JWT with every event or just once during Join. And even when during join - i verify that the user is authenticated and JWT is legit. How do I know the second time that the user is the one who authenticated and not someone else in place of him. I am a bit confused as you must be getting from my questions.
My real intention is to get realtime data using NodeJS server from MongoDB using socket.io and reactjs in the frontend. The data should be private to each user. I think I would need to create separate room for each user.
Just like Facebook friend request system. If you put a request for someone else, it is in realtime updated to the end user.
Just point me in the right direction, blogs, stackoverflow, guides etc. Anything works.
Thanks already to everyone!
I suggest this solution:
ws://localhost:4000/ws?token=...Hey, I guess you are not using socket.io because you can't implement it on the server ? Or you prefer e sockets over socket.io and why?
socket.io has issues with order of messages and generally it is heavy and messy library. You do not need any library for websockets in browsers nowadays, and you have very well test library ws for node.js
I used a Java server, so socketIO was not an option.
I made a hook inspired by GraphQL in the format
const { data, loading, error } = useSubscription(url)and it also shares the same websocket if it's already open and retries (exponential back off) if the connection closes abnormally.Your structuring and code looks good but still somehow I find it messy and hard to read without spending time to break it down. Passing down context and utilising useReducer was neat.
Thank you for your feedback. Do you have any useful tips? Perhaps I should practice more code splitting?
Maybe I am not sure. I would highly encourage you to go through Airbnb's style guide. They have documented some really good practices. I read some of it a long time ago. Majorly I guess there should be good indentation that separates code logically or functionally. I personally like to club declarations, conditions and returns. Separation of concerns is also an under practised guideline although its very famous. Moreover I came across this article coincidentally the other day, dev.to/dhaiwat10/become-a-better-w...
I think this will help you :)
So glad I found this. Very insightful. Needed a really good resource for websockets without Socket.IO, and this post is at the top of the list.
I learned a lot from your source code.
It makes me realized my react code was not react code.
Thank you, good day
Why create one when you can get all awesome hooks in a single library?
Try scriptkavi/hooks. Copy paste style and easy to integrate with its own CLI
Great article! Thanks for sharing this with us! 🚀
hi, How can to prevent component re-render every on onmessage?