vercel-labs--zero-native/examples

Native SDK Examples

Most examples here are zero-config apps: app.zon + src/ (+ assets/) and nothing else. The native CLI owns their build — run any of them straight from its directory:

native dev     # build and run with hot reload
native test    # run the app's test suite
native build   # produce a ReleaseFast binary in zig-out/bin/

(In this repository the CLI is zig-out/bin/native, built by zig build at the root.) A handful of examples own a build.zig because they genuinely outgrow the generated graph — each one's build file opens with the reason.

Zero-config apps (native-rendered)

Example	Shows
habits	The smallest markup app: one .native view, a plain-form Model/Msg/update.
calculator	A complete small app: markup keypad, text-field keyboard path, chrome shortcuts, theming.
notes	Persistence through the effects channel: debounced writes, restore on boot, dialogs, search.
kanban	Builder-view boards with drag interactions.
feed	Windowed 100k-row list virtualization with runtime-owned scrolling.
soundboard	Album grid with decoded cover art, context menus, timers, and a custom theme.
deck	Two model-declared windows and a dense track ledger.
markdown-viewer	Real file I/O through effects, hidden-inset titlebar retrofit, preview + editor.
code-editor	Platform folder picker, bounded filesystem tree, and syntax-highlighted source editor.
system-monitor	Live process sampling, confirmation dialogs, a settings window.
gpu-surface	A Metal-backed GPU surface composed beside native controls and WebView content.
gpu-dashboard	Native chrome, a GPU surface, and a retained canvas display list.
gpu-components	The retained GPU widget controls in one native-first component lab.
canvas-preview	Canvas + WebView in one window, panes snapped to canvas anchors, a status item.
effects-probe	The effect system live: spawn/fetch/file effects, cancellation, worker wakes.
menu-bar	The menu-bar app lifecycle: close_policy = "hide", a status item whose Open/Quit rows drive fx.showWindow/fx.quitApp, Dock reopen.

Examples that own their build

Example	Why it keeps a build.zig
hello	Smallest WebView shell, with the SDK module wiring spelled out by hand.
webview	Bridge commands, window APIs, security policy, automation, and optional CEF engine flags.
command-app	One command routed from toolbar, menu, tray, shortcut, and bridge entry points.
capabilities	Guarded OS services: notifications, clipboard, credentials, dialogs, file drops.
native-shell	Native toolbar/sidebar/statusbar chrome around a WebView content area.
native-panels	Split native panels and stacked native controls around WebView content.
browser	Layered WebViews for isolated page content, engine link flags wired by hand.
next, react, svelte, vue	Frontend projects with managed install/build/dev-server steps.
ui-inbox	The builder-view inbox; its -Dmobile lib step feeds the mobile host shims.
mobile-canvas	Builds the mobile embed static library consumed by the iOS/Android canvas shims.

mobile-shell, ios, and android are mobile host projects (Xcode/Gradle shells plus shared app.zon metadata) rather than desktop app directories.

Start with habits for the native-rendered markup path, or hello for the WebView path. Move to webview when you need native commands or WebView policy, capabilities for guarded OS services, the GPU trio when you want custom-rendered or retained-canvas panes, and a frontend example when building a real web frontend.