Background
The following is my first blog to achieve 8k+ view and 1st in Google SERP rank. However, it has some concerns and I decided t...
For further actions, you may consider blocking this person and/or reporting abuse
I have learned about ReactJS and Socket recently and written an video call and chat app using ReactJS and Socket .Here is my source code: github.com/lethanhvietctt5/video-c.... I hope it can help you guys to build a video chat app.
I don't think it's good approach. It will work for very small projects, but for larger ones not so much. Mixing socket communication with React will become overwhelming as app will grow, because all of it will spread through entire project. I would separate data source from frontend components. Imho better method is to extract actions and datasource to another files and provide only api to front components (as react-redux does). It would provide flexibility. Especially when you need to access different data sources (ie. local storage + cookie + websocket + ajax). React shouldn't "care" about where data comes from, business logic or communication with server.
Great article! Could you show how to implement 'user is typing indicator' with react? It seems when you keep track of a keyPress using a setTimeout you get a call to a function that sets a variable for every keyPress. I can share a code example somewhere if you want to discuss :)
Thanks! If you want to ask me anything, please open a stackoverflow post and share the link. I'm more than happy to help there :)
Elswhere in react on that way doesnt work,we can have only one instance of socket on client.
I don't understand the JWT part. It's not written in relation to context. I have my app with a callback that is receiving the jwt on login then storing in storage which is when I want to connect to the socket, but I'm not too sure how to pass that jwt to context or force it to update when the jwt is available.
@bravemaster619
It is greate article, Thank you!
When the server
emit
it sends some values. How we can access these values inuseCallback
?Good example. Thanks
And for initialize and listen of the events of the socket, it is better to use different useEffect hooks separately.
Nice tutuorial. In my VS CODE console, I keep getting multiple request with polling, but it never does a a handshake with the server, what could be wrong?
nice! I did almost the same in my coding challenge which I've recently passed and described it in here alfilatov.com/posts/frontend-dto-c...
I've made online Rock-Paper-Scissors game, using sockets like that. Thanks. You can check it here
[github.com/Whiz7z/rock-paper-sciss...]
How to handle when client disconnected from server.
how do you globalize the socket instanse? ,,, so that i can call emits and listen to them in other modules of the project.