Go HTML Views with Gomponents
maragudk/gomponents
Builds and edits HTML views in Go with gomponents, where components are plain functions that return a Node, instead of using template languages.
Writes and changes pages, layouts, forms and HTMX fragments in an Arandu Go app using its .kyse.go templates, escaping rules and Content-Security-Policy limits.
$ npx skills add arandu-io/arandu --skill arandu-view -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install arandu-io/arandu arandu-view --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/arandu-io/arandu.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/arandu-view .claude/skills/arandu-view && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "arandu-view" agent skill from https://github.com/arandu-io/arandu/tree/main/.agents/skills/arandu-view into .claude/skills/arandu-view/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "arandu-view", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/arandu-io/arandu/tree/main/.agents/skills/arandu-viewType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add arandu-io/arandu --skill arandu-view -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install arandu-io/arandu arandu-view --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/arandu-io/arandu.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/arandu-view .agents/skills/arandu-view && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "arandu-view" agent skill from https://github.com/arandu-io/arandu/tree/main/.agents/skills/arandu-view into .agents/skills/arandu-view/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "arandu-view", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add arandu-io/arandu --skill arandu-view -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install arandu-io/arandu arandu-view --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/arandu-io/arandu.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/arandu-view .cursor/skills/arandu-view && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "arandu-view" agent skill from https://github.com/arandu-io/arandu/tree/main/.agents/skills/arandu-view into .cursor/skills/arandu-view/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "arandu-view", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/arandu-io/arandu.git --path .agents/skills/arandu-view--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add arandu-io/arandu --skill arandu-view -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install arandu-io/arandu arandu-view --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/arandu-io/arandu.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/arandu-view .gemini/skills/arandu-view && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "arandu-view" agent skill from https://github.com/arandu-io/arandu/tree/main/.agents/skills/arandu-view into .gemini/skills/arandu-view/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "arandu-view", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install arandu-io/arandu arandu-viewInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add arandu-io/arandu --skill arandu-view -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/arandu-io/arandu.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/arandu-view .github/skills/arandu-view && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "arandu-view" agent skill from https://github.com/arandu-io/arandu/tree/main/.agents/skills/arandu-view into .github/skills/arandu-view/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "arandu-view", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add arandu-io/arandu --skill arandu-view -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install arandu-io/arandu arandu-view --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/arandu-io/arandu.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/arandu-view .opencode/skills/arandu-view && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "arandu-view" agent skill from https://github.com/arandu-io/arandu/tree/main/.agents/skills/arandu-view into .opencode/skills/arandu-view/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "arandu-view", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
arandu-viewWrites and changes pages, layouts, forms and HTMX fragments in an Arandu Go app using its .kyse.go templates, escaping rules and Content-Security-Policy limits.
The skill covers anything under resources/views in an Arandu application. A view is a .kyse.go file written in Go that aru view:build compiles into generated code under storage/framework/views, so errors point at the line you wrote, and a build tag keeps the Go compiler away from the template source. The data passed to a view is a typed struct that embeds view.Page, never a map, and aru doctor fails a map. Directives include @extends, @section, @yield, @if, @foreach, @forelse, @for, @go and @csrf.
Double braces escape output, while the raw form accepts only a template.HTML value and the compiler enforces it, so a string that arrived as data stops the build. The skill warns against casting a string to template.HTML to silence that error, and explains why an inline style or an Alpine attribute will not work under the app's Content-Security-Policy. The procedure is to write the file, then run aru view:build, go build and aru doctor in turn. The resources/views/notes folder holds working examples of a listing, a record and create and edit forms.
4 steps, taken from the first numbered list in SKILL.md.
Read from SKILL.md and the folder at commit b8a4273. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Shell commands in SKILL.md call:
gobashFrom the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Arandu View Templates loads about 2.2k tokens when it runs. Until then it costs about 179 tokens; SKILL.md has 887 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from arandu-io/arandu at commit b8a4273, republished under its MIT licence (© arandu-io). 887 words, ~2,236 tokens.
.claude/skills/arandu-view/SKILL.md (or your agent's skills folder).A page a person navigates to, a part of one that htmx replaces, a form, a
component call, the layout. The action that renders it is arandu-http; a JSON
answer is arandu-api.
resources/views/notes/ holds the example's four screens -- a listing
through the DataTable component, a record with a named action's form, and
the create and edit forms built from Field, Textarea and Checkbox --
and resources/views/partials/notes_table.kyse.go is the listing's table,
the one fragment the project ships. resources/views/comments/ is what
aru make:module writes for a nested resource, untouched.resources/views/home.kyse.go compiles, through
aru view:build, to storage/framework/views/home.go, which is build output
and is gitignored. An error points at the line you wrote.| piece | contract |
|---|---|
| page | resources/views/<area>/<action>.kyse.go: //go:build kyse, @extends('layouts.app'), and a data struct that embeds view.Page (github.com/arandu-io/hesape/view), asserted with var _ view.Layout = XData{} |
| fragment | resources/views/partials/<name>.kyse.go, no @extends; its page draws it with @include('partials.<name>'), handing the page's data over |
| chrome | view.New(ctx, title) in the controller: the title, the flash a rejected form left, the CSRF token the middleware issued |
| answering | ctx.View("notes.index", data) for the page, ctx.Fragment(http.StatusOK, "partials.notes_table", data) for the fragment |
| component | github.com/arandu-io/kyse/components, imported, never copied: an exported function taking its props struct |
| behaviour | ui.js, bound once on document, dispatching on data-* attributes; this project registers its own in resources/js/custom.js with arandu.ui.define and arandu.ui.action |
The directives are a closed set: @extends @section/@endsection @yield
@include @if/@elseif/@else/@endif @foreach/@endforeach
@forelse/@empty/@endforelse @for/@endfor @while/@endwhile
@continue @break @go/@endgo @csrf @attributes. {{ }} escapes,
{!! !!} does not, {{-- --}} never reaches the page.
Write the .kyse.go, its data struct in @go:
//go:build kyse
package views
import "github.com/arandu-io/hesape/view"
@go
// InvoicesData is what the controller hands this page.
type InvoicesData struct {
view.Page
Invoices []InvoiceRow
}
// InvoiceRow is one invoice, already formatted by the controller.
type InvoiceRow struct{ Reference string }
var _ view.Layout = InvoicesData{}
@endgo
@extends('layouts.app')
@section('content')
@foreach(.Invoices as invoice)
<p>{{ invoice.Reference }}</p>
@endforeach
@endsectionThe build tag keeps the compiler out of the file: Go reads the constraint and never parses the markup below the package clause.
Decide page or fragment. Every navigation -- a direct visit, a link the
layout's hx-boost turned into an htmx request, a history restore -- gets
the whole document, and the answer never changes on HX-Boosted, so a
reload shows the same page. A fragment is what one element asks for on
purpose, with hx-get or hx-post and an hx-target naming the element it
replaces; it lives in partials/ and the page includes it.
Answer it from the controller with the fragment only when ctx.IsHTMX()
and ctx.Header("HX-Target") names that element, the page otherwise, and
Vary: HX-Request, HX-Target on both.
Build, compile, check: aru view:build names the template's line,
go build ./... the Go's, aru doctor the escaping's.
A rejected form is not a fragment. The action returns the validation.Errors,
the router sends the browser back to the form -- htmx follows that as a
navigation -- and the page after it shows the messages through view.New. The
sign-in screens of go run github.com/arandu-io/ui@v0.20.0 auth follow the same
rule: a rejected sign-in is a redirect back to its screen, and a password never
comes back.
aru view:build, which also builds the stylesheet with the pinned Tailwindaru make:module writes the four screens of a resource; aru make:mail writes a mail's two viewsaru dev rebuilds the views on every changego get github.com/arandu-io/kyse/componentsThe controller side of one address with two representations, as
NoteController.Index writes it:
package example
import (
"net/http"
hhttp "github.com/arandu-io/hesape/http"
"github.com/arandu-io/hesape/view"
views "<module>/storage/framework/views/notes"
)
// Listing answers the page to every navigation, and the table alone to the
// one request that names the table as the element it replaces.
func Listing(ctx *hhttp.Context, rows []views.NoteRow) error {
data := views.NotesIndexData{
Page: view.New(ctx, "Notes"),
Notes: rows,
NewURL: ctx.URL("notes.create"),
}
ctx.Response.Header().Add("Vary", "HX-Request, HX-Target")
if ctx.IsHTMX() && ctx.Header("HX-Target") == views.NotesTableID {
return ctx.Fragment(http.StatusOK, "partials.notes_table", data)
}
return ctx.View("notes.index", data)
}aru doctor fails it as view-data-is-a-map.template.HTML to get it through {!! !!}: a value
somebody typed has been through nothing, and that is stored cross-site
scripting. {!! !!} takes a component call; raw-output-is-not-a-component.x- attribute, an @click or Alpine: it is not served, the pages
run under script-src 'self' with no unsafe-eval, and aru doctor fails
it as view-keeps-state-in-the-browser.on*, hx-on*): the
compiler refuses it. Data travels in a data-* attribute.style="...": style-src 'self' drops it. Use a class.partials/ (fragment-without-partial),
or decide by HX-Boosted.package.json or a CDN. resources/js/custom.js
is the one script, served as written; tests/Unit/resources_test.go fails on
any other.Anything a page needs in Go goes in the custom block inside its @go, and
survives regeneration of the screens. A new component belongs in the kyse
library, not in the application; a project's own behaviour is a named action
in resources/js/custom.js.
A page needs nothing: the controller that renders it imports its compiled
package. A directory of views that no controller imports -- the layouts, the
partials -- is linked with a blank import in bootstrap/app.go, or its views
are never registered and the first request says so.
TestTheNotesTableIsAnsweredAloneOnlyToTheElementThatAsksForIt: a direct
visit, a boosted link, a history restore, an htmx request for another
element and the target named without htmx all get the whole document; the
element's own request gets the fragment alone; every answer carries the
Vary.TestTheCommentPagesAreWholeDocuments.ctx.View takes the view's name as a string, so a missing view compiles; it is
aru doctor's view-does-not-exist and the tests that find it. The escaping is
guaranteed for what passes through {{ }} and the components; a value a
controller turned into template.HTML is trusted from then on.
Run them all, in this order, as AGENTS.md lists them:
export GOWORK=off
aru model:build --check
aru view:build
gofmt -l $(find . -name '*.go' -not -path '*/testdata/*' -not -name '*.kyse.go')
go vet ./...
bash tests/test-layout-guard.sh
go test -race ./...
go build ./...
aru doctor<!-- arandu:begin custom -->
<!-- arandu:end custom -->
© arandu-io, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Just SKILL.md in .agents/skills/arandu-view of arandu-io/arandu.
Open the folder on GitHubat commit b8a4273
Arandu View Templates next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Arandu View Templates this skillarandu-io/arandu | 281 | — | ~2.2k | Automated safety check: Pass | MIT | |
| Go HTML Views with Gomponentsmaragudk/gomponents | 1.9k | — | ~3.6k | Automated safety check: Pass | MIT | |
| AO Desktop App LauncherOrchestratorInc/agent-orchestrator | 13k | — | ~2.4k | Automated safety check: Pass | Apache-2.0 | |
| Abo Auditjeeftor/audiobook-organizer | 190 | — | ~322 | Automated safety check: Pass | MIT | |
| Monstermq Dashboard Developervogler75/monster-mq | 143 | — | ~1.8k | Automated safety check: Pass | GPL-3.0 | |
| Frontend UIfossasia/eventyay | 1.7k | — | ~299 | Automated safety check: Pass | Apache-2.0 |
maragudk/gomponents
Builds and edits HTML views in Go with gomponents, where components are plain functions that return a Node, instead of using template languages.
OrchestratorInc/agent-orchestrator
Launches, restarts and troubleshoots the real AO Electron desktop app from a checkout, with isolated or real local data and checks for stale processes.
jeeftor/audiobook-organizer
Audit Audiobook Organizer Go and current web UI dependencies for vulnerabilities, outdated packages, and dependency hygiene without changing files unless explicitly asked.
vogler75/monster-mq
Guide for developing the MonsterMQ web dashboard. An agent skill from vogler75/monster-mq.
fossasia/eventyay
Frontend UI implementation, accessibility, and responsive checks for Django templates and Vue components
ningbainb/deepseek-harness-desktop
Build a new skin for the dsh-web-ui skin collection (DSH Web GUI) and publish it into the skin-center plugin — scaffold with scripts/dsh-skin-new, author skin.json plus the apply/dispose +…
arandu-io/arandu
Answering a program rather than a person in an Arandu (Go) application -- a JSON Resource, a JSON answer from the same routes the pages use, problem+json errors, bearer-token authentication and…
arandu-io/arandu
Work that does not happen inside the request in an Arandu (Go) application -- background jobs and the worker, scheduled tasks, domain events through the outbox, listeners, notifications, mail and…
arandu-io/arandu
Decides whether a feature belongs in the application or in one of five shared Arandu modules before adding permissions, wallets, tags, Markdown rendering or API docs.
arandu-io/arandu
Start here for any change to an Arandu (Go) application that adds or changes behaviour -- "add invoices", "let users publish a post", "send a weekly report", "call the payment provider", "expose…
arandu-io/arandu
Controllers, requests and routes of an Arandu (Go) application -- the seven resource actions, a resource nested under another, a singleton, a single-action (invokable) controller, a named action…
arandu-io/arandu
Reaching other systems from an Arandu (Go) application, and letting them reach it -- the client of an external API with its interface and fake, webhooks sent and received, and tools, resources and…
Works with
Categories
Writes and changes pages, layouts, forms and HTMX fragments in an Arandu Go app using its .kyse.go templates, escaping rules and Content-Security-Policy limits. The skill covers anything under resources/views in an Arandu application.go file written in Go that aru view:build compiles into generated code under storage/framework/views, so errors point at the line you wrote, and a build tag keeps the Go compiler away from the template source.
Arandu View Templates fits situations like: adding a page or changing a layout in an Arandu application; building a form or rendering a list with the DataTable component; writing an HTMX fragment under resources/views; working out why an inline style or Alpine attribute is blocked.
Run `npx skills add arandu-io/arandu --skill arandu-view -a claude-code`. Or copy the skill folder (.agents/skills/arandu-view in arandu-io/arandu) into .claude/skills/arandu-view in your project. Claude Code loads it when a task matches its description.
Run `npx skills add arandu-io/arandu --skill arandu-view -a codex`. Or copy the skill folder (.agents/skills/arandu-view in arandu-io/arandu) into .agents/skills/arandu-view in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add arandu-io/arandu --skill arandu-view -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/arandu-view, .gemini/skills/arandu-view, .github/skills/arandu-view and .opencode/skills/arandu-view in your project.
Going by SKILL.md and its folder, Arandu View Templates needs the command-line tools its instructions call (go and bash). Our summary lists: An Arandu (Go) project with the aru CLI.
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
Arandu View Templates is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.
About 2.2k tokens (SKILL.md is roughly 8.9k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
Skills that share tags, products or a category with Arandu View Templates: Go HTML Views with Gomponents (maragudk/gomponents, 1.9k stars), AO Desktop App Launcher (OrchestratorInc/agent-orchestrator, 13k stars), Abo Audit (jeeftor/audiobook-organizer, 190 stars) and Monstermq Dashboard Developer (vogler75/monster-mq, 143 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
arandu-io (a GitHub organization) maintains it in arandu-io/arandu, which has 281 GitHub stars. The repository holds 12 skills in this directory. The repository was last updated on October 10, 2026.
Source: arandu-io/arandu on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.