This summer package is ideal for students who are interested in learning JavaScript language. This course will help students understand the most popular front-end technology and will prepare them for a career as a Front-End Web Developer.

Over the course of 6 weeks, 5 days a week, 90 mins per day, they’ll join other students in a virtual classroom as they learn the fundamentals of JavaScript language. By the end of the 6th week, they should have a good understanding of the language and would have already created two gaming projects using HTML and JavaScript. Students would also learn basics of each technology used in web application development and design while also help them think algorithmically and develop good programming habits. Ideal for grades 10 through 12.

No prior coding experience is required, although it would be nice if students have already completed Coding Fundamentals Beginner Levels and Coding Fundamentals Intermediate Levels. Students should have reliable internet connection and good understanding/usage of computer and Zoom.

Weekly schedule is as such:

Week 1

JavaScript 1: This course will teach the fundamentals of native JavaScript language, taking students from beginner to intermediate level. In this class students will learn the basics of JavaScript including:

• Intro to JavaScript
• Document & DOM (Document Object Model)
• getElementById
• Query Selector
• JavaScript variable, assignments, operators, arithmetics

Week 2

• Data Types: String, Number & Object
• String methods
  • Slice, substring, substr
  • Replace: replace first occurrence or all
  • Convert to UpperCase or LowerCase
  • Concat, trim, charAt
• Search String methods
  • indexOf, lastIndexOf, startsWith, endsWith
• Functions
• Objects
• Events: onchange, onclick, onmouseover, onmouseout, onkeydown, onload
• Event Handlers

Week 3

• Number Data Type
• Number methods
  • toString, valueOf, Number, parseInt, parseFloat
• JavaScript Array and its methods
• Iterating Array
• Sorting Array
• Dates, Date Formats, Date Get Methods and Date Set Methods
• Random number generator

Week 4

• Booleans
• Comparisons
• Conditions
• Switch statement
• Loops
  • For loop
  • For In loop
  • While loop
• Sets
• Maps

Week 5

• What is HTML Canvas?
• Discuss First Project
• Draw Text, Rectangle, Square, Circle
• Make Canvas interactive, animated
• Draw line, create gradients
• Breakout game

Week 6

• Draw rectangles and circles
• Discuss 2nd Project
• Move the rectangles and circle within the canvas by trigger events on DOM
• Destroy objects on collision with another object
• Increase score
• Reduce lifeline within the game