🎧 A music player built with React featuring multiple playlists, playback controls, and Context API for state management. Second project from the Build 3 React Projects in 4 Hours tutorial.
This project was built to practice advanced React concepts:
- ✅ Context API - Global state management without prop drilling
- ✅ useContext hook - Consuming context in nested components
- ✅ useRef - Referencing audio elements directly
- ✅ Audio API - Playing, pausing, and controlling HTML5 audio
- ✅ Dynamic UI updates - Progress bar, current time display
- ✅ Component composition - Player, sidebar, playlist separation
- ✅ File-based data - Loading local audio files
| Technology | Description |
|---|---|
| React 18 | UI library with hooks |
| Vite | Fast build tool |
| JavaScript | Application logic |
| CSS3 | Custom styling for player UI |
| Context API | State management |
| HTML5 Audio | Browser audio playback |
▶️ Play/pause current song- ⏭️ Skip to next/previous track
- 📋 Multiple playlists to choose from
- 📊 Progress bar with seek functionality
- ⏱️ Current time and duration display
- 🎨 Clean, modern UI