A real time chat application, using WebSockets and React.
- Users are assigned a sequential Anonymous username and color on initial connect.
- Usernames can be changed and username changes are broadcast to all connected users.
- Users can send messages which are broadcast to all connected clients.
- If message contains any image urls, images will be posted in the message feed.
- Application will display number of currently connected users in the nav bar.
- Application will indicate when users connect or disconnect from the chat channel.
You need both the Chatty App and Chatty Server for this project to function.
- Clone the chatty-server repository.
- Install dependencies using the
npm installcommand. - Start the server using the
npm startcommand. WebSockets will be served from port 3001. - Install Chatty App
- Clone the chatty-app repository.
- Install dependencies using the
npm installcommand. - Run webpack and start the webpack server using the
npm startcommand. The app will be served at http://localhost:3000/. - Go to http://localhost:3000/ in your browser. Open multiple tabs to add multiple users to the chat room.
- react: 15.4.2
- react-dom: 15.4.2
- babel-core: 6.23.1
- babel-loader: 6.3.1
- babel-preset-es2015: 6.22.0
- babel-preset-react: 6.23.0
- babel-preset-stage-0: 6.22.0
- css-loader: 0.26.1
- eslint: 3.15.0
- eslint-plugin-react: 6.9.0
- node-sass: 4.5.0
- sass-loader: 6.0.0
- sockjs-client: ^1.1.2
- style-loader: 0.13.1
- webpack: 2.2.1
- webpack-dev-server: 2.3.0
- express: 4.16.3
- nodemon: ^1.17.3
- uuid: ^3.2.1
- ws: 5.1.1