Music Player

Short Description

In this project, I developed a music player that runs in the browser, featuring a playlist and basic playback controls. The application opens with pre-loaded songs, and users can add new tracks as URLs or local files. :contentReference[oaicite:0]{index=0}

Problem

Simple music player examples often remain at the basic play and stop level. This project focuses on solving the need to consolidate playback flow, list management, and user ability to add new tracks within a single interface. :contentReference[oaicite:1]{index=1}

Solution

I structured the application with a class-based architecture. The MusicPlayer class handles current track, shuffle, repeat, and list management. The UI side manages the progress bar, volume, playback controls, and playlist view using event listeners. Users can add new music from an external link or incorporate local files into the player using URL.createObjectURL. :contentReference[oaicite:2]{index=2}

Result

The outcome is an interactive music player with a well-crafted visual design that can be opened directly in the browser without any installation. Although the project is small-scale, it clearly demonstrates state management, HTML5 audio usage, and the client-side media addition workflow. :contentReference[oaicite:3]{index=3}

Technologies

HTML5, CSS3, JavaScript, Font Awesome, Google Fonts

Installation