A live web-application deployed on Heroku that interacts with Spotify's Web API to allow users to gain insights to their Spotify usage. A fun hobby project.
- v1.0.0 Initial working web-app
- v2.0.0 Reformed UI, restrcutured server codebase, provided framework of client front end
- v3.0.0 Redesigned layout of UI, Navigation Bar, Optimized API-data fetching on client-side
- Code: JavaScript using MERN Stack
- Framework: React.js
- Database: MongoDB
- Back-End: Express.JS, Axios, connect-mongo
- Front-End: Material UI, a React UI component library & NivoCharts
- APIs: Spotify Web API
- Additional: HTML, CSS, React Query
This app runs on Node.js and you can find instructions on how to install Node.js on their website.
After installing Node.js, clone the repository and install the dependencies of the client and server:
$ cd client then $ npm install then $ npm start to run the client
Open http://localhost:3000 to view the application in your browser.
$ cd server then $ npm install then $ nodemon to run the server
Host the server locally on your computer.
This repository does not contain credentials for obvious reasons. To run this app locally, you will have to use your own credentials by registering for Spotify's Web API. Refer to the Offical Spotify Documentation for Developers.
On the Spotify Developer's Dashboard, goto your registered app and register the following Redirect URIs:
Once you've registered for Spotify's Developer API, create a .env file in the server folder and put in your following credentials:
SPOTIFY_CLIENT_ID = "your-spotify-client-id"
SPOTIFY_CLIENT_SECRET = "your-spotify-client-secret"
SERVER_SECRET_KEY = "your-secret-key"