Giter VIP home page Giter VIP logo

react-chat-app's Introduction

React Chat App

This is a React chat App

Login Credentials

URL: https://intense-temple-81745.herokuapp.com (The server is down from 5am - 11am GMT) Tester accounts:

  • chatapptester1 (password: testerpwd1)
  • chatapptester2 (password: testerpwd2)
  • Heroku lets the app "sleep" if no one visits the website for some time, so you might need to wait for 1 min for the app to load

Notes:

  • You can only open one session in each browser
  • Sample chat room
    • 3 (The name is just 3, no password)
  • Error messages to be done. Currently, if there are no effects after clicking a certain button, it means the operation is not permitted (for example, registering with duplicated username or joining a non-existing room)

Features

Administration of user created chat rooms:

  • Users can create chat rooms with an arbitrary room name
  • Users can join an arbitrary chat room
  • Users can leave a chat room
  • The chat room displays all users currently in the room
  • A private room can be created that is password protected

Messaging:

  • A user's message shows their username and is sent to everyone in the room
  • Users can send private messages to another user in the same room (click the username in the 'Members' dropdown menu)
  • Users have avatars (Gravatar library: grab avatar linked with the registration email)
  • Message shows time

Other features

  • Real-time updates using React (this includes the messages, the list of users in room etc.)
  • JSON web tokens are stored in local storage, so the session is kept even if the user closes the tab. This also means that users can only start one session in one browser
  • Mobile-friendly
  • When a new user joins, or an existing user leaves, there will be a message in the chatroom

Screenshots

react-chat-app's People

Contributors

ztyreg avatar toddsproull-wustl avatar

Stargazers

 avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.