tina4js Gallery

Real-world examples you can learn from, copy, and build on

9
Examples
7
Modules Used
<3KB
Framework Size
📊 Admin Dashboard

Live stats dashboard with reactive counters, computed KPIs, polling effects, and a notification feed. Shows how signals replace Redux/Vuex for real-time data.

signalcomputedeffectcomponent
👤 Contact Manager

Full CRUD app with API calls, search/filter, pagination, and form validation. Demonstrates the API module with interceptors and error handling.

apisignalcomponenthtml
💬 Real-time Chat

WebSocket-powered chat room with typing indicators, message history piped into signals, auto-reconnect status, and online user list.

websocketsignalpipecomponent
🔐 Auth Flow

Login/register with JWT tokens, protected routes via guards, token refresh, role-based access, and automatic redirect on 401.

routerguardapisignal
🛒 Shopping Cart

E-commerce cart with product listing, quantity controls, computed totals, localStorage persistence, and shared state across components.

signalcomputedcomponentbatch
📝 Dynamic Form Builder

Drag-and-drop form builder with live preview, reactive validation, conditional fields, and JSON schema export. Showcases complex signal graphs.

signalcomputedcomponenthtml
📱 PWA Notes

Offline-capable notes app with service worker caching, installable as PWA, markdown preview, and sync-on-reconnect pattern.

pwasignalcomponentapi
📋 Data Table

Sortable, filterable, paginated data table with column resizing, row selection, bulk actions, and CSV export — all reactive.

signalcomputedcomponentbatch
🔍 Live Search

Type-ahead search with debounced API calls, result highlighting, keyboard navigation, recent searches, and loading states.

signaleffectapihtml