Coding for Visual Learners: Learning JavaScript from Scratch

Introduction

• Getting started
• Why learn JavaScript?
• Learning JavaScript with p5.js

1. Getting Started

• Environment setup
• Getting started with JavaScript
• Variables
• Data types in JavaScript
• Getting started with p5.js
• Coordinate system in p5.js

2. Colors

• Color functions in p5.js
• Setting the color of the shapes

3. Operators and Variables

• Operator precedence
• Variables, continued
• Variable scope
• Predefined variables in p5.js

4. Conditional Statements and Comparison Operators

• frame, frameRate, frameCount
• Conditionals
• Else block

5. More p5.js Variables

• mouseIsPressed
• mouseX and mouseY

6. Loops

• For loop
• Nested loops
• Random function
• Noise function

7. Functions

• Creating functions
• Return keyword

8. Objects

• Introduction to JavaScript objects
• Object methods and the 'this' keyword
• Constructor function

9. Arrays

• Working with arrays
• Array.length property
• Remainder operator

10. Events

• mousePressed event function
• keyPressed event function

11. More p5.js

• Rotate and translate
• Push and pop functions

12. Final Project

• Let's build a game
• Creating a number object
• Animating text
• Player interaction
• Player feedback
• Restarting the game
• Improving the player experience
• Fixing bugs

Conclusion

• Congratulations