EXAMPLE · Example 7.1
A toy checkout space
The simplest real Anglish program — one UI space, one data binding.
The smallest example that shows every piece of an Anglish declaration: a UI space, a vibe block, a data binding, and a referenced task.
@checkout:UI
>>> A web-based checkout form with fields for shipping, billing, and payment.
>>> The form inputs are bound to %checkoutForm.
>>> When %checkoutForm is submitted, use $validateForm.
What this declares
@checkout:UIcreates a UI space calledcheckout. As a UI space, it has built-in space-native tasks ($ui_reader,$ui_writer) that can be customised through vibe blocks.%checkoutFormis a data binding inside the space — a structured object that holds user input.$validateForm(declared elsewhere) is a task bound to the form-submission event, given%checkoutFormas input.
What the compiler does
It builds the Space–Path Graph:
- A
:UInode is created forcheckout. - A binding for
%checkoutFormis attached to that node. - A reference to
$validateFormis recorded; the compiler will require it to be declared somewhere in the program.
If $validateForm doesn’t exist, the build fails with a clear identifier-not-found error. If %checkoutForm is referenced but never bound to fields, that’s also caught.
What you’d typically add next
A second UI subspace via dotted name (@checkout.payment:UI), a :FUNC space for $validateForm, and a :DATA space for persisting the order. See composing two forms for the next step.