spotify-next

Spotify-next is a clone of the Spotify web app, powered by Spotify Web API. It's built with Next.js, Next-Auth, Tailwind CSS, and React Query.

Note: Spotify's latest policy does not allow unlimited usage of their API, so you won't be able to try out the deploy version unless I whitelist your account. A quota extension request has been raised to get rid of this issue but it might take some time. For now the only option is to create a new Spotify app through their dashboard and use the credentials to run this project locally, more detailed intstructions below.

Try it yourself

Clone the repository

$ git clone https://github.com/hieudo-dev/spotify-next.git

Navigate into spotify-next and install the necessary packages (Make sure you have yarn)

$ yarn install

Create a new .env file in the root folder with your app's keys

NEXT_PUBLIC_SPOTIFY_BASE_API=https://api.spotify.com/v1
CLIENT_ID = [client id optained from the Spotify Developer Dashboard]
NEXTAUTH_SECRET = [client secret optained from the Spotify Developer Dashboard]
NEXTAUTH_URL=http://localhost:3000

Create a new app in the Spotify Developer Dashboard

Open the created app's settings and whitelist localhost redirect uri

Start up the app

$ yarn dev

To-do

• Play/Pause
• Integrate React Query with SSR
• Home page
• Now Playing bar
• Artist page
• Playlist page
• Album page
• Liked Songs page

Nice-to-haves

• Search page
• "More from top artists" section
• Show more support
• Back/Forward status detection
• Support create playlist

DISCLAIMER: This project is for educational purposes only, not for profit or commercial purposes.