


This year marks Spotify's third edition of the wrap as they release users' listening habits over the course of the year 2021.
#How do i get my spotify stats free#
Feel free to reach out to me on LinkedIn and follow me on Github.Spotify has finally released its highly anticipated list of songs and artists enjoyed by music lovers across the globe in the year 2021. For more content like this, head over to my actual blog. 💎 Thank you for taking the time to check out this post. Informational cards for each track and artist.📊 Chart.js - Simple, clean and engaging HTML5 based JavaScript charts.

🎵 Spotify API - for fetching Spotify data.🎨 Tailwind - Rapidly build modern websites without ever leaving your HTML.⚡ Angular - a platform for building mobile and desktop web applications.View artist genres, follower count, and popularity.View track details including musical and audio features.Export similar playlist to your Spotify account.Get similar tracks for a given playlist.Browse the playlists you follow or created.Short self plug: If you’re looking for an extensive yet simple-to-learn SCSS framework, check out my project Cirrus! As a long-time Flexbox user, CSS Grid has proven to be an even more flexible way to lay out your components. A good chunk of the interface was built using CSS Grid. On the UI side, this is my first project experimenting with Tailwind CSS which ended up being quite pleasant to use. This is just a brief overview of how it works, but I may write a more in-depth post on this in the future. all follow a repeatable and consistent pattern which reduces the chances for any silly bugs.Įnter fullscreen mode Exit fullscreen mode Each request can have a unique TTL if you so desire.Īs a result, all other Angular services developed such as ArtistService, TrackService, etc. The library also allows for a custom time limit to be set for the cached entries (the duration is known as TTL or time-to-live). This allows for any other service to leverage the same caching strategy, resulting in faster development times. This service was developed to provide a centralized mechanism to cache all HTTP requests. which could result in a lot of extra round trips between the client and Spotify servers. If you think about the usage patterns of someone using Spotify, people may sometimes spend lots of time browsing different artists, albums, tracks, etc. This TTL cache was developed out of a need to keep the PWA snappy and keep data consumption low. One of the more interesting pieces of the app is the CachedHttpService. I am by no means an expert front-end developer (I mainly do back-end), but I wanted to see if I can produce a significantly better application just with more careful planning and research. My first iteration was started back in 2018 with Angular 6, but I scrapped that since the project was not planned out properly. The second reason was to rewrite this project again from scratch using Angular 10, Tailwind CSS, and push my design and front-end development skills. The first main reason as stated above was the burning desire I had to know about how my listening habits have changed over time. Spottr is a PWA developed to surface your Spotify listening habits year-round rather than at the end of each year. This is why I developed Spottr, a progressive web app that satisfies that curiosity! If you’re like me, you probably hate waiting till the end of each year just to see your top songs, artists, and genres.

As a long-time Spotify user, I love the end-of-year stats that Spotify surfaces each year.
