Why I Added a Now Playing Feature to My Portfolio
As a developer who loves music, I wanted to showcase my personality beyond just code and projects. Adding a "Now Playing" feature to my portfolio was the perfect way to do this.
The Inspiration
I was browsing through developer portfolios and noticed how some included personal touches like favorite quotes, hobbies, or current activities. Music has always been a big part of my life - whether I'm coding, debugging, or just relaxing. Why not share what I'm listening to in real-time?
Technical Implementation
The implementation involved several components:
Last.fm Integration
- Used Last.fm's Web API to fetch recent tracks and current playback status
- Implemented API key authentication for secure data access
- Created a backend API route to handle Last.fm data securely
YouTube Search Integration
- Added YouTube search scraping to fetch track thumbnails and metadata
- Implemented HTML parsing to extract video information from search results
- Created a unified interface for track data enrichment
Real-time Updates
- Implemented polling mechanism to check for currently playing tracks
- Added fallback to most recent track when not actively playing
- Created efficient caching to minimize API calls
Challenges Faced
-
API Rate Limits: Last.fm's API has rate limits, so I implemented caching and efficient polling strategies.
-
Web Scraping Reliability: YouTube search results parsing can break with layout changes, requiring robust error handling and fallbacks.
-
Data Consistency: Ensuring track information matches between Last.fm and YouTube sources, with proper fallbacks when data is unavailable.
-
Privacy Considerations: Handling music listening data responsibly without exposing sensitive user information.
The Result
The "Now Playing" feature adds a dynamic, personal touch to my portfolio. Visitors can see what music I'm currently enjoying, which helps break the ice and shows I'm more than just a developer - I'm a person with interests and personality.
It also serves as a technical showcase of my ability to integrate multiple APIs, handle real-time data, and create smooth user experiences.
Future Enhancements
I'm planning to add:
- Integration with official music platform APIs (Spotify, Apple Music)
- Music history timeline display
- Social sharing features for currently playing tracks
- Enhanced metadata fetching from multiple sources
- Better error handling and offline fallbacks
This feature not only makes my portfolio more engaging but also demonstrates my passion for both technology and music.