Skip to main content

Routed Hotwire

Routed Hotwire brings Turbo Streams, Turbo Frames, and real-time WebSocket broadcasting into the Routed ecosystem so you can build interactive server-rendered applications in Dart.

Features​

  • Turbo Stream builders — Generate <turbo-stream> HTML fragments for all 8 actions (append, prepend, replace, update, remove, before, after, refresh).
  • Request inspection — Detect whether an incoming request is a standard visit, a Turbo Frame request, or a Turbo Stream request via headers.
  • Response helpers — Send HTML, frame, stream, redirect (303), and validation error (422) responses with correct content types.
  • WebSocket hub — Topic-based pub/sub for broadcasting Turbo Stream fragments over WebSocket connections.
  • Stream signing — HMAC-SHA256 signed stream names to prevent unauthorized subscriptions.

Install​

dependencies:
  routed_hotwire: ^0.1.6

Quick Start​

import 'package:routed/routed.dart';
import 'package:routed_hotwire/routed_hotwire.dart';

final engine = await Engine.create();

engine.post('/notes', (ctx) async {
  final content = ctx.input('content');
  // Build a Turbo Stream fragment to append the new note
  final fragment = turboStreamAppend(
    target: 'notes',
    html: '<p>$content</p>',
  );
  // Respond with the correct Turbo Stream content type
  return ctx.turboStream(fragment);
});

Next Steps​