Learn to code with real game data

Wild Willows is a game about bringing a nature preserve back to life. Everything in it, all 150 animals and the six biomes they live in, is published as a public API that anyone can use. These two pages teach you to build a webpage out of it.

Free No account Nothing to install Runs in your browser
Start here

The Lesson

Ten chapters, from “what is HTML” to a working page full of live data. Every code sample is editable, and you press Run when you want to see what it does. You cannot get to the end without having written something.

  • HTML, CSS and JavaScript, and what each one is for
  • What an API is, and a real request you can watch happen
  • if and else, and looping through 150 records
  • Building a page from data you fetched yourself
  • Optional Going Deeper panels on every chapter

Start the Lesson

Or build something

The Code Builder

Three files, a preview and the same game data. Open it when you have an idea of your own, or when you finish the Lesson and want room to work.

  • index.html, styles.css and main.js, side by side with the page they make
  • Thirty project ideas if you need one
  • Plain-language explanations when something breaks
  • Your work saves in your browser, and downloads as a real file

Open the Code Builder

What you need

A browserAnything current, including a school Chromebook. A keyboard helps a lot.
No accountNothing to sign up for and nothing to log into. Your work stays in your own browser.
No experienceThe Lesson starts from the first line of HTML. Nothing before it is assumed.

The data

One address, open to anyone, no key required. It answers with every animal, biome, resource, recipe and craftable object in the game.

https://wildwillows.app/GameData

Which means this is a whole program that shows you something real:

const response = await fetch("https://wildwillows.app/GameData"); const data = await response.json(); console.log(data.animals[0].name); // "Banana Slug"

You are welcome to use it in your own projects, in or out of school. It is the same data the game runs on, so when the game changes, so does this.

The full field reference lists every key in the response, with JavaScript, Python and curl examples.

Teaching this?

There is a page for you: what each chapter covers, how long it takes, what to expect students to get stuck on, and printable material for the ecology side of the game.

For teachers