Skip to content

regchiu/spotify-currently-playing-track

Repository files navigation

Spotify logo

Spotify Currently Playing Track

Dynamically generate Spotify currently playing tracks for your github readme or everywhere.

Overview

How to use

1. Go to Spotify Dashboard create an app.

  1. Go edit settings and add Redirect URIs. i.e. White-listed addresses to redirect to after authentication success OR failure. For example development is http://localhost:3000, production is https://spotify-currently-playing-track.vercel.app/api.

  2. Rename .env.example to .env file. Copy Redirect URIs, Client ID, Client Secret and paste into YOUR_REDIRECT_URI ,YOUR_CLIENT_ID and YOUR_CLIENT_SECRET field.

2. Installation

$ npm install

3. Get Authorize URL

$ npm run get-authorize-url

Paste the entire link into your browser and copy the url query string named "code".

4. Get Refresh Token

$ npm run get-refresh-token <code>

Copy and paste it into the YOUR_REFRESH_TOKEN field.

5. Run start

$ npm run start

Deploy on your Vercel

  1. Sign in with GitHub by Continue with GitHub.

Sign in

  1. Fork this repo.

  2. Import project and select Import Git Repository.

Import Project

Allow access to your repository, if prompted.

  1. Select root and keep everything default, then add YOUR_CLIENT_ID, YOUR_CLIENT_SECRET and YOUR_REFRESH_TOKEN of Environment Variables.

Import Project Settings

  1. Click deploy, and see your domains to use the API! Replace overview link with your URL. enjoy! 🎉

Known Bug 🐛

Layer content inside HTML in SVG foreignObject renders in the wrong place