Examples
These examples all use the same MDAN model, but each one answers a different question about agent apps, interactive pages, and real integration paths.
When To Read Each Example
demo/agent-tasks
A fuller agent-first application demo.
Use this when you want to see a complete handoff loop: login, task creation, a stable task URL, agent-to-agent continuation, revision requests, completion, and a work-queue style overview page. This is the best place to study how MDAN holds long-lived task context in page Markdown while block fragments carry the current step.
examples/starter
The smallest starting point.
If you only want the shortest possible path, start here. It mostly matches the project shape generated by the scaffold and is the best place to understand the rest of the examples.
examples/guestbook
The smallest complete interaction loop.
Use this to understand full-page reads, block-local refreshes, and how the server returns the next interaction context after a write.
examples/auth-session
Multi-step interaction with session state.
Use this to study login, register, logout, page transitions, and how recoverable follow-up operations are returned in error cases.
examples/vue-starter
Vue-owned UI.
Use this if you want to keep the MDAN spec behavior and browser runtime, but render the UI with Vue.
examples/react-starter
React-owned UI.
Use this if you want to keep the MDAN spec behavior and browser runtime, but render the UI with React.
examples/express-starter
Integration with an existing backend.
Use this to see how an Express-style server adapts requests and responses into the MDAN runtime.
examples/marked-starter
Third-party Markdown renderer integration.
Use this to see how marked or a similar renderer can be used with both the server and the default UI.
examples/docs-starter
Docs site example.
Use this to see how a set of content pages, navigation, and a docs shell can be organized with MDAN.
Viewing Suggestions
- want to see the strongest end-to-end agent app example: start with
demo/agent-tasks - want the shortest path first: start with
examples/starter - want to see how agents continue across steps: look at
examples/guestbookandexamples/auth-session - want custom UI with Vue: look at
examples/vue-starter - want custom UI with React: look at
examples/react-starter - want an existing backend integration: look at
examples/express-starter - want to see how a docs site is organized: look at
examples/docs-starter