Tutorial Blank Demo Cheatsheet

Hi there! I’m Gabriel, and I made GD with GD and DEMOLAND. I created this site because I needed a website to easily share code demos with my students. There are products out there that let you do this, but this one’s entirely open-source, which means that it’s free to run and you can launch your own DEMOLAND if you’d like!

The site’s still a work-in-progress, but in a future version I’ll include instructions on how to launch your own version. In the meantime, you can check out the GitHub repository to see this site’s code!

Credits

DEMOLAND was developed by GD with GD / Gabriel Drozdov. The site uses Limkin by Too Much Type and Geist Mono. Code editors are built using CodeMirror 5.

If you launch your own DEMOLAND, I’d appreciate it if you left these credits in! And send me an email if you’ve got questions or want to share your own DEMOLAND with me!

Welcome to DEMOLAND, a bookstore that runs on code and teaches it too!

Learn how to code websites using HTML, CSS, and JavaScript right in your web browser! Open a book to read chapters full of interactive demos you can edit and test without leaving this site.

Interested in diving deeper into learning design and development? Visit GD with GD for more resources!

🎓  Tutorial

DEMOLAND lets you books full of web demos that you can read, edit, and test right in your browser! Start here to learn how to use the site’s interface.

🛠️  Workshops

Every now and then, I’m asked to run a coding workshop introducing web programming or a topic related to websites. Each of these chapters represents one workshop.

Chapter 1

Introduction to Coding [RISD Fall 2025]

An overview of practices related to web programming, covering HTML, CSS, JavaScript, and JavaScript libraries!

Open chapter
Chapter 2

Variable Fonts Workshop [RISD Fall 2024]

Tutorials on importing, animating, and interacting with variable fonts, featuring fonts by Too Much Type!

Open chapter

đź”   Type+Code v2

What is code? What can we use it for? This book is an introduction to coding through the lens of web programming. We’ll cover object-oriented programming using JavaScript, and use HTML and CSS to create visual and interactive outputs.

Chapter 1

The Basics

Covering the fundamentals of HTML and CSS!

Open chapter
Chapter 2

Making Things Fun

Taking what we learned so far to make some neat websites!!

Open chapter
Chapter 6

Snippets

Use this code for your type specimens!

Open chapter

🤖  Introduction to Computation v1

What is code? What can we use it for? This book is an introduction to coding through the lens of web programming. We’ll cover object-oriented programming using JavaScript, and use HTML and CSS to create visual and interactive outputs.

Chapter 1

What is code?

Let’s get started by playing around with HTML and CSS!

Open chapter
Chapter 2

The basics

Introducing the basics of JavaScript: variables, data types, operators, conditionals, and functions.

Open chapter
Chapter 3

Answers to Technical 1

Try to answer these questions on your own first! You can access the assignment here.

Open chapter
Chapter 4

On a loop

How can we use code to do a whole bunch of things at once? With loops!

Open chapter
Chapter 5

Technical 2

Topics: random numbers, input elements, accessing data from arrays, for/while loops.

Open chapter
Chapter 6

Technical 2 Answers

Topics: random numbers, input elements, accessing data from arrays, for/while loops.

Open chapter
Chapter 7

Constructing data

We can store, access, and modify data (relatively) easily using arrays and objects.

Open chapter
Chapter 8

Fun with CSS

Let’s make self-portraits!

Open chapter
Chapter 10

Design Process

How can you use what we’ve learned so far to create something new?

Open chapter
Chapter 11

Objects (recap) and APIs

How can we handle data using JavaScript?

Open chapter