Skip to content

Randalab6/spotify-profile-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

84 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Demofiy - Spotify Connected App

A web app to demo & share personal spotify data

Project Link: https://demofiy.herokuapp.com/

Screenshot 2023-04-30 at 10 21 22 PM

Screenshot 2023-04-30 at 7 48 06 PM

Built With

styled-components express heroku html5 javascript nodejs react

Local Installation & Set Up

  1. Register a Spotify App in your Spotify Developer Dashboard and add http://localhost:8888/callback as a Redirect URI in the app settings

  2. Create a .env file at the root of the project based on .env.example and add your unique CLIENT_ID and CLIENT_SECRET from the Spotify dashboard

  3. Ensure nvm and npm are installed globally

  4. Install the correct version of Node

    nvm install
  5. Install dependencies

    npm install
  6. Run the React app on http://localhost:3000 and the Node server on http://localhost:8888

    npm start

Deploying to Heroku with Git

  1. Create a Heroku app

  2. Add your Heroku app as a git remote

    heroku git:remote -a your-app-name
  3. Add http://your-app-name.herokuapp.com/callback as a Redirect URI in your Spotify app's settings

  4. In your app's Settings tab in the Heroku dashboard, add config vars.

    Based on the values in your .env file, the CLIENT_ID, CLIENT_SECRET, REDIRECT_URI, and FRONTEND_URI key value pairs. Make sure to replace the localhost URLs with your heroku app's URL.

    REDIRECT_URI: http://demofiy.herokuapp.com/callback
    FRONTEND_URI: http://demofiy.herokuapp.com
  5. Push to Heroku

    git push heroku main

License

Distributed under the MIT License. See LICENSE.txt for more information.

About

A web app to display spotify profile data

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published