About These Docs
A two-minute read before you dive in — what's where, and how the runnable code blocks work.
The Four Sections
- Quickstart (you're here) — install the package, get a document running from your terminal, and understand why Stof exists.
- Learn — fields, types, functions, the document graph, and so on. This is the reference for how the language actually works.
- Libraries — what's built into the runtime.
- Cookbook — real scenarios, patterns, and use-cases.
If you're new here, Quickstart → Learn is the natural path. Libraries and Cookbook are both reference material you'll come back to, not things to read start-to-finish.
Two Kinds of Runnable Code
You'll see code in two different shapes across this site, and they're demonstrating two different things on purpose.
Terminal examples — plain code blocks with a bash or typescript label, like the ones in Quick Start. Copy these into a real file and run them with Bun, Deno, Node, etc.
Live examples — code blocks with a Run button, like this one:
fn greet(name: str = 'World') -> str {
`Hello, ${name}!`
}
#[main]
fn main() {
pln(self.greet());
}These run Stof entirely in your browser, in the same WASM runtime that powers the language — no server, nothing installed. Click Run, and the Output panel expands below with whatever the document prints.
The #[main] Convention
Every live playground example in these docs follows one shape:
// fields, types, functions — whatever the example is about
#[main]
fn main() {
pln(/* whatever you want to see in Output */);
}
#[main] attribute in Stof marks all functions that the Run button calls. pln(...) is actually a Stof standard library Std.pln(...) function, overridden in this JavaScript context to write to a string — anything passed to it becomes a line in the Output panel.
Occasionally you'll see a playground print a function's return value directly instead, without a visible #[main] — those are demonstrating a single function in isolation, and the panel shows whatever that function returned. The #[main] + pln(...) shape above is the default you should expect everywhere else.
Why Quick Start Looks Different
The TypeScript snippets earlier in this section don't use #[main] — they use doc.call('hello') from the host application instead. That's not an inconsistency; it's the other half of the picture. #[main] is how a document declares its own entry point when something (a playground, a CLI, another service) just wants to run it. doc.call(name) is how a host reaches in and runs one specific function on its own terms. You'll use both, depending on which side of the wire you're on.
Everything from here through Learn, Libraries, and Cookbook uses the live-playground pattern. Nothing else to set up — go ahead and start with Quick Start.