Skip to content

Commit 8b8267a

Browse files
ms-johnalexntrogh
andauthored
AITK Docs update - release 0.22.0 (#8922)
* inital update * updated * additional updates * Update docs/intelligentapps/agentbuilder.md Co-authored-by: Nick Trogh <ntrogh@hotmail.com> * Update docs/intelligentapps/agentbuilder.md Co-authored-by: Nick Trogh <ntrogh@hotmail.com> * Update docs/intelligentapps/agentbuilder.md Co-authored-by: Nick Trogh <ntrogh@hotmail.com> * Update docs/intelligentapps/agentbuilder.md Co-authored-by: Nick Trogh <ntrogh@hotmail.com> * Update docs/intelligentapps/agentbuilder.md Co-authored-by: Nick Trogh <ntrogh@hotmail.com> * Update docs/intelligentapps/agentbuilder.md Co-authored-by: Nick Trogh <ntrogh@hotmail.com> * updated based on feedback * Update docs/intelligentapps/agentbuilder.md Co-authored-by: Nick Trogh <ntrogh@hotmail.com> * Update docs/intelligentapps/agentbuilder.md Co-authored-by: Nick Trogh <ntrogh@hotmail.com> * updated based on feedback * updated based on feedback --------- Co-authored-by: Nick Trogh <ntrogh@hotmail.com>
1 parent 3a8c53c commit 8b8267a

24 files changed

+150
-100
lines changed

docs/copilot/customization/language-models.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,11 @@ Use the language model picker in the chat input field to change the model that i
2525

2626
![Screenshot that shows the model picker in the Chat view.](../images/language-models/model-dropdown-change-model.png)
2727

28+
> [!TIP]
29+
> AI Toolkit can expose language models to enhance GitHub Copilot capabilities.
30+
>
31+
> For more information, see [Change the chat model](https://docs.github.com/en/copilot/how-tos/use-ai-models/change-the-chat-model#adding-more-models).
32+
2833
You can further extend the list of available models by [using your own language model API key](#bring-your-own-language-model-key).
2934

3035
If you have a paid Copilot plan, the model picker shows the premium request multiplier for premium models. Learn more about [premium requests](https://docs.github.com/en/copilot/managing-copilot/monitoring-usage-and-entitlements/about-premium-requests#premium-requests) in the GitHub Copilot documentation.
Lines changed: 3 additions & 0 deletions
Loading

docs/intelligentapps/agentbuilder.md

Lines changed: 54 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
ContentId: bd3d7555-3d84-4500-ae95-6dcd39641af0
3-
DateApproved: 07/14/2025
3+
DateApproved: 10/03/2025
44
MetaDescription: Get Started with creating, iterating and optimizing your agents in AI Toolkit.
55
---
66
# Build agents and prompts in AI Toolkit
@@ -9,9 +9,8 @@ MetaDescription: Get Started with creating, iterating and optimizing your agents
99
> Agent Builder was previously known as Prompt Builder. The updated name better reflects the feature's capabilities and its focus on building agents.
1010
1111
Agent Builder in AI Toolkit streamlines the engineering workflow for building agents, including prompt engineering and integration with tools, such as MCP servers. It helps with common prompt engineering tasks:
12-
- Generate starter prompts
13-
- Iterate and refine with each run
14-
- Break down complex tasks through prompt chaining and structured outputs
12+
13+
- Iterate and refine in real-time
1514
- Provide easy access to code for seamless Large Language Model (LLM) integration via APIs
1615

1716
Agent Builder also enhances intelligent app's capabilities with tool use:
@@ -27,29 +26,27 @@ To access Agent Builder, use either of these options:
2726

2827
- In the AI Toolkit view, select **Agent Builder**
2928
- Select **Try in Agent Builder** from a model card in the model catalog
29+
- In the My Resources view, under **Models**, right-select a model and choose **Load in Agent Builder**
3030

3131
To test a prompt in Agent Builder, follow these steps:
3232

33-
1. In **Models**, select a model from the dropdown list, or select **Browse models** to add another model from the model catalog.
33+
1. If you haven't chosen a model, select one from the **Model** dropdown list in Agent Builder. You can also select **Browse models** to add a different model from the model catalog.
3434

3535
![Screenshot showing the model selection dropdown in Agent Builder.](./images/promptbuilder/select-models.png)
3636

37-
1. Enter a **User prompt** and optionally enter a **System prompt**.
38-
39-
The *user prompt* is the input that you want to send to the model. The optional *system prompt* is used to provide instructions with relevant context to guide the model response.
40-
41-
> [!TIP]
42-
> Describe your project idea using natural language to generate prompts automatically.
43-
> ![Screenshot showing natural language prompt generation in Agent Builder.](./images/promptbuilder/generate-prompt-2.gif)
44-
45-
3. Select **Run** to send the prompts to the model.
37+
1. Enter the agent instructions.
4638

47-
4. Optionally, select **Add Prompt** to add more prompts or **Add to Prompts** to build conversation history.
39+
Use the **Instructions** field to tell your agent exactly what to do and how to do it. List the specific tasks, put them in order, and add any special instructions like tone or how to engage.
4840

49-
1. Repeat the previous steps to iterate over your prompts by observing the model response and making changes to the prompts.
41+
1. Iterate over your instructions by observing the model response and making changes to the instructions.
42+
1. Use the `{{your_variable}}` syntax to add a dynamic value in instructions. For example, add a variable called `user_name` and use it in your instructions like this: `Greet the user by their name: {{user_name}}`.
43+
1. Provide a value for the variable in the **Variables** section.
44+
1. Enter a prompt in the text box and select the send icon to test your agent.
45+
1. Observe the model's response and make any necessary adjustments to your instructions.
5046

5147
## Use MCP servers
52-
MCP server is a tool that allows you to connect to external APIs and services, enabling your agent to perform actions beyond just generating text. For example, you can use an MCP server to access databases, call web services, or interact with other applications.
48+
49+
An MCP server is a tool that allows you to connect to external APIs and services, enabling your agent to perform actions beyond just generating text. For example, you can use an MCP server to access databases, call web services, or interact with other applications.
5350

5451
Use the agent builder to discover and configure featured MCP servers, connect to existing MCP servers, or build a new MCP server from scaffold.
5552

@@ -61,42 +58,56 @@ Use the agent builder to discover and configure featured MCP servers, connect to
6158
AI Toolkit provides a list of featured MCP servers that you can use to connect to external APIs and services.
6259

6360
To configure an MCP server from featured selections, follow these steps:
64-
1. In the **Tools** section, select **+ MCP Server**, and then select **+ Add server** in the Quick Pick.
65-
2. Select **Use Featured MCP Servers** from the dropdown list.
66-
3. Choose an MCP server that meets your needs.
67-
![Screenshot showing the connect to MCP server interface in Agent Builder.](./images/promptbuilder/featured-server-2.png)
68-
4. Enter a name for the server.
69-
5. Select tools you want to use.
61+
1. In the **Tool** section, select **+ MCP Server**, and then select **MCP Server** in the Quick Pick.
62+
1. Select **Could not find one? Browse more MCP servers** from the dropdown list.
63+
![Screenshot showing the connect to MCP server interface in Agent Builder.](./images/promptbuilder/featured-server.png)
64+
65+
1. Choose an MCP server that meets your needs.
66+
![Screenshot showing the connect to MCP server interface in Agent Builder.](./images/promptbuilder/featured-server.png)
67+
68+
1. The MCP server is added to your agent in the **MCP** subsection under **Tools**.
69+
70+
### Select tools from VS Code
71+
72+
1. In the **Tool** section, select **+ MCP Server**, and then select **MCP Server** in the Quick Pick.
73+
1. Select **Use Tools Added in Visual Studio Code** from the dropdown list.
74+
![Screenshot showing the connect to MCP server interface in Agent Builder.](./images/promptbuilder/featured-server.png)
75+
1. Select tools you want to use.
7076
![Screenshot showing the select tools interface in Agent Builder.](./images/promptbuilder/select-tools.png)
7177

78+
1. An MCP Server tool called `VSCode Tools` is added to your agent in the **MCP** subsection under **Tools**.
79+
7280
### Use an existing MCP server
7381
> [!TIP]
7482
> Find MCP servers in these [reference servers](https://github.com/modelcontextprotocol/servers?tab=readme-ov-file#-reference-servers).
7583
7684
To use an existing MCP server, follow these steps:
77-
1. In the **Tools** section, select **+ MCP Server**, and then select **+ Add server** in the quick pick.
78-
2. Select **Connect to an Existing MCP Server**
79-
3. Select an option from the dropdown list to specify how you want to connect to the MCP server:
85+
1. In the **MCP Workflow** section, select **+ Add MCP Server**.
86+
87+
1. Or in Agent Builder, in the **Tool** section, select the `+` icon to add a tool for your agent, and then select **+ Add server** in the Quick Pick.
88+
1. Select **MCP server** in the Quick Pick.
89+
1. Select **Connect to an Existing MCP Server**
90+
1. Scroll down to the bottom of the dropdown list for the options to connect to the MCP server:
8091
- **Command (stdio)**: Run a local command that implements the MCP protocol
81-
- **HTTP (server-sent events)**: Connect to a remote server that implements the MCP protocol
82-
4. Select tools from the MCP server if there are multiple tools available.
83-
5. Enter your prompts and select **Run** to test the connection.
92+
- **HTTP (HTTP or server-sent events)**: Connect to a remote server that implements the MCP protocol
93+
1. Select tools from the MCP server if there are multiple tools available.
94+
1. Enter your prompts in the text box and select the send icon to test the connection.
8495

8596
Here's an example of configuring the [Filesystem](https://github.com/modelcontextprotocol/servers/tree/main/src/filesystem) server in AI Toolkit:
8697

87-
1. In the **Tools** section, select **+ MCP Server**, and then select **+ Add server** in the Quick Pick.
88-
1. Select **Connect to an Existing MCP Server**
89-
1. Select **Command (stdio)**
98+
1. In the **Tool** section, select **+ MCP Server** in the Quick Pick.
99+
1. Select **Could not find one? Browse more MCP servers** from the dropdown list.
100+
1. Scroll down to the bottom of the dropdown list and select **Command (stdio)**
90101
> [!NOTE]
91102
> Some servers use the Python runtime and the `uvx` command. The process is the same as using the `npx` command.
92103
1. Navigate to the [Server instructions](https://github.com/modelcontextprotocol/servers/tree/main/src/filesystem#npx) and locate the `npx` section.
93104
1. Copy the `command` and `args` into the input box in AI Toolkit. For the Filesystem server example, it's `npx -y @modelcontextprotocol/server-filesystem /Users/<username>/.aitk/examples`
94-
1. Input a name for the server.
105+
1. Input an ID for the server.
95106
1. Optionally, enter extra environment variables.
96107
Some servers might require extra environment variables such as API keys. In this case, AI Toolkit fails at the stage of adding tools and a file `mcp.json` opens, where you can enter the required server details following the instructions provided by each server.
97108
![Screenshot showing an example of a missing arg exception](./images/promptbuilder/modify-args.png)
98109
After you complete the configuration:
99-
1. Navigate back to **Tools** section and select **+ MCP Server**
110+
1. Navigate back to **Tool** section and select **+ MCP Server**
100111
1. Select the server you configured from the dropdown list
101112

102113
1. Select the tools you want to use.
@@ -106,39 +117,37 @@ Here's an example of configuring the [Filesystem](https://github.com/modelcontex
106117
AI Toolkit also provides a scaffold to help you build a new MCP server. The scaffold includes a basic implementation of the MCP protocol, which you can customize to suit your needs.
107118

108119
### Build a new MCP server
120+
109121
To build a new MCP server, follow these steps:
110-
1. In the **Tools** section, select **+ MCP Server**, and then select **+ Add server** in the quick pick.
111-
1. Select **Create a New MCP Server**
122+
1. In the **MCP Workflow** section, select **Create New MCP Server**.
112123
1. Select a programming language from the dropdown list: **Python** or **TypeScript**
113124
1. Select a folder to create the new MCP server project in.
114125
1. Enter a name for the MCP server project.
115126

116-
![Animated GIF showing how to use the scaffold mcp](./images/promptbuilder/scaffold-mcp.gif)
117-
118127
After you create the MCP server project, you can customize the implementation to suit your needs. The scaffold includes a basic implementation of the MCP protocol, which you can modify to add your own functionality.
119128

120-
You can also use the agent builder to test the MCP server. The agent builder sends the prompts to the MCP server and displays the response.
129+
You can also use the Agent Builder to test the MCP server. The Agent Builder sends the prompts to the MCP server and displays the response.
121130

122131
Follow these steps to test the MCP server:
123132

124133
> [!NOTE]
125134
> To run the MCP Server in your local dev machine, you need: [Node.js](https://nodejs.org/) or Python installed on your machine.
126135
127136
1. Open VS Code Debug panel. Select `Debug in Agent Builder` or press `F5` to start debugging the MCP server.
128-
1. Use AI Toolkit Agent Builder to test the server with the following prompt:
129-
1. System Prompt: You are a weather forecast professional that can tell weather information based on given location.
130137
1. The server is automatically connected to Agent Builder.
131-
1. Select `Run` to test the server with the prompt.
138+
1. Use AI Toolkit Agent Builder to enable the agent with the following instructions:
139+
- "You are a weather forecast professional that can tell weather information based on given location.".
132140

133-
![Animated GIF showing the debug mcp process](./images/promptbuilder/mcp-debug.gif)
141+
1. Enter the prompt "What is the weather in Seattle?" in the prompt box and select the send icon to test the server with the prompt.
142+
1. Observe the response from the MCP server in the Agent Builder.
134143

135144
## Use function calling
136145

137146
Function calling connects your agent to external APIs and services.
138147

139148
![Screenshot showing the Add Custom Function Tool dialog with options to add tools by example or upload schemas.](./images/promptbuilder/add-function-call.png)
140149

141-
1. In **Tools**, select **Add Tool**, then **Custom Tool**.
150+
1. In **Tool**, select **Add Tool**, then **Custom Tool**.
142151
1. Choose how to add the tool:
143152
- **By Example**: Add from a JSON schema example
144153
- **Upload Existing Schema**: Upload a JSON schema file
@@ -153,26 +162,6 @@ Use function calling tools in the **Evaluation** tab by entering mock responses
153162

154163
![Screenshot showing function calling tool usage in the evaluation tab.](./images/promptbuilder/function-call-eval.png)
155164

156-
## Structured output
157-
158-
Structured output support helps you design prompts to deliver outputs in a structured, predictable format.
159-
160-
![Animated GIF showing how to use structured output](./images/promptbuilder/structured-output-2.gif)
161-
162-
To test using structured output in Agent Builder, follow these steps:
163-
164-
1. Select the **Structure output** from the left area, and select **json_schema**.
165-
166-
1. Select **Prepare schema**, and then select **Select local file** to use your own schema, or select **Use an example** to use a predefined schema.
167-
168-
If you proceed with an example, you can select a schema from the dropdown list.
169-
170-
1. Select **Run** to send the prompts to the selected model.
171-
172-
1. You can also edit the schema by selecting name of the schema.
173-
174-
![Screenshot showing the edit schema dropdown in Agent Builder.](./images/promptbuilder/edit-schema-2.png)
175-
176165
## Integrate prompt engineering into your application
177166

178167
After experimenting with models and prompts, you can get into coding right away with the automatically generated Python code.
@@ -185,7 +174,7 @@ To view the Python code, follow these steps:
185174

186175
1. For models hosted on GitHub, select the inference SDK you want to use.
187176

188-
AI Toolkit generates the code for the model you selected by using the provider's client SDK. For models hosted by GitHub, you can choose which inference SDK you want to use: [Azure AI Inference SDK](https://learn.microsoft.com/python/api/overview/azure/ai-inference-readme?view=azure-python-preview) or the SDK from the model provider, such as [OpenAI SDK](https://platform.openai.com/docs/libraries) or [Mistral API](https://docs.mistral.ai/api).
177+
AI Toolkit generates the code for the model you selected by using the provider's client SDK. For models hosted by GitHub, you can choose which inference SDK you want to use: [Agent Framework SDK](https://github.com/microsoft/agent-framework) or the SDK from the model provider, such as [OpenAI SDK](https://platform.openai.com/docs/libraries) or [Mistral API](https://docs.mistral.ai/api).
189178

190179
1. The generated code snippet is shown in a new editor, where you can copy it into your application.
191180

Lines changed: 2 additions & 2 deletions
Loading
Lines changed: 3 additions & 0 deletions
Loading
Lines changed: 2 additions & 2 deletions
Loading
Lines changed: 2 additions & 2 deletions
Loading
Lines changed: 2 additions & 2 deletions
Loading
Lines changed: 2 additions & 2 deletions
Loading
Lines changed: 2 additions & 2 deletions
Loading

0 commit comments

Comments
 (0)