You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: MyApp/_posts/2025-11-13_react.md
+26-12Lines changed: 26 additions & 12 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -86,22 +86,28 @@ We're introducing three production-ready React templates, each optimized for dif
86
86
87
87
All three templates leverage our new [React Component Gallery](https://react.servicestack.net)—a high-fidelity port of our proven [Vue Component Library](https://docs.servicestack.net/vue/) and [Blazor Component Library](https://blazor.servicestack.net). This comprehensive collection provides everything needed to build highly productive, modern and responsive web applications.
ServiceStack's first-class React support positions your applications at the forefront of AI-assisted development. With declarative APIs, complete type safety, and minimal boilerplate, you can leverage AI code generation with confidence while maintaining the quality and maintainability your production systems demand.
104
104
105
+
## Admin Analytics UI & Persistence
106
+
107
+
ServiceStack's AI Chat now includes comprehensive chat history persistence and analytics capabilities, providing deep visibility into AI usage patterns, costs, and performance across your infrastructure. Choose between `DbChatStore` for universal RDBMS compatibility or `PostgresChatStore` for optimized PostgreSQL performance with monthly table partitioning—both ensuring consistent performance as history grows.
108
+
109
+
The Admin UI Analytics dashboard delivers actionable insights through three key views: **Cost Analysis** tracks spending across providers and models with daily and monthly breakdowns, **Token Usage** monitors input and output token consumption to identify optimization opportunities, and **Activity Log** maintains a searchable audit trail with full conversation details. These visualizations enable data-driven decisions about provider selection, cost optimization, and help debug AI features in production by capturing every request and response flowing through AI Chat's UI, external OpenAI endpoints, and internal `IChatStore` requests.
110
+
105
111
## TypeScript Data Models
106
112
107
113
As AI Models are not as adept at generating C# APIs or Migrations yet, they excel at generating TypeScript code, which our
@@ -121,9 +127,11 @@ This is enough to generate a complete CRUD UI to manage Bookings
121
127
in your React App with the [React AutoQueryGrid Component](https://react.servicestack.net/gallery/autoquerygrid).
122
128
or with ServiceStack's built-in [Locode UI](https://docs.servicestack.net/locode/):
For the example, I've started with a useful App that I've never created before, a Budget Planner App, using the prompt:
192
204
@@ -256,9 +268,11 @@ Claude Code to Implement Category Auto-Tagging with this prompt:
256
268
257
269
Which resulted in [this commit](https://github.com/mythz/budgets.apps.cafe/commit/e45a17b8dfd2b5983971554ced3e52ded6fa050e) which sees the feature available in the UI:
ServiceStack now offers FREE access to premium AI models through the new `servicestack` OpenAI Chat provider. Get instant access to Google's Gemini Flash, Kimi K2 (with thinking mode), Minimax M2, GLM 4.6, and top open-source models including Llama 4 400B and Mistral Small 3.2—all without API keys or cloud accounts.
9
+
10
+
The lightweight AI Chat integration provides a unified provider abstraction through simple `llms.json` configuration, enabling seamless switching between providers without code changes. Mix local and cloud models, optimize for cost or performance, and ensure reliability with automatic failover—all with zero heavy dependencies.
11
+
12
+
Integration is effortless with the `IChatClient` dependency, supporting text, image, audio, and document inputs across compatible models. Free for personal use and development with a generous 60 requests/hour limit (replenishing at 1 request per minute). Requires any ServiceStack license key, including free or expired licenses.
ServiceStack's AI Chat now includes chat history persistence and analytics, providing visibility into AI usage patterns, costs, and performance. Maintain a complete audit trail of all AI interactions from the Chat UI, OpenAI endpoints, and internal `IChatStore` requests.
9
+
10
+
Choose between `DbChatStore` for universal RDBMS compatibility or `PostgresChatStore` for optimized PostgreSQL performance with monthly table partitioning. Both use indexed queries to ensure consistent performance as history grows.
11
+
12
+
The Admin UI Analytics dashboard provides three key views:
13
+
-**Cost Analysis** - shows spending across providers and models
14
+
-**Token Usage** - tracks consumption patterns
15
+
-**Activity Log** - maintains an audit trail with full conversation details.
16
+
17
+
These insights enable data-driven decisions about provider selection, cost optimization, and help debug AI features in production.
title: React Tailwind TypeScript for AI-First Development
3
+
url: https://react.servicestack.net
4
+
image: /img/posts/react/react-gallery-dark.webp
5
+
order: 1
6
+
---
7
+
8
+
First-class React support optimized for AI-assisted development with new React Component Library & Project Templates. React and Tailwind have emerged as de facto standards for AI-generated UIs, with every major platform converging on this UI. ServiceStack's architecture is uniquely suited for AI development with declarative typed APIs, unambiguious integrations and end-to-end type safety—giving AI models full context they need to generate high-quality code.
9
+
10
+
Three production-ready templates are now available:
11
+
-**react-vite** (lightweight foundation)
12
+
-**react-spa** (comprehensive SPA with ASP.NET Core Identity)
13
+
-**nextjs** (server-side rendering).
14
+
15
+
All leverage the new [React Component Gallery](https://react.servicestack.net)—a high-fidelity port of our proven Vue and Blazor libraries, providing everything needed to build modern, responsive web applications with minimal code.
We've launched a powerful new AI Search feature powered by Typesense's Conversational Search API, bringing intelligent, context-aware answers directly from ServiceStack Docs. Using **Retrieval-Augmented Generation (RAG)** with **Gemini Flash 2.5**, AI Search excels at answering complex `"how do I..."` questions by synthesizing information across multiple documentation pages.
9
+
10
+
The conversational interface allows you to ask natural language questions and receive AI-generated answers grounded in actual documentation, complete with relevant links and snippets. Multi-turn conversations maintain context, letting you ask follow-up questions. While traditional Typesense search remains ideal for finding specific pages, AI Search shines when you need explanations, understanding concepts, or help connecting different features together.
11
+
12
+
Perfect for onboarding new developers, troubleshooting, and discovering ServiceStack features. Try it at [docs.servicestack.net](https://docs.servicestack.net) by clicking the **chat icon**.
0 commit comments