Case Study Page

project thumbnail

Statify

A web application using Spotify's API to view top tracks, artists, & recently played

Year

2023

Type

Personal Project

Role

Solo Developer

Project goal

The goal of the project was to create a web application where you can track the music you stream on Spotify. This involved using Spotify's API to fetch your top tracks, artists, and recently played.

Technologies Used

I used Adobe XD for the wireframe, HTML and SASS for the website structure and styling, and JavaScript for the functionality.

How it was created

I started off by designing a simple wireframe for the home page and the app page which the user gets redirected to once they authenticate and allow Statify to access their account data and their activity on Spotify. I referred to Spotify's design guidelines for the font and colours that I used for my app and designed the layout to be similar to their app.

Once I was done with the wireframes, I went to their Spotify for Developers website, registered a new app, and began reading the documentation for their Web API. Since it was my first time using their API, I followed their instructions for getting started and checked out some of their examples for authorization and making calls to the API. I used my own Spotify account to test my app throughout the process. The step that took the longest for me was getting the authorization to work. Once I was able to get that set up properly and working, making the calls to the other endpoints I needed (to fetch account data and listening activity) was fairly straightforward.

project imageproject imageproject image

Thanks for checking out my case study.

Here are some of my other projects & work.

If you like what you see and think I'd be a good fit for your next project, I'd love to chat!