Chat application with React.js, Node.js & Socket.io
What technologies are we using?
- Socket.io
- ExpressJS
- TypeScript
- NextJS
- Socket.io-client
- React hooks
- Context API
- TypeScript
- CSS Modules
- How sockets work on the server and the client
- How to setup socket.io-client correctly in React
- How to organize code for maintainability
- Bootstrap backend
- Bootstrap frontend
- Setup sockets on the backend
- Setup sockets in React with context API
- Add set username functionality
- Add create room functionality
- Add send message functionality
- Styling
Socket.io Emit cheatsheet
![](./s1.png)