Skip to content

A web app for visualizing personalized Spotify data built with React, Express, and the Spotify API

Notifications You must be signed in to change notification settings

bchiang7/spotify-profile

Repository files navigation

Spotify Profile

A web app for visualizing personalized Spotify data

Built with a bunch of things, but to name a few:

Setup

  1. Register a Spotify App and add http://localhost:8888/callback as a Redirect URI in the app settings
  2. Create an .env file in the root of the project based on .env.example
  3. nvm use
  4. yarn && yarn client:install
  5. yarn dev

Deploying to Heroku

  1. Create new heroku app

    heroku create app-name
  2. Set Heroku environment variables

    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

    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