Quickstart
Create a Blazor app, turn a service method into an action with confirmation, connect a model and add the chat widget in about fifteen minutes.
In this tutorial, you'll:
- Create a Blazor app whose pages are all interactive
- Turn service methods into tools, one of them with confirmation
- Connect a model and keep its key in user secrets
- Add the chat widget and watch the agent call your code
On this page
In this quickstart you build Cases, a small Blazor Server app for support cases. Its agent reads the status of a case whenever it needs to, and adds a note to a case only after you confirm.
This quickstart uses Blazor, because the chat widget is ready-made for Blazor. With a React, Angular or Vue front end, or a mobile app, the service and its registration stay the same. You add Novior.MentorAgent.Server to the backend and build the chat UI yourself, as in Any front end.
What you need:
- the .NET 10 SDK;
- an OpenAI API key.
Prerequisites lists the versions that MentorAgent is tested with. You can also download the finished project as a zip file (external site). It is under the MIT license.
Create the app
Section titled “Create the app”Create a Blazor Web App with Server interactivity:
dotnet new blazor -n Cases --interactivity Server --all-interactive
cd Cases--all-interactive makes every page interactive. The widget needs it: on a page rendered statically, its button shows up but clicking it does nothing.
Add the packages
Section titled “Add the packages”Add MentorAgent:
.NET CLI
dotnet add package Novior.MentorAgentPackageReference
<ItemGroup>
<PackageReference Include="Novior.MentorAgent" Version="1.0.0" />
</ItemGroup>Central Package Management
<ItemGroup>
<PackageVersion Include="Novior.MentorAgent" Version="1.0.0" />
</ItemGroup><ItemGroup>
<PackageReference Include="Novior.MentorAgent" />
</ItemGroup>File-based app
#:package Novior.MentorAgent@1.0.0MentorAgent does not include a model provider package. This quickstart uses OpenAI, so add the OpenAI client for Microsoft.Extensions.AI:
dotnet add package Microsoft.Extensions.AI.OpenAI --version 10.6.0The package also installs OpenAI. The --version in the command is the version that the quickstart project was tested with.
Describe what the agent can do
Section titled “Describe what the agent can do”Create CaseService.cs in the project folder:
using Novior.MentorAgent.Attributes;
public class CaseService
{
[MentorAction(
Description = "Returns the status of a case",
ReadOnly = true)]
public string GetCaseStatus(string caseNumber)
=> $"Case {caseNumber} is under review.";
[MentorAction(Description = "Adds a note to a case")]
public string AddNote(string caseNumber, string text)
=> $"Note added to case {caseNumber}.";
}The [MentorAction] attribute marks a method as an action. The model sees each action as a tool: a function that it can ask MentorAgent to run. The tool is named after the method, in snake case (lowercase words joined by underscores): GetCaseStatus becomes get_case_status, and AddNote becomes add_note.
GetCaseStatusonly reads, so it declaresReadOnly = true. The agent calls it without asking anyone.AddNotechanges data. A[MentorAction]that is not read-only asks for confirmation by default, so the agent shows a confirmation box before it adds the note.
Register the service and the model
Section titled “Register the service and the model”At the top of Program.cs, add the using directives:
using Novior.MentorAgent.Extensions;
using Microsoft.Extensions.AI;
using OpenAI;Then, after var builder = WebApplication.CreateBuilder(args);, register the service and MentorAgent:
builder.Services.AddScoped<CaseService>();
builder.Services.AddMentorAgent(options =>
{
options.AppName = "Case management";
options.ChatClient = new OpenAIClient(
builder.Configuration["OpenAI:Key"] ?? throw new InvalidOperationException(
"OpenAI:Key is missing: run dotnet user-secrets set OpenAI:Key <your-key>"))
.GetChatClient("gpt-4o-mini")
.AsIChatClient();
options.ScanAssemblies = [typeof(Program).Assembly];
});AddScoped<CaseService>()registers your service as usual. MentorAgent finds its methods in the assemblies listed inScanAssemblies, and gets the instance from dependency injection.AppName,ScanAssembliesand a model are required. Here you set the model withChatClient. If you have your own Agent Framework agent, setAgentinstead.gpt-4o-miniis the model. Any model that supports tool calling works.
Keep the key out of the code, in the project's user secrets. Replace <your-key> with your OpenAI API key in the second command:
dotnet user-secrets init
dotnet user-secrets set OpenAI:Key <your-key>To use Azure OpenAI or a local model with Ollama, change the lines that set ChatClient. Model providers lists the packages and the using directives that you need. It also covers the providers that need an Agent instead.
Add the widget
Section titled “Add the widget”Add the widget's namespace to Components/_Imports.razor:
@using Novior.MentorAgent.Abstractions.ComponentsThen put the widget at the end of Components/Layout/MainLayout.razor:
<ChatWidget />The widget loads its own styles and scripts, so App.razor stays as it is.
Try it
Section titled “Try it”Run the app:
dotnet runOpen the address shown in the terminal and click the widget button in the corner of the page.
- Type "What is the status of case C-1?". The agent calls
get_case_statusand answers with what your method returned. - Type "Add a note to case C-1: documents received". The agent calls
add_note, and a confirmation box appears in the widget. It shows the action and its arguments, with labels made from the parameter names:caseNumberbecomes "Case Number". - Click Confirm.
AddNoteruns and returns its message.
If you click Cancel instead, the method does not run, and the model is told that you declined. AddNote keeps nothing: the tutorial adds a store that keeps the notes.
If something does not work, Troubleshooting starts from what you see.
See the tool calls in the log
Section titled “See the tool calls in the log”While an action runs, the widget shows its description, not the name of the tool. To see which tool the agent calls while you develop, set the log level of the Novior.MentorAgent category to Debug in appsettings.Development.json:
{
"Logging": {
"LogLevel": {
"Novior.MentorAgent": "Debug"
}
}
}The terminal then shows a line such as [MentorAgent] Tool call: get_case_status for every call. Keep the other entries of the LogLevel section that the file already has.
Next steps
Section titled “Next steps”- Build a fuller case-management agent, step by step, in the tutorial, starting with 1 · Turn service methods into actions.
- Add MentorAgent to a project you already have: Add MentorAgent to an existing app, or, with a React, Angular, Vue or mobile front end, Any front end.
- Configure it for your host and provider: Blazor Server app, Model providers, and the Production checklist before you go to production.
- Read how roles and confirmation protect your actions: Roles, confirmation and governance.
- Look up an unfamiliar term in the Glossary.
What you learned
Section titled “What you learned”- Create a Blazor app whose pages are all interactive
- Turn service methods into tools, one of them with confirmation
- Connect a model and keep its key in user secrets
- Add the chat widget and watch the agent call your code
