Blocks Editor

Visual block programming, right in the browser.

Build programs by dragging and dropping blocks — declare variables, loop, branch, define reusable functions, and watch execution step-by-step. Export to JavaScript or Python.

bbe.kendlbat.dev

---

Features

• Drag & drop editor — Blocks snap into place. Delete with a click.
• Step-by-step execution — Watch your program run block-by-block with live highlighting.
• Inline output — See values right on the block that produced them.
• Reusable functions — Define functions with typed parameters, call them from anywhere.
• Export — JavaScript, Python, or .kbb workspace files.

Stack

Astro · Svelte 4 · Tailwind · Flowbite · TypeScript

Commands

pnpm install
pnpm run dev      # localhost:4321
pnpm run build    # typecheck + prod build

---

Made by kendlbat