https://github.com/jacobgrisham/dom-manipulation-using-javascript
Audio/Visual Drum Kit using Javascript.
https://github.com/jacobgrisham/dom-manipulation-using-javascript
dom-manipulation front-end-web-development javascript
Last synced: about 1 year ago
JSON representation
Audio/Visual Drum Kit using Javascript.
- Host: GitHub
- URL: https://github.com/jacobgrisham/dom-manipulation-using-javascript
- Owner: JacobGrisham
- Created: 2020-09-16T00:56:01.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2020-11-19T00:59:13.000Z (over 5 years ago)
- Last Synced: 2025-02-04T14:46:54.216Z (over 1 year ago)
- Topics: dom-manipulation, front-end-web-development, javascript
- Language: JavaScript
- Homepage: https://jacobgrisham.github.io/DOM-Manipulation-using-Javascript/
- Size: 1.14 MB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# [Drum Kit: DOM Manipulation using Javascript](https://jacobgrisham.github.io/DOM-Manipulation-using-Javascript/)
### Coding challenge from the Udemy Course [the Complete 2020 Web Developer Bootcamp](https://www.udemy.com/course/the-complete-web-development-bootcamp/)
I wrote the code in index.js. The other files were provided by the instructor.
## 💡Lessons Learned
- query selectors
- event.key
- this keyword
- switch and case
- creating audio in javascript
## 🚀 Getting Started
To run this project locally:
- Option 1: With the folder open in your text editor, right click on the index.html and select "Copy Path", and then paste into the browser of your choice
- Option 2: With the folder open in your text editor, right click on the index.html and select "Open with Live Server"
## 🕹 How to Use
Play the drum-set using the corresponding keys on your keyboard or by clicking the images.
## 📣 Reference
- Section 13: Advanced Javascript and DOM Manipulation of the Udemy Course [the Complete 2020 Web Developer Bootcamp](https://www.udemy.com/course/the-complete-web-development-bootcamp/)