Soccer

A simple soccer game. Created by Hack Club staff.

This workshop has been retired and is no longer maintained or recommended.

Note to leaders running this workshop: we’re replacing Soccer with Dodge. We recommend running this in your clubs instead.

In this tutorial, we’ll walk you through building a single-player soccer game.

From there, the tutorial is designed to have you continue to expand on your game. Here is an example of what you could end up making:

Don’t feel that you have to follow along step-by-step. Figure out the best way to navigate this tutorial for you. This might look like the following:

If you have never programmed before:

If you have programmed a little:

Huzzah! Feel free to follow along step-by-step and skim through sections you understand.

If you have more experience:

You already know the basics of coding. Your goal here is to learn how to use the JavaScript game frameworks p5.js and p5.play.js and then make your own stuff with it.
You might spend most of your time jumping around from section to section and just picking and choosing what you need.

If you’re more experienced and want to use your own editor, follow these instructions.
If you haven’t already, make sure you have a JS Bin account first. Create one here.
Then open this JS Bin. It has all the starter code we need for this tutorial. Write any new code in this JS Bin. We’ll refer to this JS Bin as your “working bin”.