https://github.com/matthewoestreich/chat-app

A full-stack real-time chat app with support for multiple rooms, direct messaging, and dark mode
https://github.com/matthewoestreich/chat-app

chat chat-app chat-application express express-js expressjs nodejs react react-real-time-chat react-websocket real-time-chat typescript websocket websocket-chat websockets ws

Last synced: 5 months ago
JSON representation

A full-stack real-time chat app with support for multiple rooms, direct messaging, and dark mode

• Host: GitHub
• URL: https://github.com/matthewoestreich/chat-app
• Owner: matthewoestreich
• License: other
• Created: 2024-11-06T00:10:40.000Z (11 months ago)
• Default Branch: main
• Last Pushed: 2025-04-02T02:30:05.000Z (6 months ago)
• Last Synced: 2025-04-23T13:29:41.843Z (5 months ago)
• Topics: chat, chat-app, chat-application, express, express-js, expressjs, nodejs, react, react-real-time-chat, react-websocket, real-time-chat, typescript, websocket, websocket-chat, websockets, ws
• Language: TypeScript
• Homepage: https://rtchat-a7ul.onrender.com
• Size: 15.6 MB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Contributing: .github/CONTRIBUTING.md
  • License: LICENSE

Awesome Lists containing this project

README

          


  
RTChat

  A full-stack real-time chat app with support for multiple rooms, direct messaging, and dark mode





    
Start Chatting Now!








	    

    

  

  

    

  

  

	  

	

  

  

  

  

    

  

  

    

  

  

    

  

   

    

  

  

    

  








# Features:

- Session Based Authentication & Authorization [\*](#user-content-jwt)

- WebSocket Authentication

- Dark Mode

- Responsive

- Abstract Database Access Level

  - This means we can use nearly any medium for storage, even an API!

- Type-Safe WebSockets

  - We have custom ***type-safe*** event emitter wrappers around WebSockets!

  - [WebSocketeer](client/src/ws/WebSocketeer.ts) for client side

  - [WebSocketApp](server/wss/WebSocketApp.ts) for server side

  - Makes writing WebSocket code feel like you're writing Express routes

  - Each "route" is a message type, which makes sending and/or parsing messages a breeze!

# Look & Feel 

\***_Subject to change, may look different now_**

## Default Look

![General Display](.github/screenshots/1_general.png "General")

## Dark mode!

![Dark Mode General Display](.github/screenshots/2_dark_mode.png "Dark Mode!")

## Live Member Status

See whos online _right now_

![Live Status Updates](.github/screenshots/3_live_status.png "Live Member Status Updates")

## Responsive

Optimized for all devices!

![Responsive General](.github/screenshots/4_responsive_main.png "Responsive")

---

![Responsive Rooms](.github/screenshots/5_responsive_rooms.png "Responsive Members")

---

![Responsive Members](.github/screenshots/6_responsive_members.png "Responsive Rooms")

---

![Responsive Direct Conversations](.github/screenshots/7_responsive_direct_convos.png "Responsive Direct Conversations")

---

\*Pseudo-sessions via JWT. I was testing various auth strategies, got sick of testing different strats, and settled with using a JWT as a session-like token. I plan on migrating to full on sessions soon.

---

##### Older Versions

[Version 1](https://chat-app-ghpq.onrender.com)