Manual Recipes

Recipes

elements man recipes Read as markdown

Worked end-to-end examples that compose several Elements primitives. Each recipe is a complete pattern you can copy-adapt. Open one by its path, as listed below: elements man recipes/<slug>, for example elements man recipes/todo-app.

Topics

recipes/todo-app Start here. A live todo list: optimistic insert, All/Active/Done, inline rename, animated delete.recipes/authentication Form-based signin and signup with handle + password. Two pages, bcrypt hashing, reactive session.recipes/form-validation Multi-field form with per-field error states and submit gating.recipes/signup-confirmation Signup, send a confirmation email, verify the token, log the user in.recipes/signup-wizard Multi-step signup that preserves form state across pages.recipes/admin-roles Role-gated admin routes via a role column checked inside a shared guard.recipes/file-upload File input bound to File[], @rpc, bytea storage, served back.recipes/database-assets Serving runtime bytes out of a table: a hash in the URL, the content type, and an immutable Cache-Control.recipes/live-comments Slack-style composer with optimistic insert and live append.recipes/likes-toggle Join-table row toggled by a partitioned LiveTable with gated handlers.recipes/shared-lists URL-addressable editable lists with real-time sync.recipes/team-partitioned-table Multi-team data partitioned by team, with membership checked in the route and in every handler.recipes/chat-rooms Handle-only auth with a room list and per-room message stream.recipes/typing-indicator Channel-driven who's-typing indicator on top of a chat.recipes/grouped-feed Day separators, author runs, and child rows such as reactions in a live feed, with only the new row repainting.recipes/unread-counts Per-user unread badges kept live by triggers on a partitioned LiveTable, with no refetch per message.recipes/presence Who is in a room right now, from listener connect and disconnect.recipes/collaborative-canvas Stroke broadcast and clear over a channel.recipes/infinite-scroll-feed A windowed LiveTable, an intersection observer, and more() for older pages.recipes/bidirectional-partition Rows owned by either of two parties; one LiveTable opened on two partitions, merged in the template.recipes/search-filter Server-driven search and multi-select filter via @rpc.recipes/admin-table Searchable paginated table with inline actions.recipes/markdown-blog Public read plus admin write with markdown rendering.recipes/public-admin-views Two routes over the same data with admin-only mutations.recipes/cron-cache Cron job recomputes a stats row; the page reads from cache.recipes/live-dashboard Background job notifies a channel; templates reassign on each notification.recipes/live-from-sql A pg trigger so writes from a job, an rpc or psql reach an open page. Not needed when writes go through the view.recipes/marketing-page Dark landing page with hero, pricing, and footer using @elements/style.recipes/status-indicators Real-time status dots driven by a channel.recipes/render-markdown Inline markdown editor with live preview.recipes/time-ago Reactive value that ticks over time.