Coding for Visual Learners: Learning JavaScript from Scratch
4h 19mBeginner2022-04-13
Authors

Engin Arslan
Front-End Developer and a former Visual Effects Artist
Course details
Completely new to coding? This engaging course can help you pick up the popular JavaScript programming language, as well as a programming library called p5.js. As instructor Engin Arslan steps through the basics of JavaScript—discussing everything from operators to arrays—he focuses primarily on programming using JavaScript and p5.js and secondarily on creating visuals. And in contrast to many traditional coding courses, all of the content covered here is presented in a fun, compelling manner that helps visual learners grasp the material. To wrap up the course, Engin shows how to use your new coding skills to build an interactive game that can be deployed online.
Skills covered
Ecma InternationalJavaScriptLearningProgramming LanguagesSoftware Development
Concepts
0. Introduction
- 01 - Introduction
- 02 - Why learn JavaScript
- 03 - Learning JavaScript with p5.js
1. Getting Started
- 04 - Environment setup
- 05 - Getting started with JavaScript
- 06 - Variables
- 07 - Data types in JavaScript
- 08 - Getting started with p5.js
- 09 - Coordinate system in p5.js
2. Colors
- 10 - Color functions in p5.js
- 11 - Setting the color of the shapes
3. Operators and Variables
- 12 - Operator precedence
- 13 - Variables continued
- 14 - Variable scope
- 15 - Predefined variables in p5.js
4. Conditional Statements and Comparison Operators
- 16 - Frame, frameRate, frameCount
- 17 - Conditionals
- 18 - Else Block
5. More p5.js Variables
- 19 - MouseIsPressed
- 20 - MouseX and mouseY
6. Loops
- 21 - For Loop
- 22 - Nested loops
- 23 - Random function
- 24 - Noise function
7. Functions
- 25 - Creating functions
- 26 - Return keyword
8. Objects
- 27 - Introduction to JavaScript objects
- 28 - Object methods and 'this' keyword
- 29 - Constructor functions
9. Arrays
- 30 - Working with arrays
- 31 - Array.length property
- 32 - Remainder operator
10. Events
- 33 - MousePressed event function
- 34 - KeyPressed event function
11. More p5.js
- 35 - Rotate and translate
- 36 - Push and pop functions
12. Final Project
- 37 - Let's build a game
- 38 - Creating a number object
- 39 - Animating text
- 40 - Player interaction
- 41 - Player feedback
- 42 - Restarting the game
- 43 - Improving the player experience
Conclusion
- 44 - Congratulations
Related courses
- Excel: Macros in Depth
- Creating Agents with Python and the AI Toolkit for Visual Studio Code
- Learning Autodesk Subassembly Composer
- Visual Studio Code Productivity Tips
- AI-Powered Development: GitHub Copilot in Visual Studio
- Learning Webflow
- Emmet: Fast and Efficient Web Coding
- Visual Studio Code Productivity Tips (2019)
Related learn paths
- Data Science Professional Certificate by KNIME
- Moving from Data Analyst to Data Scientist
- Prepare for Digital Accessibility
- Moving from Data Scientist to Data Analyst
- Getting Started with R for Data Science
- Learning Codeless Machine Learning with KNIME
- Master Advanced Excel Data & Analytics Skills
- Succeed as a Remote Software Developer