Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/danydodson/spot-tops
🎹 A web app for visualizing personalized Spotify data.
https://github.com/danydodson/spot-tops
Last synced: about 6 hours ago
JSON representation
🎹 A web app for visualizing personalized Spotify data.
- Host: GitHub
- URL: https://github.com/danydodson/spot-tops
- Owner: danydodson
- Created: 2023-01-10T05:39:57.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2023-12-15T15:19:51.000Z (11 months ago)
- Last Synced: 2023-12-16T11:42:58.773Z (11 months ago)
- Language: JavaScript
- Homepage: https://spot-tops-4fbc0b199151.herokuapp.com
- Size: 1.17 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# Spotify Tops
> A web app for visualizing personalized Spotify data
Built with a bunch of things, but to name a few:
- [Spotify Web API](https://developer.spotify.com/documentation/web-api/)
- [Create React App](https://github.com/facebook/create-react-app)
- [Express](https://expressjs.com/)
- [Reach Router](https://reach.tech/router)
- [Styled Components](https://www.styled-components.com/)
## Setup
1. [Register a Spotify App](https://developer.spotify.com/dashboard/applications) and add `http://localhost:8888/callback` as a Redirect URI in the app settings
1. Create an `.env` file in the root of the project based on `.env.example`
1. `nvm use`
1. `yarn && yarn client:install`
1. `yarn dev`
## Deploying to Heroku
1. Create new heroku app
```bash
heroku create app-name
```
2. Set Heroku environment variables
```bash
heroku config:set CLIENT_ID=XXXXX
heroku config:set CLIENT_SECRET=XXXXX
heroku config:set REDIRECT_URI=https://app-name.herokuapp.com/callback
heroku config:set FRONTEND_URI=https://app-name.herokuapp.com
```
3. Push to Heroku
```bash
git push heroku master
```
4. Add `http://app-name.herokuapp.com/callback` as a Redirect URI in the spotify application settings
5. Once the app is live on Heroku, hitting http://app-name.herokuapp.com/login should be the same as hitting http://localhost:8888/login