skills.rest
danielmichaels
danielmichaelsCOMMUNITY
Explore all skills by this author →
Website𝕏@dansultGitHub

datastar

Design backend-driven UIs with Datastar for SSE DOM updates in Go web apps.

Updated Mar 26, 2026
Search Tags:#go#frontend-backend#server-rendered#hypermedia#sse#templ#datastar
One-click install
npx skills add https://github.com/danielmichaels/cskills --skill datastar-danielmichaels
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: datastar
Source: https://github.com/danielmichaels/cskills/tree/main/go/skills/datastar
Command: npx skills add https://github.com/danielmichaels/cskills --skill datastar-danielmichaels

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Developers need a structured approach to building web applications where the backend drives UI updates, streaming changes to the frontend via SSE and declarative data-* attributes, reducing client-side boilerplate and ensuring consistency between server and UI.

Core Features & Use Cases

  • Backend-driven reactivity: SSE streaming of partial DOM updates and reactive signals orchestrated through the datastar-go SDK.
  • Declarative frontend interactions: data-* attributes drive behavior with server-rendered templates morphing on patches.
  • End-to-end Go integration: server-side templating (Templ) with a client-driven morphing pipeline and NATS-to-SSE flow.

Quick Start

Experiment with a Datastar-powered page to observe server-driven updates via SSE patches to the DOM.

Frequently Asked Questions about datastar

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I stream server-side DOM updates to the frontend using SSE in Go?▼

You can stream server-side DOM updates by applying backend-driven reactive patterns with SSE. This approach patches specific HTML elements declaratively via data-* attributes, eliminating client-side rendering boilerplate.

What is backend-driven UI reactivity and how does it work with server-sent events?▼

Backend-driven UI reactivity uses server-sent events (SSE) to stream partial DOM updates directly to the client. The frontend morphs dynamically through declarative data-* attributes, maintaining consistency without heavy client-side state.

Can I use templ with Go to render reactive components and patch them via SSE?▼

Yes, templ renders server-side templates which are then patched via SSE. The pipeline integrates server-side rendering with client-driven morphing, ensuring declarative frontend behavior updates seamlessly.

Do I need a messaging broker like NATS to handle SSE streaming for reactive UIs?▼

NATS integration is supported to orchestrate the SSE flow for reactive signals. It manages the backend-to-frontend event stream, ensuring server-sent DOM patches are delivered efficiently to the reactive UI.

What is the best way to reduce frontend boilerplate in server-rendered Go web apps?▼

The best way to reduce boilerplate is adopting declarative data-* attributes for frontend interactions. Backend-driven reactivity streams partial DOM updates via SSE, morphing server-rendered templates automatically.

Are there limitations to using backend-driven SSE patches for frontend reactivity?▼

This approach relies entirely on server-sent events (SSE) for updates, requiring an active connection. It is designed for server-rendered Go apps using templ, meaning it shifts state management entirely backend-side.

Related Skills

Explore More Software Engineering Skills→
dodygdodyg

datastar

Patch DOM elements and signals via datastar attributes with SSE streaming.

Community
Advanced
gnanirahulnutakkignanirahulnutakki
1

god-message-streaming

Stream and orchestrate messaging across Kafka, RabbitMQ, SQS/SNS, NATS, and Pulsar.

Community
Advanced
ev3rlitev3rlit

templ-foundation

Initialize Go templ projects with CLI tooling and starter templates.

Community
Basic
telum-aitelum-ai
2

websocket-implementation

Implement WebSocket server-client communication with automatic reconnection and Redis scaling.

Official
Advanced