August 2019 IESD Hack Day event.
This repository has the resources to get you prepared for the Hack Day event.
Starter code has been update - 8/31/19 @ 1:55 PM.
If you have any questions, please ask on our Slack. We welcome everyone to our Slack, so don't be afraid to join! Have fun coding!
Resources section below has links for these concepts.
- Canvas
- RequestAnimationFrame (JS Method)
- Object Oriented JavaScript
- Prototypal Inheritance
- Sprites
- Keyboard Events
List will be updated up until the day of the Hack Day event.
- Making Sprite Based Games with Canvas (2013 article - still relevant)
- HTML5 Canvas Game: 2D Collision Detection
- Adding collision detection to images drawn on canvas on StackOverflow
- Modals in Pure ES6 JavaScript
- KeyboardEvent Value (keyCodes, metaKey, etc) via CSS-Tricks
The window.requestAnimationFrame() method tells the browser that you wish to perform an animation and requests that the browser call a specified function to update an animation before the next repaint. The method takes a callback as an argument to be invoked before the repaint. Read more about this here.
Make sure you are comfortable with Object-Oriented JavaScript:
- What is an object?
- How is an object different from a primitive in JavaScript (e.g., can a primitive have methods?)
- What are some ways to create or instantiate a new object?
- How do you modify properties, or add/remove properties from an object?
- What is a constructor function (or class)?
- What is
this? What does it refer to and how is it used in different contexts (i.e., in a constructor function, a method, etc.)? - How do you add a property or method to a constructor's prototype?
- What is prototypal inheritance and how is it implemented?