---
url: 'https://sema-lang.com/docs/web.md'
---
# Sema Web
## What is Sema Web?
Sema Web embeds the Sema language in web pages via WebAssembly. Think of it like Lua for game engines, but for the browser: a small, expressive scripting language with reactive state, declarative markup, and direct DOM access.
The `@sema-lang/sema-web` package gives you:
* **Reactive state** -- signals, computed values, watchers, and batched updates
* **SIP markup** -- vectors-as-DOM, a compact alternative to HTML templates
* **Components** -- auto-re-rendering views driven by signal dependencies
* **DOM bindings** -- query, create, mutate elements from Sema code
* **Storage, routing, CSS, HTTP, LLM** -- browser APIs exposed as Sema functions
Everything runs client-side. No build step required -- add a script tag and go.
## Quick Example
A counter in 12 lines of Sema:
```sema
;; Reactive state
(def count (state 0))
;; Event handler
(define (increment ev)
(update! count (fn (n) (+ n 1))))
;; Component
(defcomponent counter-view ()
[:div {:class "counter"}
[:p "Count: " @count]
[:button {:on-click "increment"} "+"]])
;; Mount to the DOM
(mount! "#app" "counter-view")
```
Embed it in an HTML page:
```html
```
## Architecture
```
Browser Page
│
├──