Part 2: Spells, Beginner Incantations

Chapter 6: Telekinesis 101, Interactive

12: Code in Motion: P5.js Make an art collage, get things moving! Time to make pretty things

Browse the references & examples here to learn more: https://p5js.org/reference/ and https://p5js.org/examples/ to see what you can do with p5!

Use the live web editor to preview your code: https://editor.p5js.org/

Use N hotkey to auto deploy or use ND to manually deploy on https://app.netlify.com/drop

13: Ballpit physics: Matter.js Lets introduce something fancier, physics and gravity! Make a ballpit with matterjs & P5.js

To learn more We will use https://brm.io/matter-js/ to create a ballpit See demos here: https://brm.io/matter-js/demo/#mixed Code for demos: https://github.com/liabru/matter-js/tree/master/examples Tutorials: https://github.com/liabru/matter-js/wiki/Tutorials

Use N hotkey to auto deploy or use ND to manually deploy on https://app.netlify.com/drop

14: Games 101: ASCII text adventure game Use build a simple text adventure game. Old school ASCII style

Use N hotkey to auto deploy or use ND to manually deploy on https://app.netlify.com/drop

15: Basic game engine: Kaboom.js, phaser.js Get started building simple 2d game with https://kaboomjs.com/ or https://phaser.io/ First brainstorm a game to build, and then go make it

Use dalle to draw any assets needed

16: Game animation: Rive https://rive.app/ Use dalle to create a character Then use rive to animate them! Or create one from scratch!

then export it via the Rive runtime, to use in a game or website

Chapter 7: Dark Arts 101, Data

17: Calculator App Learn how basic math operations interweave with code

18: Todo list, CRUD A classic in coding. Create a todo list. Learn the basics of CRUD Save your todos to a database so you can come back to them later.

19: Habit tracker Create a habit tracker Learn the basics of CRUD Save your habits to a database so you can track and analyze them

20: Chess Build the classic game of chess

For bonus points -Add new rules or pieces -Build an ai that plays against you

Chapter 8: Earthbending 101, Build your blog!

Pick one blog to make, depending on how fancy you want to get

21: Create a blog, you have a few options. -Blog with .md files Setup a simple static blog using .md files as posts. Create components for the header, footer, and post. Optional: Use a static site generator.

-Blog using notion as a cms / database Setup a blog using notion as a cms & database This will require setting up a backend server such as express.js, in order to fetch notion data using an api key Create tables and/or pages in notion, for blog posts and any other kinds of content Create a notion integration https://www.notion.so/my-integrations Use browser tool to look up documentation here: https://developers.notion.com/docs/getting-started Link it to your site

-Blog using ghost or another dedicated platform Build a blog using https://ghost.org/ Host with ghost and use a template, or customize the template in handlebars, or run it as a headless cms and build your own. Use browser tool to look up documentation here: https://ghost.org/docs/