← Waypoints tutorials

Code

Learn to program by predicting, running, investigating, modifying and making. Three pathways share the same big ideas; start with whichever fits your class.

Python

From drawing with a turtle to apps, games and machine learning.

Extensions

Objects with turtlesBuild a falling-stars game with lots of turtles.Build a falling-stars game with many turtles, and tidy it step by step: from separate variables to lists, dictionaries and classes.After: Console bridge: text in, text outData detectiveFind the story hiding in a real data set.A real data set in Python: read a CSV, count, average and find the biggest, draw a bar chart, clean messy data and check it with test cases, then build a dashboard.After: Console bridge: text in, text outDeeper Python in the consoleText, lists and errors, then a text adventure that saves.One idea at a time, in the console: text, lists, dictionaries and errors, then a text adventure built from all of them, saved to a file.After: Console bridge: text in, text outApps with GradioTurn your Python into apps people can click.Turn Python functions into apps with inputs and outputs: a greeter, a calculator with several inputs, and a quiz built from a list of questions, in an in-browser stand-in for Gradio that runs the same code as the real thing.After: Console bridge: text in, text outMachine learning with GradioTeach a computer to recognise penguins, then put it in an app.How a computer learns from examples: rules by hand, a nearest-neighbour model written yourself, fair testing, then scikit-learn and a model behind a Gradio app, with what models get wrong.After: Data detectiveGames with microStudioMake a real game in a real game engine.Make a real game in Python on microStudio, a free game engine in the browser: a game loop, keys, stars as objects, catching and scoring, then sprites, sound and sharing.After: Objects with turtlesWeb apps with FlaskPut Python behind your own web pages.Your own HTML pages with Python behind them: routes, pages built from data, forms, saving to a file and JSON, ending with the same API in FastAPI.After: Console bridge: text in, text out and Structure and style a page

Web

Build pages, then make them draw, move and react.

Extensions

Pages with BootstrapMake a page look polished in minutes with ready-made parts.Rebuild the club page with Bootstrap's ready-made parts: buttons, a navbar, cards, a grid and a form, styled by class names instead of your own CSS. Then compare it with the hand-built page and make Bootstrap look like yours.After: Layout and componentsDrawing and animation with p5.jsDraw and animate with JavaScript.Draw and animate with JavaScript and p5.js: shapes, movement, decisions, lists, objects and functions, ending in a small game you build yourself.After: Structure and style a pageThe DOM and the browser consoleMake a web page react when people click and type.Make a real web page react with JavaScript: find elements, change them, listen for clicks and typing, and keep a list and a score, ending in a quiz page you build.After: Drawing and animation with p5.js and Layout and componentsApps with VueBuild apps where the page keeps up with your data by itself.Build pages that keep up with their data by themselves: data shown with {{ }}, lists with v-for, choices with v-if, events and inputs, computed values and components, ending in a to-do app. An optional last lesson builds the same app in Vue, Preact and Svelte.After: The DOM and the browser consoleYour site, for realMake your page work for everyone, then put it online.Bring any page you have made (hand-built, Bootstrap or Vue) and get it ready for real people: check it works for everyone, then put it online. No new framework: it works the same on every page.After: Layout and componentsWeb apps with FlaskPut Python behind your own web pages.Your own HTML pages with Python behind them: routes, pages built from data, forms, saving to a file and JSON, ending with the same API in FastAPI.After: Structure and style a page and Console bridge: text in, text out

MakeCode

Blocks first, then Python, with real devices and games.

For teachers: Create a lesson