A Playlist App with the Spotify API
.
Live demo http://Jammming_SimonaPiz.surge.sh/.
In this project, I build a React web application. I use my knowledge of React components, passing state, and requests with the Spotify API to build a website that allows users to:
- search the Spotify library,
- create a custom playlist,
- then save it to their Spotify account.
- ⚛️ Create static components
- ⚛️ Pass Down Search Result and Render Result List
- ⚛️ Pass down Playlist to Tracklist
- ⚛️ Add Tracks to a Playlist
- ⚛️ Remove Tracks from a Playlist
- ⚛️ Change the name of a Playlist
- ⚛️ Create method that Saves the Playlist to a User's Account
- ⚛ Hook up Search Bar to Spotify Search
- 🔑 Obtain a Spotify Developer Access Token
↔️ Implement Spotify Search Request- ↔ Save a User's Playlist
- ➕ new Feature: Include preview samples for each track
- React 17
- Node.js 18
- Include preview samples for each track
- Only display songs not currently present in the playlist in the search results
- Add a loading screen while playlist is saving
- Update the access token logic to expire at exactly the right time, instead of setting expiration from when the user initiates their next search
- After user redirect on login, restoring the search term from before the redirect
- Ensure playlist information doesn’t get cleared if a user has to refresh their access token
To run this project, install it locally using npm:
$ cd ../[directory]
$ npm install
$ npm start
This project comes from the Codecademy's Front-End Engineer course.