You can try out a live demo here!
A video chat written in JavaScript using React, Node.js, GraphQL, and Socket.io. This app is entirely in-browser.
Features include:
- User authentication system with JWT
- Users can upload profile pictures which are stored in S3
- Real time updates with GraphQL subscriptions
- Instant messaging using GraphQL subscriptions
- Peer to peer video chat using WebRTC and Socket.io
The back end is comprised of 4 servers:
- A PostgreSQL server as the primary database
- A GraphQL API with Redis-backed subscriptions
- A socket.io server for signaling calls
- A Redis server backing the publisher/subscriber for GraphQL subscriptions and maintains concurrency between socket.io connections if you want to have multiple instances of the signaling server running
The front end (served from the GraphQL server for SSR) uses React and Apollo to interface with the GraphQL API. It also contains a Redux store containing the video chat state and thunk actions which interact with the Socket.io server for signaling.
The app uses Twilio for STUN/TURN servers but I may use available Node.js libraries to implement that myself in the future.
APP_NAMEdetermines which server to start when running the appPORTdetermines which port the server is listening onNODE_ENVdetermines environment (productionordevelopment)SIGNAL_SERVER_URLURL of socket.io serverAWS_ACCESS_KEYfor S3 where profile pictures are keptAWS_SECRET_KEYfor S3AWS_BUCKETbucket where profile pictures are storedCOOKIE_KEYencryption key for setting cookies for session authCOOKIE_SECRETsecret for setting cookies for session authDATABASE_NAMEof Postgres databaseDATABASE_HOSTfor PostgresDATABASE_USERPostgres roleDATABASE_PASSWORDfor PostgresGRAPHQL_URIURI of GraphQL serverGRAPHQL_WS_URIWebSocket URI for GraphQL subscriptionsJWT_SECRETJWT encryption secretREDISCLOUD_URLURI of Redis databaseTWILIO_AUTH_TOKENtoken for Twilio account (for STUN/TURN)TWILIO_SIDTwilio account SID