HaudioFeel?

A free music player that fetches the top songs from curated Spotify playlists based on your mood!

Comment

Inspiration

Music is something I deeply value for my mental health and well-being. My hack allows users to listen to music based on their mood with the hope of providing them a better experience. I find myself switching between song playlists a lot depending on my mood and thought this would help while also giving me more experience with integrating new APIs.

What it does

A free music player that fetches the top songs from curated Spotify playlists based on your mood!

How we built it

HaudioFeel was built using react and two external APIs. The app works by the user selecting a music category (emoji) and a request being made to the Spotify API to fetch the top 50 songs from a specified playlist. The application then sorts these songs based on popularity and saves the top 10 results. Each song is then converted into a YouTube search query and sent to the YouTube Video Search API to fetch a video URL. This video is then presented to the user.

Challenges we ran into

  • Working with react hooks was a bit challenging but stackoverflow and a little bit of persistence was enough!
  • Filtering the data returned back from the APIs was tricky, needed to create my own algorithm to format data so it can be used. (sorting based on popularity/regex to remove duplicated info)
  • Reading through the Spotify and YouTube API documentation was also a new experience.

Accomplishments that we're proud of

  • Created an app that I'm personally going to use
  • An app that integrates two external APIs
  • Deployed it online to a .tech domain to share.

What we learned

  • React hooks
  • reading technical documentation for APIs
  • how to deploy a site on Netlify
  • how to register a domain
  • practiced CSS styling.

What's next for HaudioFeel?

  • Allow users to add songs to their spotify or youtube playlists
  • Improve UI, add dark and light modes
Share this project:

Updates