This is a template to build a simple music player app with ReactJS. The app allows you to play multiple audio tracks, pause/resume playback, and restart a track. See the finished version here.
- Play multiple audio tracks
- Pause/Resume playback
- Restart a track
- Show track progress and duration
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.
- Clone this repository:
git clone https://github.com/antoinekllee/react-audio-player-template.git
- Navigate to the project directory:
cd react-audio-player-template
- Install the required dependencies:
npm install
- Start the development server:
npm start
Now, open your browser and visit http://localhost:3000
to see the app in action.
To add more tracks to the app, modify the data
array in App.js
:
const data = [
{
title: "Track Title",
audioPath: "/assets/music/Track.mp3",
imagePath: "/assets/music/TrackCover.jpg"
},
// More tracks here...
];
Make sure to put the corresponding audio and image files in the public/assets/music
directory.
- React - A JavaScript library for building user interfaces