mirror of
https://github.com/microsoft/agent-framework.git
synced 2026-06-16 21:04:09 +08:00
.NET: Add DevUI package for .NET (#1603)
* Implement DevUI * Review feedback * Fix build
This commit is contained in:
committed by
GitHub
Unverified
parent
94a5ba3448
commit
8855bfb065
@@ -0,0 +1,81 @@
|
||||
# DevUI Step 01 - Basic Usage
|
||||
|
||||
This sample demonstrates how to add the DevUI to an ASP.NET Core application with AI agents.
|
||||
|
||||
## What is DevUI?
|
||||
|
||||
The DevUI provides an interactive web interface for testing and debugging AI agents during development.
|
||||
|
||||
## Configuration
|
||||
|
||||
Set the following environment variables:
|
||||
|
||||
- `AZURE_OPENAI_ENDPOINT` - Your Azure OpenAI endpoint URL (required)
|
||||
- `AZURE_OPENAI_DEPLOYMENT_NAME` - Your deployment name (defaults to "gpt-4o-mini")
|
||||
|
||||
## Running the Sample
|
||||
|
||||
1. Set your Azure OpenAI credentials as environment variables
|
||||
2. Run the application:
|
||||
```bash
|
||||
dotnet run
|
||||
```
|
||||
3. Open your browser to https://localhost:50516/devui
|
||||
4. Select an agent or workflow from the dropdown and start chatting!
|
||||
|
||||
## Sample Agents and Workflows
|
||||
|
||||
This sample includes:
|
||||
|
||||
**Agents:**
|
||||
- **assistant** - A helpful assistant
|
||||
- **poet** - A creative poet
|
||||
- **coder** - An expert programmer
|
||||
|
||||
**Workflows:**
|
||||
- **review-workflow** - A sequential workflow that generates a response and then reviews it
|
||||
|
||||
## Adding DevUI to Your Own Project
|
||||
|
||||
To add DevUI to your ASP.NET Core application:
|
||||
|
||||
1. Add the DevUI package and hosting packages:
|
||||
```bash
|
||||
dotnet add package Microsoft.Agents.AI.DevUI
|
||||
dotnet add package Microsoft.Agents.AI.Hosting
|
||||
dotnet add package Microsoft.Agents.AI.Hosting.OpenAI
|
||||
```
|
||||
|
||||
2. Register your agents and workflows:
|
||||
```csharp
|
||||
var builder = WebApplication.CreateBuilder(args);
|
||||
|
||||
// Set up your chat client
|
||||
builder.Services.AddChatClient(chatClient);
|
||||
|
||||
// Register agents
|
||||
builder.AddAIAgent("assistant", "You are a helpful assistant.");
|
||||
|
||||
// Register workflows
|
||||
var agent1Builder = builder.AddAIAgent("workflow-agent1", "You are agent 1.");
|
||||
var agent2Builder = builder.AddAIAgent("workflow-agent2", "You are agent 2.");
|
||||
builder.AddSequentialWorkflow("my-workflow", [agent1Builder, agent2Builder])
|
||||
.AddAsAIAgent();
|
||||
```
|
||||
|
||||
3. Add DevUI services and map the endpoint:
|
||||
```csharp
|
||||
builder.AddDevUI();
|
||||
var app = builder.Build();
|
||||
|
||||
app.MapDevUI();
|
||||
|
||||
// Add required endpoints
|
||||
app.MapEntities();
|
||||
app.MapOpenAIResponses();
|
||||
app.MapOpenAIConversations();
|
||||
|
||||
app.Run();
|
||||
```
|
||||
|
||||
4. Navigate to `/devui` in your browser
|
||||
Reference in New Issue
Block a user