/Music-Player

The Music Player is a web application that allows users to play music in their browser. It offers a user-friendly interface with various controls, including play/pause, next, previous, repeat song, shuffle songs list, and volume adjustment. The player supports two themes: light and dark.

Primary LanguageCSS

Music Player

Table of Contents

Introduction

The Music Player is a web application that allows users to play music in their browser. It offers a user-friendly interface with various controls, including play/pause, next, previous, repeat song, shuffle songs list, and volume adjustment. The player supports two themes: light and dark.

Demo

Demo.Video.Short.mp4

About the Project

The Music Player project is a comprehensive web application that provides music enthusiasts with a seamless listening experience. Here are some key features and functionalities:

  • Play/Pause: Users can start or pause the playback of any song with a single click.
  • Next/Previous: Users can easily switch to the next or previous song in the playlist.
  • Repeat Song: The option to repeat the current song ensures a never-ending music loop.
  • Shuffle Songs: Users can shuffle the playlist to enjoy a randomized music order.
  • Volume Control: The volume slider allows users to adjust the music's loudness according to their preference.
  • Light/Dark Themes: Users can switch between light and dark themes for a personalized look and feel of the player.

The Music Player is built using HTML, CSS, and JavaScript, ensuring cross-browser compatibility and responsive design. It's a simple yet powerful application that enhances the music listening experience.

Features

  • Play/Pause
  • Next/Previous
  • Repeat Song
  • Shuffle Songs
  • Volume Control
  • Light/Dark Themes

Used For

  • Listening to music
  • Enhancing music experience
  • Entertainment

Improvements

  • Add playlist creation and management
  • Implement a lyrics display feature
  • Create user accounts and personalized playlists
  • Extend support for various audio formats

Problems Faced

  • Responsive design for various devices
    • Solution: Using CSS media queries to create a responsive layout that adapts to different screen sizes and orientations.
  • Implementing the shuffle algorithm
    • Solution: Researching and applying efficient algorithms to shuffle the playlist without repetition and ensuring that all songs get played once before repeating.
  • Theme switcher functionality
    • Solution: Created a theme switcher in JavaScript that dynamically changes the CSS styles based on user input.

Technologies Used

  • HTML
  • CSS
  • JavaScript

Links

Getting Started

To run the Music Player project locally, follow these steps:

  1. Clone the repository: git clone https://github.com/yashksaini/Music-Player.git

  2. Open the project folder in your code editor.

  3. Launch the index.html file in your web browser.

Enjoy listening to your favorite music with the Music Player!