Skip to content

Commit f021e33

Browse files
committed
updates
1 parent 082ddaf commit f021e33

File tree

2 files changed

+34
-14
lines changed

2 files changed

+34
-14
lines changed

MyApp/_posts/2025-02-11_text-to-blazor.md

Lines changed: 34 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -11,19 +11,23 @@ Apps from just a text description.
1111

1212
[![](/img/posts/text-to-blazor/text-to-blazor-prompt.webp)](/text-to-blazor)
1313

14+
<div class="pb-4 not-prose flex justify-center">
15+
<a href="https://servicestack.net/text-to-blazor" class="text-3xl text-indigo-600 hover:text-indigo-800">https://servicestack.net/text-to-blazor</a>
16+
</div>
17+
1418
This will query 5 different high quality AI models to generate 5 different Data Models, APIs, DB Migrations
1519
and Admin UIs which you can browse to find the one that best matches your requirements.
1620

1721
[![](/img/posts/text-to-blazor/text-to-blazor-gen.webp)](/text-to-blazor)
1822

1923
### Using AI to only generate Data Models
2024

21-
Whilst the result is a working CRUD App, the approach we've taken is very different from most AI tools
22-
which uses AI to generate the entire App that ends up with a whole new code-base you didn't write
23-
that you now need to maintain.
25+
Whilst the result is a working CRUD App, the approach taken is very different from most AI tools
26+
which uses AI to generate the entire App that ends up with a whole new code-base developers didn't write
27+
which they'd now need to maintain.
2428

25-
Instead we're just using AI to generate the initial Data Models within a **TypeScript Declaration file**
26-
which we've found is best format supported by AI models that's also the best typed DSL for defining
29+
Instead AI is only used to generate the initial Data Models within a **TypeScript Declaration file**
30+
which we've found is the best format supported by AI models that's also the best typed DSL for defining
2731
data models with minimal syntax that's easy for humans to read and write.
2832

2933
### Download preferred Blazor Vue CRUD App
@@ -41,14 +45,13 @@ generated Blazor Vue CRUD App:
4145

4246
### Blazor Vue App
4347

44-
**UI + Admin** - Creates a new [blazor-vue](https://blazor-vue.web-templates.io) template which is ideal
45-
for Internet or public facing Apps which sports a full-featured public facing UI for the Web App's
46-
users whilst providing a back-office Admin UI for Admin Users to manage the App's data.
48+
**UI + Admin** - Creates a new [blazor-vue](https://blazor-vue.web-templates.io) template that's ideal
49+
for Internet or public facing Apps, sporting a full-featured public facing UI for a Web App's
50+
users whilst enabling a back-office CRUD UI for Admin Users to manage their App's data.
4751

4852
![](/img/posts/text-to-blazor/okai-blazor-vue.webp)
4953

50-
Clicking on the **Admin UI** button will Authenticate using the Admin User's credentials and take you to the
51-
Admin UI at `/admin`:
54+
Clicking on the **Admin UI** button will take you to the Admin UI at `/admin`:
5255

5356
![](/img/posts/text-to-blazor/okai-blazor-vue-admin.webp)
5457

@@ -123,19 +126,36 @@ Data Model RDBMS Tables:
123126
Using AutoQuery CRUD UI in a Text to Blazor App
124127
:::
125128

129+
### Create new Records from Search Dialog
130+
131+
We're continually improving the UX of the [AutoQueryGrid Component](/vue/autoquerygrid) used in generating CRUD UIs to enable a more productive and seamless workflow. A change added to that end that you can see in the above video is the ability to add new Records from a Search dialog:
132+
133+
![](/img/posts/text-to-blazor/autoquerygrid-new2.webp)
134+
135+
This now lets you start immediately creating new records without needing to create any lookup entries beforehand.
136+
126137
## Audited Data Models
127138

128-
The Instant CRUD UI also includes effortless support for maintaining a detailed audit history for changes to
129-
select tables by inheriting from the `AuditBase` base class, e.g:
139+
The TypeScript Data Models enable a rapid development experience for defining an App's Data Models which are used
140+
to generate the necessary AutoQuery CRUD APIs to support an Admin UI.
141+
142+
An example of the producitivity of this approach is the effortless support for maintaining a detailed audit history for changes to select tables by inheriting from the `AuditBase` base class, e.g:
130143

131144
```ts
132145
export class Job extends AuditBase {
133146
...
134147
}
135148
```
136149

150+
Which can then be regenerated using the name of the TypeScript Model definitions:
151+
152+
:::sh
153+
npx okai Jobs.d.ts
154+
:::
155+
137156
This will include additional `CreatedBy`, `CreatedDate`, `ModifiedBy`, `ModifiedDate`, `DeletedBy` and `DeletedDate`
138-
properties to the specified Table and also generates the necessary [Audit Behaviors](https://docs.servicestack.net/autoquery/crud#apply-generic-crud-behaviors)
157+
properties to the specified Table and also generates the necessary
158+
[Audit Behaviors](https://docs.servicestack.net/autoquery/crud#apply-generic-crud-behaviors)
139159
on the AutoQuery APIs to maintain the audit history for each CRUD operation.
140160

141161
### AutoQuery CRUD Audit Log
@@ -248,7 +268,7 @@ export type Config = {
248268
}
249269
```
250270
251-
So if no longer want the code regeneration to update the DB Migration for it, you can just remove it
271+
So if you no longer want the code regeneration to update the DB Migration for it, you can just remove it
252272
from the Config.
253273
254274
## Customize Data Models
29.2 KB
Loading

0 commit comments

Comments
 (0)