projects tag: babel
Canvas 2D Breakout Game
I always had wanted to be able to create games using the HTML5 Canvas 2D API, so I built (and refactored) a Canvas 2D Breakout Game inspired by one I came across on MDN.
#babel, #canvas 2D, #eslint, #innerhtml property, #keydown event, #keyup event, #modern javascript, #mousemove event, #node sass, #project, #webpack
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
Web Audio API AJAX
A Web Audio API app which uses AJAX to retrieve a locally hosted audio file.
#ajax, #babel, #buffer, #canvas, #cdnjs, #code refactoring, #confetti-js, #eslint, #gh-pages, #modern javascript, #node-sass, #npm, #prettier, #project, #random colors, #scripts, #web audio api, #webpack, #workflow refactor
Wikipedia Viewer
This is a code refactoring of a project I created several years ago. I revamped the workflow, migrating from Gulp to Webpack, from jQuery to Modern JavaScript with async await, @babel/pollyfill to make my async wait code work with Babel 7 and Webpack 5, adding css animated scroll buttons, animated magnifying glass icon search input on focus, hover, and active, replacing PostCSS with Node Sass, and adding a dynamic year in the footer.
#async await, #babel, #@babel/polyfill, #code refactor, #code update, #eslint, #innerhtml property, #keydown event, #modern javascript, #node sass, #prettier, #project, #webpack, #wikipedia api, #window pageOffset, #window scroll