JavaScript for Kids

One

Getting Started with JavaScript

Choosing a JavaScript Editor
Picking your test Browser

Embedding your JavaScript code
Creating Comments
Using the alert()method for output
Adding the semicolon

Creating a variable for data storage
Asking the user for information
Responding to the user

Comparing literals and variables
Including spaces in your concatenated phrases

Introducing object-based programming(and cows)
Investigating the length of a string
Using string methods to manipulate text

Adding numbers
Adding the user's numbers
The trouble with dynamic data
The pesky plus sign

Using variable conversion tools
Fixing the addInput code

Two

Talking to the page

Understanding the Document Object Model

Previewing the DOM
Getting the blues, JavaScript style
Writing javaScript code to change colors

Managing Button Events

Adding a function for more ...functionality
Making a more flexible function
Embedding quotes within quotes
Writing the changeColor function

Managing Text Input and Output

Introducing event-driven programming
Creating the HTML form
Using getElementById to get access to the page
Manipulating the text fields

Writing to the Document

Preparing the HTML framework
writing the JavaScript
Finding your inner HTML

Working with Other Text Elements

Building the form
Writing the function
Understanding generated source
What if you're not in Chrome?

Three

Decisions and Debugging

Making Choices with If

Changing the greetings with if
The diferent flavors of if
Conditional Operators
Nesting your if statements
Making decisions with switch

Managing Repetition with for Loops

Setting up the web page
Initializing the output
Creating the basic for loop
Introducing shortcut operators
Counting by fives
Understanding the Zen for loops

Building While Loops

Making a basic while loop
Getting your loops to behave
Managing more complex loops

Managing Errors with a Debugger

Debugging with the interactive console
Debugging Strategies
Resolving syntax errors
Squashing logic bugs

Four

Functions, Arrays and Objects

Breaking Code into Functions

Thinking about structure
Building the antsFunction.html program

Passing Data to and from Functions

Examining the makeSong code
Looking at the chorus
Handling the verses

Managing Scope

Introducing local and global variables
Examining variable scope

Building a Basic Array

Accessing array data
Using arrays with for loops
Revisiting the ants song

Working with Two-Dimension Arrays

Setting up the arrays
Getting a city
Creating a main()function

Creating Your Own Objects

Building a basic object
Adding methods to an object
Building a reusable object
Using your shiny new objects

Introducing JSON

Storing data in JSON format
Buiilding a more complex JSON structure

Five

Getting Valid Input

Getting Input from a Drop Down list

Building the form
Reading the list box

Managing Multiple Selections

Coding a multiple selection select object
Writing the JavaScript Code

Check, Please: reading Check Boxes

Building the form
Reading the list box

Managing Multiple Selections

Coding a multiple selection select object
Writing the JavaScript code

Check, Please: Reading Check Boxes

Building the check box page
Responfing to the check boxes

Working with Radion Buttons Interpreting Radio Buttons Working with Regular Expressions

Introducing regular expressions
Using Characters in regular expressions
Marking the beginning and end of the line
Working with special characters
Conducting repetision operations
Working with pattern memory

New HTML5/CSS3 Tricks for validation

Adding a pattern
Marking a files as required
Adding placeholder text

Six

Drawing on the Canvas

Canvas Basic

Setting up the canvas
How canvas works

Fill and Stroke Styles

Colors
Gradients
Patterns

Drawing Essential Shapes

Rectangle functions
Drawing text
Adding shadows

Working with Paths

Line-drawing options
Drawing arcs and circles
Drawing quadratic curves
Building a Bezier curve

Images

Drawing an image in the canvas
Drawing part of an image

Seven

Animations with the Canvas

Transformations

Building a transformed image
A few thoughts about transformations

Animation

Overview of the animation loop
Setting up the constants
Initializing the animation
Animate the current frame
Moving an element
Bouncing off the walls

Reading the Keyboard

Managing basic keyboard input
Moving an image with the keyboard

Start learning

Subscribe to our Newsletter for latest news.

If the pdf download does not work, try a different browser

Grade R-3

Grade 4-8

Grade 9-12

Holiday Coding/Robotics Camps

Complete Beginners

Coding Bootcamps

Beginners (5 days each)

Java (5 days each)

JavaScript (5 days each)

PHP (5 days each)

Python (5 days each)

.NET (5 days each)

JavaScript for Kids

Intended Audience

What do I need?

Certification

Duration

Outcomes

One