Drawing Shapes | Making a Lunar Lander in JavaScript Introduction 1. Drawing Shapes 2. Animating Shapes 3. Making the Spaceship 4. Forces and Gravity 5. Drawing Stars Published using GitBook A A Serif Sans White Sepia Night Twitter Google Facebook Weibo Instapaper Making a Lunar Lander in JavaScript Drawing Shapes In this lesson, we will learn how to draw simple shapes using HTML5 canvas. We are going to draw circles, rectangles and polygons in different colours. Setting up First of all, create a new folder where you will store all your code. If you have trouble coming up with a name, I named mine LunarLander. Then, in order to be able to open and preview our game in the web browser, let's write the HTML. Create a new file in the folder you created and name it index.html. Copy and paste the following into index.html:
Moon Lander
That's all the HTML we're going to write. We will never touch index.html again in this tutorial. I promise. But before we move on, let's explain the new tags. 
