https://github.com/codelikeagirl29/js-music-player

Music Player Solution - DevChallenges
https://github.com/codelikeagirl29/js-music-player

css devchallenges html javascript music-player-solution netlify project

Last synced: about 1 month ago
JSON representation

Music Player Solution - DevChallenges

• Host: GitHub
• URL: https://github.com/codelikeagirl29/js-music-player
• Owner: CodeLikeAGirl29
• Created: 2024-11-16T04:37:36.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-11-16T09:47:52.000Z (over 1 year ago)
• Last Synced: 2025-10-10T07:37:48.341Z (8 months ago)
• Topics: css, devchallenges, html, javascript, music-player-solution, netlify, project
• Language: JavaScript
• Homepage: https://music-player-app-devchallenges.netlify.app/
• Size: 7.49 MB
• Stars: 0
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Music Player Solution - DevChallenges

This project is a **custom music player** built using **JavaScript, HTML, and CSS** as part of the [DevChallenges](https://devchallenges.io/challenge/music-player) platform. The solution features a clean, responsive design and offers the following functionalities:

- **Play/Pause Controls**: Users can play and pause their selected tracks.

- **Track Navigation**: Ability to skip forward or go back to the previous track.

- **Progress Bar**: A dynamic progress bar shows the track's current position and allows users to jump to specific timestamps.

- **Volume Control**: Adjustable volume settings for user convenience.

- **Track Information**: Display of track name, artist, and duration.

- **Responsive Design**: Works seamlessly across different screen sizes.

This music player solution emphasizes **functional interactivity**, leveraging JavaScript for dynamic user interactions and CSS for visually appealing design. It showcases a solid understanding of front-end development fundamentals.

## Demo

[![Netlify Status](https://api.netlify.com/api/v1/badges/ecc12635-d128-476d-b58f-a28f70f956d8/deploy-status)](https://app.netlify.com/sites/music-player-app-devchallenges/deploys)

## Screenshots

![Screenshot](https://res.cloudinary.com/dhw9dl4gm/image/upload/v1731750090/music-player-app-devchallenges-netlify-app-11-15-2024_10_43_PM_kqr1v2.png)