• OPENING SCENE
• Introduction
• Jumping Right In
• Jumping Right In
• Choose your own Adventure
• Getting Started
• Building a World
• Adding Movement
• Create a Game Space
• Making Things Happen
• Adding a Reward
• Hazards and Enemies
• Adding Game States
• GAME MECHANICS
• Game Mechanic: Add a Countdown Timer
• Game Mechanic: Jumping on Enemies
• Game Mechanic: Player Health
• Game Mechanic: Longer Jumps if Holding Jump Down
• Game Mechanic: Smaller Sprite Collision Boxes
• Game Mechanic: Extending the Game Size
• Game Mechanic: Adding Levels
• Game Mechanic: Keys and Doors
• ADDING POLISH
• Polish: Animate Sprite when Zapped
• Polish: Scaling our Game and Sprites
• Polish: Screen Shake
• Polish: Add Soundtrack Music
• Polish: Explosions using Particles
• Appendix
• Summary of our approach to learning Game Making
• How we approach Coding
• Playful and Reflective Approaches

How we approach Coding

This section is for people who already know about Javascript and have ideas about how to best teach it. You can skip it if you just want to get started. But it is included right at the start of the book as it is a topic that the contributors to this project are very interested in debating. You can weigh in here - https://github.com/webgameclubs/edlab-gamemakers-club/issues/20

There are many ways of writing Javascript, more so that many languages. In this guide we try to approach writing code using the following principles which we hope will make it easier for beginners to get started. Don't worry if you are beginning and this part doesn't make sense to you. You can skip it and come back to it later. These concepts are listed here and explained in more details later.

THIS PART OF THE BOOK IS VERY MUCH UP FOR REVIEW AND DEBATE. Please let us know if you object to this approach, we will try to put our justifications below.

1. Make Code as Readable as Possible: Ideally new coders should be able to look at code examples and understand roughly what is happening
2. Use Global Variables: declare variables them at the beginning of your code before your other game objects
3. Do Repeat Yourself: this is the opposite of a coding convention called DRY which stands for Don't Repeat Yourself
4. Start as hard as you going to get: Start as complex as you have to but move slowly

Make Code as Readable as Possible

There are different approaches to make this happen. We are at an advantage as we are using a relatively supported framework an a cleanish browser programming environment. As such, conflicts on a scope level are less likely to happen. Making code readable involves specifically naming the object which data is being added to at times. For example we think that it is more readable to have the following line of code

    if (player.body.velocity.x < 0) 

than this one

    if (this.body.velocity.x < 0) 

As such to start with code is structured to avoid the use of this and certain object oriented approaches. However, as learners progress, the value of using this as a keyword to allow code examples to be reused by learners increase, we introduce its use gradually.

Use Global Variables

Therefore to make it possible to use those object variables directly without using this, it is sometimes necessary to declare variables you will be using  at the beginning of your code before your other game elements, and thus put them in the global (window) space. While this may go against some good coding practices, this is justified by the point above about making coding readable.

Do Repeat Yourself (at least at the beginning)

Elegant coding practices are to be admired and are sometimes expressed as DRY which stands for Don't Repeat Yourself. However sometimes the principle can be time consuming as you design to make your code elegant rather than getting up and running quickly. It can also make it harder to read for beginners.

One example of this is the use of platforms. Our tutorials create the platforms one after the other repeating similar lines of code. In the second half of the book this platform information is restructured into a json file and a for loop which cycles through that location data.

Start as hard as you going to get

This is referring to the coding structures that you use. If you are going to used simplfied structures and conventions, then make sure you can keep using these structures until the end of your project. This is because refactoring a project to bring in new knowledge can be hard to deal with as a new learner. You think you understand the process but then you have to adapt. Think carefully about when you need to upgrade.

In this guide we start with game states in place, for example the playState. Although this is more complicated than putting the preload, create and update functions directly in the game object, it means that we do not have to restructure the code when restarting our game or adding a welcome screen.

There is a bit of a jump up in the way our code is structured between the first half of this book and the second half. However, we aim to explain exactly why this is needed and use the process as a way of learning more about coding concepts.