Interactive Dashboard Demo
Experience a complete admin interface with navigation, modals, live updates, and form handling — powered by html★ attributes and styled with Vanilla Breeze.
Launch Dashboard →What's Included
This dashboard demonstrates how html★ can power a complex application with multiple interactive patterns working together.
Dashboard Features
- SPA Navigation — Sidebar links update the main content area
- Modal Dialogs — Forms that open in native
<dialog>elements - Live Updates — SSE-powered notifications stream
- Polling — Activity feed refreshes periodically
- Form Handling — Settings forms with AJAX submission
- View Transitions — Smooth animations between pages
html★ Patterns Used
Navigation
data-target="#main"on the nav containerdata-pushfor browser history integrationdata-transitionsfor View Transitions API
Modals
data-target="dialog#modal"to load content into dialog- Native
<dialog>element for accessibility - Form submission closes modal and shows confirmation
Live Data
data-sse="/api/notifications/stream"for server-sent eventsdata-trigger="every 30s"for pollingdata-swap="prepend"for adding new items to lists
Why This Matters
This dashboard would traditionally require a JavaScript framework like React or Vue. With html★, the entire application is built with HTML attributes — no build step, no component system, no state management library. Just HTML that progressively enhances with JavaScript.