mchiemelie / drum-machine

Drum Machine

A simple drum machine application built with React, allowing you to create beats by clicking on drum pads or using keyboard shortcuts.

Features

• Nine clickable drum pads, each with a unique audio clip.
• Keyboard shortcuts for triggering drum sounds.
• Display that shows the name of the currently playing sound.

Live Demo

Check out the live demo of the Drum Machine: Drum Machine Demo

Getting Started

These instructions will help you get a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

• Node.js and npm should be installed on your machine.

Installation

1. Clone the repository to your local machine.

   git clone https://github.com/your-username/drum-machine.git

2. Navigate to the project directory.

   cd drum-machine

3. Install the project dependencies.

   npm install

Running the Application

1. Start the development server.

   npm start

2. Open your web browser and visit http://localhost:3000 to view the drum machine app.

How to Use

• Click on the drum pads to trigger sounds.
• You can also use keyboard shortcuts:
  • Q, W, E, A, S, D, Z, X, and C keys correspond to the drum pads.

Customization

You can customize the drum sounds by replacing the audio files in the public/audio directory with your own audio clips. Ensure the audio clips are in the MP3 format.

Technologies Used

• React
• Tailwind CSS
• JavaScript

Acknowledgments

This project was created as part of the FreeCodeCamp Frontend Libraries and Frameworks curriculum. The initial user stories and requirements were provided by FreeCodeCamp.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Contact

If you have any questions or suggestions, please feel free to contact us at [email protected].