NQME - Shared Music Playlist

Links

Live application: NQME or Link when domain name expires
Backend API hosted on Heroku Dyno: NQME GraphQL API
Python backend repository: Backend Source Code
React frontend repository: Frontend Source Code

Description

Responsive Web Application where multiple users can create a room, add music from Youtube and have it play on the room host's device.
Users can add likes to queued up songs.
The Playlist is sorted and updated in real time based on the songs with the most user likes.
Users can create their own room or join an existing one by entering a 4 digit code.

Technologies used

React
Typescript
GraphQL - providing data to users from the backend
Socket IO - two way communication with clients
Python 3
Flask - to make python webserver
Grpahene - Python Library for making GraphQL APIs
Docker - backend is hosted in a container
Heroku - hosts backend
AWS S3 - hosts frontend
AWS Cloudfront
SSL certificates

Setup project locally

In the backend directory, run docker build --tag nqme-backend .
Now you should have a built docker image. Start it with docker run --publish 5000:5000 nqme-backend
You should have the backend running on localhost:5000
Go to the frontend directory and run npm install
Finally, run npm start

Pictures fromo application

Credits: Shout-out to my friends for the initial idea

Ivo, Atanas, Šarūnas, Bogdan, Octavian, and last but not least Alex!