JsonUI
LearnLearn JsonUIStart with a 5-minute one-liner install and work through the hello-world tutorial in your platform of choice.
ArticlesCurriculum order — start at the top, or jump to whichever step you need.
Install JsonUI in one line
learn_installation_lead
/learn/installation
Hello, JsonUI — your first screen in five minutes
Install the CLI, scaffold a project, `jui init`, author one JSON, `jui build` + `jui verify`, then wire a platform-specific ViewModel and run. Five cross-platform steps + three per-platform — Swift, Kotlin, and React share the same foundation.
/learn/hello-world
Your first screen
Build a 'Recent Activity' screen from scratch: a header with a language toggle, a hero with welcome copy and a refresh button, and a scrollable collection of activity rows wired to a ViewModel. You will touch every piece of the JsonUI pipeline — spec → layout → cell → ViewModel → build → verify — and end with a working screen you can extend into a real app.
/learn/first-screen
Data binding basics
Build a working Counter screen from the ground up, layering in the three kinds of @{binding} one at a time: value, visibility, event. When you finish you have a spec + layout + ViewModel triple that demonstrates all three, and a mental model for where to add the fourth binding you will inevitably need.
/learn/data-binding-basics
What is JsonUI?
A cross-platform UI framework that treats the screen spec as the source of truth. You write one screen_spec.json + one Layout JSON + one ViewModel, and the generator emits native SwiftUI, Jetpack Compose, and Next.js / React side by side. This page is here to tell you — without installing anything — whether that trade is worth your time.
/learn/what-is-jsonui