Framework Tour
This tour maps the complete Resux framework surface and where to learn each part.
For a concrete line-by-line walkthrough, start with Code to Browser. It follows one component from authored SFC code through compiler records, SSR HTML and payload, browser resume, and targeted DOM patches.
1. Create and validate
The create system offers eight templates and composable feature flags. Generated projects use prepare, check, TypeScript declarations, Nitro output, deployment files, and optional tests, Tailwind, media, and i18n examples.
Start with Getting Started and Project Structure.
2. Compiler, Vue tools, and the Resux language
Resux authors components as .vue SFCs, uses Vue compiler packages as parsers, normalizes public rx-* directives, and emits a Resux-owned template model, server modules, handler modules, manifests, and types.
For concise templates, @event is the official shortcut for rx-on:event, and :binding is the official shortcut for rx-bind:binding. Existing v-* syntax remains available only as migration compatibility.
Normal components do not become hydrated Vue applications. The Vue runtime is reserved for explicit islands.
Read How Resux Uses Vue, Components, Template Syntax, and Compiler Reference.
3. SSR and resumability
The server renders HTML and serializes route/scope data. The browser resumes handlers and patches compiler-marked bindings instead of hydrating the whole app.
Read Code to Browser, Rendering Lifecycle, Mental Model, and Resumability and Handlers.
4. State ownership
Use ref and reactive for ordinary local component state. Use useState only for named component-scope state that must be serialized. Use useGlobalState only for intentionally shared, request-isolated application state.
Read State and Reactivity and Async Data.
5. Routing and data
Pages become routes; layouts wrap pages; route middleware can redirect or abort; route payloads power same-origin navigation. State and async resources are serialized for browser continuation.
Read Routing, Layouts, Async Data, and Head and SEO.
6. Server platform
Resux includes request middleware, APIs, custom routes, server utilities/plugins, route rules, security headers, media endpoints, and a Node handler/Nitro integration.
Read Server API, Middleware, Security and Caching, and Deployment.
7. Modules, hooks, and Kit
Modules can contribute components, imports, plugins, middleware, server handlers, templates, types, route rules, prerender routes, Vite plugins, and Nitro config. Core hooks expose configuration, build, Vite, Nitro, loading, and error lifecycles.
Read Modules and Route Rules, Lifecycle Hooks, and Package Exports.
8. Progressive client behavior
Third-party packages can be SSR, client-only, server-only, or progressive. Named client enhancements support visibility, interaction, idle, page-load, immediate, and manual triggers with cleanup.
Read Third-party Packages and Progressive Package Example.
9. Optional feature packages
10. Vue islands
Use a Vue island where a widget needs full Vue behavior. The rest of the app remains server-rendered and resumable.
Read Vue Islands and How Resux Uses Vue.
11. Safety and integrity
Halal Core performs local policy scanning, writes human/machine reports, supports optional remote classification with redaction, and requires authenticated production reports. Review submission is currently manual.
Read Halal Core.
12. Operations
prepare, check, targeted inspect, trace flags, build output, health checks, and deployment generators support development and CI.
Read Dev Server and Build Output, CLI Reference, Testing and Quality, and Troubleshooting.