Real-world examples you can learn from, copy, and build on
Live stats dashboard with reactive counters, computed KPIs, polling effects, and a notification feed. Shows how signals replace Redux/Vuex for real-time data.
Full CRUD app with API calls, search/filter, pagination, and form validation. Demonstrates the API module with interceptors and error handling.
WebSocket-powered chat room with typing indicators, message history piped into signals, auto-reconnect status, and online user list.
Login/register with JWT tokens, protected routes via guards, token refresh, role-based access, and automatic redirect on 401.
E-commerce cart with product listing, quantity controls, computed totals, localStorage persistence, and shared state across components.
Drag-and-drop form builder with live preview, reactive validation, conditional fields, and JSON schema export. Showcases complex signal graphs.
Offline-capable notes app with service worker caching, installable as PWA, markdown preview, and sync-on-reconnect pattern.
Sortable, filterable, paginated data table with column resizing, row selection, bulk actions, and CSV export — all reactive.
Type-ahead search with debounced API calls, result highlighting, keyboard navigation, recent searches, and loading states.
Six persisted signals: theme, font size, sidebar state, last-used filter, draft text, and a cross-tab synced cart. Also shows the credential-shape warning and wipe-on-logout.
Switch between six languages and watch every translated string plus Intl number, currency, and date formatting update in place. Arabic flips the layout to right-to-left. The active locale is a signal.
Server-Sent Events and NDJSON streaming wired to signals: an AI-style token stream and a live server-event feed, each piped into state behind a reactive status badge.
A static, server-rendered product page with three self-hydrating Tina4Element islands - star rating, add-to-cart, and a live viewer count - each shadow-DOM encapsulated with its own scoped styles.
Typed queries and mutations through api.graphql(): search with variables, restock with a mutation, and a live wire console showing the exact request and response.
Drag-and-drop or browse, a real FileReader preview, and multipart api.upload() with a live per-file progress bar.