63 lines
2.2 KiB
Markdown
63 lines
2.2 KiB
Markdown
# The `.wrn` language vision
|
|
|
|
`.wrn` is a planned single-file component language for WrNexus. One file can
|
|
declare page state, view markup, SSR/client data bindings, styles, and realtime
|
|
handlers, and the compiler lowers all of it to the TypeScript primitives the
|
|
runtime already understands. Business logic should live in normal `app/api`
|
|
route files; `.wrn` data bindings call those routes and render the response.
|
|
|
|
## Example
|
|
|
|
```my
|
|
page Home {
|
|
state count = 0
|
|
|
|
ssr {
|
|
api users GET /api/users {
|
|
return users.map((user) => user.name).join(", ")
|
|
}
|
|
}
|
|
|
|
client {
|
|
api latestUsers GET /api/users/latest {
|
|
return users.map((user) => user.name).join(", ")
|
|
}
|
|
}
|
|
|
|
view {
|
|
<h1>Hello</h1>
|
|
<button @click="count++">Count: {count}</button>
|
|
<div api="users">Loading users...</div>
|
|
<div api="latestUsers">Loading latest users...</div>
|
|
}
|
|
|
|
realtime chat {
|
|
on message(data) {
|
|
broadcast(data)
|
|
}
|
|
}
|
|
}
|
|
```
|
|
|
|
## Lowering targets
|
|
|
|
| `.wrn` construct | Compiles to |
|
|
| ----------------------------------------- | ------------------------------------------------------- |
|
|
| `state x = 0` | a `data-scope` seed hydrated by the reactive runtime |
|
|
| `view { ... }` | a page component returning an SSR HTML string |
|
|
| `@click="count++"` | a `data-on-click` binding in the reactive runtime |
|
|
| `{count}` | a mustache text binding evaluated against `data-scope` |
|
|
| `ssr { api users GET /api/users { } }` | server-side API call + HTML replacement before response |
|
|
| `client { api users GET /api/users { } }` | opaque CSR binding resolved through `/__wrnexus/csr` |
|
|
| `realtime chat { }` | a `websocket` export in the realtime router |
|
|
|
|
## Pipeline
|
|
|
|
```
|
|
.wrn source ──▶ tokenizer ──▶ parser ──▶ AST ──▶ codegen ──▶ .ts ──▶ Bun runtime
|
|
```
|
|
|
|
The MVP now includes tokenizing, parsing, and code generation for a small real
|
|
subset. Future milestones can add richer expressions, typed data contracts,
|
|
component composition, and a safer custom expression evaluator.
|