https://github.com/nateshmbhat/coder-chat

A webapp built with react and express that is useful during coding sessions and other use cases that involve chatting and coding
https://github.com/nateshmbhat/coder-chat

ace-editor coder-chat react redux socket-io ts websocket

Last synced: 3 months ago
JSON representation

A webapp built with react and express that is useful during coding sessions and other use cases that involve chatting and coding

• Host: GitHub
• URL: https://github.com/nateshmbhat/coder-chat
• Owner: nateshmbhat
• License: gpl-3.0
• Created: 2019-05-15T09:25:30.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-03T21:48:54.000Z (about 2 years ago)
• Last Synced: 2024-10-11T12:55:33.755Z (4 months ago)
• Topics: ace-editor, coder-chat, react, redux, socket-io, ts, websocket
• Language: TypeScript
• Homepage: https://coderchat.netlify.com
• Size: 1.54 MB
• Stars: 6
• Watchers: 1
• Forks: 0
• Open Issues: 18
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# coder-chat

A webapp built with react and express that is useful during coding sessions and other use cases that involve chatting and coding.

## Features :

+ Code transparently in a team with everyone being able to see everyone else's code in realtime.

+ Run any number of servers , each forming its own subgroup for communication and code sharing.

+ Chat with all the members currenlty using the app to receive realtime chat updates.

+ A fully featured code editor with options for theme customizations and multiple language support.

+ Live code editor supports multiple languages with syntax highlights and also supports **vim** keybindings.

+ Syncs code from various users of the app in the network updates in real time letter by letter with corresponding language highlights.

+ Watch a user in the network code live from the shown user's list who are using the app.

## Usage :

+ Start a server in your system by doing the following : 

    + go inside the `server` folder.

    + run `npm i` command to install dependencies (first run)

    + run `npm start` to start the server.

    + Open a new terminal and go to the same `server` folder.

    + Now enter command `npm run expose  -- --port 9000`  where 9000 is the default port number on which server is running. This will give a url link that is accessible globally.

+ Go to [coderchat](coderchat.netlify.com) website and click on `Server Setup` option and paste the above generated URL link there. 

+ Now any group of users on the internet who enter the above url link will be able to chat and use the live coding feature seamlessly :)

### A Small Demo showing some of the Live Code sync and chatting features : 

[![](http://img.youtube.com/vi/dpZ1zrcPBww/0.jpg)](http://www.youtube.com/watch?v=dpZ1zrcPBww "Coder Chat Demo")