Illustrated JavaScript Computer Science Curriculum for schools

Illustrated JavaScript Curriculum

Illustrated JavaScript Computer Science Curriculum for middle schools, high schools and coding clubs
Illustrated JavaScript course

Teach JavaScript using our PowerPoint slides

We put together a professionally illustrated JavaScript coding course in PowerPoint format. With over 700 slides and 300 mini-projects, this course is a comprehensive and well-structured solution for teaching JavaScript and creative coding. The course uses a pragmatic approach, where students learn JavaScript by building fun graphical programs and mini games.

Why PowerPoint format? So you can edit and customize the course for your class level and allocated time.

Suggested grade levels: 8th - 12th, Higher Education

Download JavaScript Course Sample

See for yourself!

Experience the “Illustrated JavaScript coding course” for yourself by downloading a sample of this course. The sample contains the first 30% of the course and is provided in PDF format (for easy viewing).

This sample is a PDF, but the full course is available as PowerPoint .PPTX files.

Download First 200 Slides
Purchase All Slides
Unlock Incredible Value with
Our Introductory Offer

JavaScript language

The course covers JavaScript comprehensively, starting from the basics and progressing to advanced topics like closures and classes.

Creative coding

Students acquire JavaScript skills through building creative coding projects, which result in captivating canvas patterns or engaging animations.

Game building

Additionally, the course covers the fundamentals of game development, including topics like game loops, keyboard and mouse interaction, and the construction of games featuring animated sprites.

Syllabus

Where to type the code

12 slides

What is coding? Where do I type my programs?

Let's write some code

29 slides

First steps into the wonderful world of coding. In this first lesson we will learn about canvas and graphical coordinates and how to draw circles on the canvas. We will then use the circle instruction to write a complete program that draws a bear!

Shapes

22 slides

We will extend our toolbox with new graphical instructions that draw various shapes on the canvas. We are now better equipped to draw complex scenes with code.

Shape attributes

26 slides

In this lesson we will see how to control the drawing color, the line thickness and text size. Our drawings are now better looking.

Variables

39 slides

Variables are a core concept of any JavaScript program. In this lesson we’ll learn how to declare variables and assign values to them. We will see plenty of practical examples that showcase the benefits of using variables inside programs.

Conditional statements

24 slides

Let's see how to program the computer to execute one instruction or another based on a condition. We will learn about the if and if-else keywords, about comparison operators and how to use them to implement engaging programs such as a solver program for the quadratic equation.

For loops

36 slides

In this lesson we'll learn about for loops and how to use them to automate repetitive tasks by instructing the computer to perform a set of actions a certain number of times. The lesson is packed with practical exercises such as drawing concentrical circles, calculating factorial of a number and graphing the sine function.

Nested for loops

23 slides

A nested for is a loop within a loop. Nested for loops are handy for dealing with multi-dimensional data or situations where you need to perform a series of operations within another series of operations. We will exemplify this with a series of graphical programs that displays various patterns on the x and y axes of the canvas.

Functions

31 slides

Until now we only consumed instructions (aka functions) provided by the system. In this lesson we will learn how to define new functions in order to modularize our programs. There are plenty of fun exercises such as calculating prime numbers and even calculating PI.

Animations

33 slides

This is a fun lesson! We will learn about how to animate shapes on the canvas and implement bouncing circles and moving cars!

Keyboard and Mouse

46 slides

Learning how to read keyboard and mouse input opens the door to implementation of interactive programs such as drawing apps or mini-games. The main focus of this lesson is the implementation of Paddle Smash game.

Arrays

43 slides

What is an array? How can use arrays to store big lists of numbers and strings? We will learn about the support that JavaScript offers us for working with arrays and we will also implement a series of fun programs that use arrays as core data structures.

Strings

35 slides

Do you want to manipulate text in your code? This is the right lesson for that. We will learn how you can use strings to store and manipulate textual information. The flagship project of this lesson is implementation of Caesar Cipher – an educational encryption / decryption algorithm.

Objects

45 slides

Arrays are great for storing lists of unrelated items, but objects shine when we need to store a bunch of related pieces of data. A fun lesson that will use objects to implement graphical programs such as bouncing balls and falling spiders.

Making games with built-in sprites

45 slides

Making games is the dream of many young coders. Making games is also a great opportunity to better learn programming in a fun and engaging way. In this lesson we will learn core game building concepts such as the game loop and how to manipulate sprites. The lesson concludes with a mini game called Plane vs Objects.

Making games with custom sprites

43 slides

Did you know that you can design sprites on paper and then transfer them in your code? This lesson will focus on this topic, allowing you to create games with custom drawn graphics.

While loops

34 slides

Do you remember the for loops? While loops are a similar construct that allows you to create loops in your programs. We will practice the new keyword with a series of exercises such as finding Fibonacci numbers, finding prime numbers and even implementing a simple Bubble sort algorithm.

Functions as data

35 slides

In JavaScript functions are first class citizens. They can be treated just like any other data type, such as numbers or strings. We will see how to leverage this concept in a series of exercises such as implementation of a UI Button with a callback.

Functions inside objects

25 slides

Since functions can be treated as any data type, we can also store them inside objects fields. This lesson introduces new concepts such as encapsulation and how to use objects to model complex entities that contain both data and behaviors. The flagship project of the lesson is the implementation of “Two paddle pong” game.

Closures

26 slides

A function inside a function! Yes – that’s possible in JavaScript. We will see how this is a useful concept in implementation of modules. We will exemplify the concept by rewriting the bouncing bubble exercise using closures.

Classes

41 slides

Classes provide the blueprint for creation of objects. We will see how classes help programmers to encapsulate data and behaviors of an entity and how to create a series of objects of the same type. The project of this lesson is a fun game called “Safari adventures”.

Coding course features

Why purchasing this course?

Although codeguppy.com is a free coding platform, the “Illustrated JavaScript coding course” is a paid resource. Here are a few reasons why purchasing this course makes sense:

  • you're saving tons of time in developing the curriculum for your coding class (the course includes over 700 slides and 300 exercises)
  • you're offering students an unforgettable code learning experience (the course contains fun activities and is illustrated with custom drawn characters)
  • you're saving tons on money over alternative subscription-based services (you purchase the course one time and use it with all your classes in perpetuity)
  • you have the option to customize the course for your needs (course comes in PowerPoint format)
  • you support coding education and the free coding platform codeguppy.com

Why pay for “Illustrated JavaScript coding course” and not use a free coding course? Free coding courses exist and indeed they'll save you some money. However, many have boring and unattractive content, others are licenses just for individual use and not for classroom use.

Coding course features

Perpetual license

Purchase “Illustrated JavaScript coding course” once and use it forever at your classroom or coding club use. The course comes with a perpetual license for one teacher.

By purchasing this course you're saving thousands of $$$ over equivalent subscription-based services.

Example 1: Coding service 1 asks for $5 / student / month license fee. A class of 10 students will cost you $50 / month or $600 / year. In 5 years, you'll pay $3500!

Example 2: Coding service 2 asks for $1500 / class / year. In 5 years you'll pay $7500

With “Illustrated JavaScript coding course” you pay a onetime flat fee of $350! This will get access to the PowerPoint slides that you can use in perpetuity with your current and future classes.

Purchase Illustrated JavaScript Course
Introductory Price: $200 $350

Purchase Slides
We are selling the slides through the GumRoad platform. Clicking the button will take you to GumRoad's website.

Special offer: Get this course for free!

Post a review or article about codeguppy.com on your educational institution's website and get this course for free. Contact us for details.