First Introduction to Programming

This is a brief (~ 20 min) course I developed a few years ago as a very first introduction to programming games on the web. It is Lesson 1 in the “Maleny Game Makers” series. It is still completely relevant today.

Part 1 : What makes a webpage?

Part 2 : Use other’s code

Part 3 : My first webpage

Part 4 : Head section

Part 5 : Javascript

Part 6 : More Javascript : Variables and KeyCodes

Part 7 : Move the Circle

Part 8 : Questions and Answers

Part 1 : What makes a webpage?

HTML, CSS, and JS

HTML is the information on the page

CSS is how it looks

JS is what it does

To make a game using HTML, we mostly work with JS (Javascript)

All websites are made from HTML

You can see the HTML code for this website by opening the developer tools in your web browser and clicking the “Elements” tab.

To open the developer console window on Chrome, use the keyboard shortcut Ctrl Shift J (on Windows) or Ctrl Option J (on Mac). Alternatively, you can use the Chrome menu in the browser window, select the option “More Tools,” and then select “Developer Tools.”

Part 2 : Use other’s code