Hugo Nijhuis
505fa0f84a
This example demonstrates Iris reactive patterns: - Signal holding a slice/list of todos - Adding and removing items dynamically - Component composition (inputRow, todoList, todoItem) - Input handling with TextInput and Enter key support - Conditional rendering (empty state, strikethrough for completed) Closes #5 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Iris
WASM reactive UI framework for Go.
Quickstart
Get from zero to a running app in under 5 minutes.
Prerequisites
- Go 1.23 or later
Project setup
mkdir -p public
cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" ./public/
Create your app
Save this as main.go:
//go:build js && wasm
package main
import (
"fmt"
"git.flowmade.one/flowmade-one/iris/reactive"
"git.flowmade.one/flowmade-one/iris/ui"
)
func main() {
count := reactive.NewSignal(0)
view := ui.NewView()
view.Child(ui.TextFromFunction(func() string {
return fmt.Sprintf("Count: %d", count.Get())
}))
view.Child(ui.Button(func() {
count.Set(count.Get() + 1)
}, ui.TextFromString("Click me")))
ui.NewApp(view)
// Keep the program running
select {}
}
Create the HTML host
Create public/index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Iris App</title>
<script src="wasm_exec.js"></script>
<script>
const go = new Go();
WebAssembly.instantiateStreaming(fetch("app.wasm"), go.importObject).then((result) => {
go.run(result.instance);
});
</script>
</head>
<body></body>
</html>
Build
GOOS=js GOARCH=wasm go build -o public/app.wasm ./main.go
Run
Save this as server.go:
package main
import (
"net/http"
"git.flowmade.one/flowmade-one/iris/host"
)
func main() {
server := host.New("public", "index.html")
http.ListenAndServe(":8080", server)
}
Then run:
go run server.go
Expected output
Open http://localhost:8080 in your browser. You should see:
- A "Count: 0" text
- A "Click me" button
- Clicking the button increments the count reactively