This is a responsive music player application built using React JS. It matches the given design and includes a variety of interactive features and animations.
You can view a live demo of the application here.
- Responsive Design: Adapts to different screen sizes. On smaller screens, the player component becomes the main interface with a menu button to show a list of songs.
- REST API Integration: Loads list data from a REST API.
- Persistent Music Playback: Music continues to play even if the user visits another tab.
- Dynamic Background Gradient: The background gradient color changes according to the cover image of the currently playing song.
- Interactive Interface: Includes fluid animations and transitions such as list loading animations and background color change animations.
- Music Controls: Provides controls for play, pause, next, and previous tracks.
- Search Functionality: Allows users to search for songs.
- Tab Switching: Users can switch between different tabs like "For You" and "Top Tracks".
- Music Seeker Control: Users can control the music playback via a seeker.
- Dynamic Images: Fetches cover images using the "cover" key from the API.
- React JS
- CSS for styling
- TypeScript
- JavaScript
- Vite