arrow iconBack

Syncing upcoming concerts with recently played songs.

Figuring out Spotify OAuth, NextJS proxy routes, and displaying an aesthetic UI.

View code

Role

  • Front-End Engineer
  • UI Design

Tools

  • NextJS
  • ReactJS
  • JavaScript
  • CSS Modules
  • Spotify REST API
  • Ticketmaster REST API
  • Figma

Timeline

Oct. 2024 - Nov. 2025

Problem

Users often miss concerts due to lack of notice from artists about concert dates. This app aims to notify users of upcoming concerts by artists of their recently played 50 songs.

Process

I used Spotify's OAuth system to acquire an access token, which allowed me to fetch the user's recently played songs. After retrieving the JSON data with song and artist details, I used each artist's name to make a request through a proxy route in Next.js, fetching related events from the Ticketmaster API. Additionally, I implemented the Color-Thief API to extract the dominant color from each song's album image, using this color palette to enhance the visual experience of the web app. I wasn't able to deploy my project live because Spotify places a restriction on web apps until they are approved.

Other Work