Sinth Documentation
A complete reference for the Sinth language and CLI.
Getting Started
Language
- CommentsLine and block comments.
- Page metadataTitles, descriptions, social cards and other head tags.
- Variables and typesState, constants, computed values and types.
- ExpressionsOperators, strings, collections and function calls.
- MarkupElements, text and nesting.
- Built-in elementsEvery built-in element and the HTML it produces.
- AttributesAttributes, classes, styles and directives.
- EventsEvent handlers and modifiers.
- Binding formsTwo-way binding for inputs, checkboxes and selects.
- Conditionalsif, else and rendering options.
- Loopsfor loops, keys, filters and empty states.
- FunctionsTyped functions, defaults and named arguments.
Components & Styling
- ComponentsReusable components with parameters and local state.
- SlotsPassing content into components.
- Lifecycle and watchersonMount, onDestroy and watch.
- StylingScoped styles, nesting, media queries and reactive values.
- Script blocksJavaScript blocks inside Sinth files.
- ImportsImporting Sinth files, npm packages, CSS, JSON and fonts.
- Shared state (stores)State shared between pages and components.
- The sinth:ui libraryThe built-in component library.
- Custom elementsUse Sinth components in any HTML page as web components.
Performance & Security
Tooling
- The CLIEvery sinth command and option.
- Configurationsinth.config.json options.
- Dev serverHot reload, error overlay and local preview.
- Building and outputProduction builds and output layout.
- DeployingDeploying to Cloudflare Pages and other hosts.
- Editor supportVS Code extension and Sinth IDE.
- Programmatic APIUsing the compiler from JavaScript.