/spotify-2

Next.js | Spotify API

Primary LanguageJavaScript

Spotify 2.0

• A redesigned Spotify experience with SSO authentication that fetches your playlists from your real Spotify account. From playing playlists and tweaking volume levels to skipping to next or previous tracks, choosing a track, and controlling music playback.

Tech

Features

• Fetching Spotify playlists, controlling music playback with the Spotify API, and debouncing requests.

• Intuitive, clean design system.

• User authentication with Real Spotify and Next-Auth to persist user's logged-in state, using Access & Refresh OAuth JWT and Next.js 12 Middleware.

• Framer Motion for clean animations.


Demo

Succinct demo-video :

Succinct demo-video link

Comprehensive demo-video

Shots of my Own Design of Spotify 2.0:

Succinct demo-video link

The Spotify API

Website Note: Spotify's API guidelines allow only one linked account at a time. I can switch to another Premium Spotify account, granting it access to my app while revoking access for my original account. This measure was put in place by spotify to prevent developers from creating harmful competition to their product using their own API.