About A Playlist is a desktop application that provides detailed information about public playlists on Spotify. It utilizes the Spotify API to find information about a playlist and then process the information and display it in a web browser. The backend, which handles data processing and communicating with the Spotify API, was written in Java, and implemented a Java wrapper around the Spotify WEB API, which is natively in Javascript. The UI was written in React, and offers two pages: one of which requests a playlist URL from the user, and another page which displays the processed data.
The front page uses a simplistic design, utilizing a color scheme similar to that of the Spotify desktop app itself. The user can enter a URL to a public Spotify playlist and then either click the "Go!" button or simply press enter. If the provided playlist is invalid, then an alert shows up at the top of the screen stating "Invalid Playlist." However, upon being provided with a valid playlist URL, the front page sends the information to the Java server listening on port 8888 and requests info to display on the following page:
Per the above image, the program creates a list of tracks, of which all of the entries are clickable. Upon clicking an entry, the track displayed in the top right part of the screen is updated, listing the name of the song, the artist, the album, the date of release, and an image of the album cover. If a playlist description is provided, it states the description in the text box below the track information. Otherwise, it states that a playlist description is not available. The info page also provides statistics about the playlist, detailing the number of unique artists across all tracks, the number of unique albums, the overall popularity of the songs on the playlist (described in text based on a score from 0-100), the span of released songs in years, and the top 5 most common genres across each artist. There is also a graph in the bottom right part of the info page detailing the years in which each song was released. Finally, there is a link on the bottom left part of the screen "Return to Main Page", which, as its name indicates, sends the user back to the main page above and allows them to search for another playlist.
To take a look at my github repository for the project, follow this link:
Comments