projects tag: event listeners
Audio Visual Slider
An application I created at the height of the COVID-19 pandemic as part of the course content of a Dynamic Web 1 (JavaScript) course I was (and still am) teaching. We had just migrated to online learning, and I wanted to create an application that visualized what we were all feeling. I selected images that expressed those feelings, and synched the animations with the beat of music I chose. It was a rough time, but my students for that class were really amazing. I was truly inspired by them.
#appendChild, #css in js animation, #css keyframes, #css transitions, #DOMContentLoaded event, #event listeners, #getElementsByTagName, #innerhtml property, #input event, #manipulating the dom, #modern javascript, #node sass, #project, #web audio api
Guess the Keys App
A fun little game made with JavaScript, SCSS/CSS3, and HTML.
#disabled property, #event listeners, #javascript, #keypress event, #project
OMDB API JS App
I originally created this client slide application using the OMDB API before creating my OMDB API Node.js version. After I created that one, and discovered potential built-in API errors in the Node.js version, I applied and transformed them into their client-side rendition. I felt it important to introduce my students to application error handling and thus a basic form of "testing".
#ajax, #api error handling, #css in js, #event listeners, #getElementsByTagName, #innerhtml property, #javascript object, #manipulating the dom, #modern javascript, #mousedown event, #node sass, #project, #template string literal interpolation, #this
Rockin Synth
A piano keyboard application built with JavaScript, es6 modules, the Web Audio API, event delegation, Sass, and more.
#babel, #e.keyCode, #e.which, #es6 modules, #eslint, #event delegation, #event listeners, #kbd tags, #prettier, #project, #transitions, #web audio api