BoilerBangers

Inspiration

Boilerbangers was born out of a simple yet powerful idea: music connects us. As students at Purdue, we noticed how songs shape dorm vibes, study sessions, and campus culture. We wanted to capture that energy and turn it into something tangible: a dynamic chart that ranks the most-played songs across campus in real time. Think Billboard, but hyperlocal and student-powered.

What it does

BoilerBangers tracks and ranks the most popular songs among Purdue students, showing campus-wide music trends in real time.

How we built it

Spotify Integration We used the Spotify API to fetch users' listening history. Each user authenticated via OAuth, allowing us to access their top tracks and playback data.
- Backend Architecture Built with Flask, our backend handled: - Token management and refresh logic - Data aggregation across users - Ranking algorithm based on frequency and recency - We experimented with different weighting schemes.
Frontend Visualization We built a responsive dashboard using javascript to display: - Top 10 songs on campus - Dorm-level breakdowns - Real-time updates were enabled via periodic polling and state syncing.

Challenges we ran into

Spotify restricts client registration to 5 per 24 hours and 25 lifetime clients. This bottleneck forced us to rethink onboarding and simulate data for testing.
Data Extraction Complexity Spotify’s data model is rich but nested. Parsing playback history and normalizing across users required careful mapping and error handling.
Frontend Syncing Ensuring the charts updated smoothly with backend changes was tricky. We spent an entire night debugging state mismatches and race conditions.
We ran out of time to implement the backend for our filtering system despite having a working front-end design

Accomplishments that we're proud of

We’re proud of creating a full-stack application in a short hackathon timeframe. We integrated the Spotify API to fetch listening data, designed a ranking algorithm that highlights trending songs, and built a dynamic, responsive frontend to display campus-wide and dorm-level charts. Along the way, we overcame challenges with API limitations, data syncing, and real-time updates, all while collaborating closely as a team to bring BoilerBangers to life.

What we learned

Real-World API Constraints Working with the Spotify API taught us how real-world limitations shape technical decisions. We ran into strict client registration caps—only 5 clients allowed per 24 hours and 25 total in a lifetime. That forced us to rethink onboarding strategies and simulate user data creatively during testing. We also had to navigate OAuth flows and token refresh logic, which gave us a solid understanding of authentication systems.
Data Aggregation and Ranking Logic We learned how to normalize and rank songs across users by designing a custom scoring algorithm. Parsing Spotify’s nested JSON playback data and extracting meaningful insights was a challenge, but it helped us sharpen our data handling skills.
Backend-Frontend Sync Building a Flask backend and syncing it with a dynamic React frontend taught us a lot about state management and real-time updates. We spent hours debugging race conditions and mismatches between frontend state and backend data. It was a crash course in asynchronous programming and frontend resilience.
Design Thinking Under Pressure We had to iterate quickly on UI/UX decisions to make the charts intuitive and engaging. Every design choice had to serve both clarity and performance.
Teamwork and Resilience This project tested our endurance and adaptability. We stayed up all night, pushed through API blockers, and kept iterating until we had something we were proud of. We learned how to pivot when things broke, how to support each other, and how to lead under pressure.