Lesson 6

Programming Overview

Breaking down behaviour

It's all well and good having a beautifully designed page (we're certain some of your apps will be more beautiful than others :). But if it doesn't do anything, it's a bit… pointless.

This is where JavaScript comes in. JavaScript is a programming language. It enables us to tell the app to respond to certain events, compute certain calculations, and essentially do the things we want it to do. In our case, this is to behave like an interactive quiz that asks a series of questions and saves the score. But you can do anything you can imagine using a programming language. The only limit is the speed of your hardware and your own imagination!

Let's do a quick intro to programming:

All programming languages are made of the same three ideas:

  • Variables –> Data
  • Functions –> Actions
  • Logic –> Decisions

Variables are the bits of information the program is concerned with.

Functions are predefined sections of code that do a certain thing.

Logic is the decisions the code needs to make at any given time.

It's always helpful to break down your desired outcome into the variables, the functions and the bits of logic we'll need to write.

Let's do this together.

Variables:

We'll need a score. We'll need to know what question we're on. We will also need to know the total number of questions. Can you think of any others? I can't!

Functions:

We will need to:

  • determine whether the user has answered the question correctly
  • increment the score
  • move to the next question

Logic:

What logical decisions might we make?

  • if user clicked on a span with a class of correct, increment the score and move to the next question

Note how logic makes use of our functions and variables. Logic is the glue that holds a program together.

Let's get cracking.

Go to the next lesson
Next Lesson