https://github.com/alidantech/drum-machine
https://github.com/alidantech/drum-machine
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/alidantech/drum-machine
- Owner: Alidantech
- Created: 2023-03-24T21:16:30.000Z (about 3 years ago)
- Default Branch: master
- Last Pushed: 2023-06-30T13:04:38.000Z (almost 3 years ago)
- Last Synced: 2025-03-21T18:16:48.992Z (about 1 year ago)
- Language: JavaScript
- Size: 10.3 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Drum Machine
This is a drum machine app built with React for the Drum Machine challenge on [freeCodeCamp](https://www.freecodecamp.org/). It allows users to play drum sounds by clicking on the drum pads or using keyboard keys.
## Features
- Nine drum pads, each with a unique sound and corresponding keyboard key
- Clicking on a drum pad triggers the associated sound
- Pressing the keyboard key associated with a drum pad triggers the sound
- Display shows the description of the triggered sound
- Responsive layout with Bootstrap styling
## Technologies Used
- React
- HTML5
- CSS3
- Bootstrap
## Getting Started
To get a local copy of the project up and running, follow these steps:
1. Clone the repository:
```bash
git clone https://github.com/your-username/drum-machine.git
```
2. Change to the project directory:
```bash
cd drum-machine
```
3. Install the dependencies:
```bash
npm install
```
4. Start the development server:
```
npm start
```
5. Open the app in your browser:
http://localhost:3000
## Usage
- Click on the drum pads to play the associated sounds.
- Press the keyboard keys (Q, W, E, A, S, D, Z, X, C) to play the corresponding sounds.
- The description of the triggered sound will be displayed in the center of the app.
## Credits
- Drum sounds: [freeCodeCamp](https://www.freecodecamp.org/)
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE)