docs(AI): Add Overview page (#2969)

dimodi · web-flow · commit c4303dfc4bb8 · 2025-05-20T16:34:20.000+03:00
* docs(common): Add AI Code Assistant overview

* Add one more difference between Copilot extension and MCP
diff --git a/_contentTemplates/common/get-started.md b/_contentTemplates/common/get-started.md
@@ -79,8 +79,6 @@ In this tutorial, you will use the [Telerik NuGet feed](slug:installation/nuget)
 
 Well done! Now you have your first Telerik UI for Blazor component running in your Blazor app, showcasing the power of front-end development with Blazor.
 
-@[template](/_contentTemplates/common/get-started.md#next-steps-after-getting-started)
-
 #end
 
 #next-steps-after-getting-started
diff --git a/ai/copilot-extension.md b/ai/copilot-extension.md
@@ -19,6 +19,7 @@ To use the Telerik GitHub Copilot extension for Blazor, you need to have:
 * An active [GitHub Copilot](https://github.com/features/copilot) subscription. You can enable or configure GitHub Copilot on the [Copilot Settings page in your GitHub account](https://github.com/settings/copilot).
 * A [Telerik user account](https://www.telerik.com/account/).
 * An active [DevCraft or Telerik UI for Blazor license](https://www.telerik.com/purchase/blazor-ui) or a [Telerik UI for Blazor trial](https://www.telerik.com/blazor-ui).
+* A [Blazor application that includes Telerik UI for Blazor](slug:blazor-overview#getting-started).
 
 ## Installation
 
@@ -48,9 +49,9 @@ To use the Telerik Blazor Copilot extension:
 
 The following list describes how your prompts may look like:
 
-* `@telerikblazor` Generate a Grid with sorting and paging enabled. Bind the Grid to a Person model and provide dummy data.
-* `@telerikblazor` Generate a Telerik ComboBox for Blazor that shows a list of products. Create a Product class and generate sample data.
-* `@telerikblazor` Show me sample code for a Telerik Blazor Grid with virtual scrolling for the rows and columns.
+* &quot;`@telerikblazor` Generate a Grid with sorting and paging enabled. Bind the Grid to a Person model and provide dummy data.&quot;
+* &quot;`@telerikblazor` Generate a Telerik ComboBox for Blazor that shows a list of products. Create a Product class and generate sample data.&quot;
+* &quot;`@telerikblazor` Show me sample code for a Telerik Blazor Grid with virtual scrolling for the rows and columns.&quot;
 
 ## Number of Requests
 
@@ -59,7 +60,7 @@ The following list describes how your prompts may look like:
 The Telerik Blazor Copilot extension allows the following maximum number of requests, depending on your [Telerik license type](https://www.telerik.com/purchase/faq/licensing-purchasing):
 
 * Perpetual licenses: 50 requests per year
-* Subscription licenses: 300 requests per day
+* Subscription licenses: virtually unlimited number of requests with a fair use threshold of 300 requests per day
 * Trial licenses: 300 requests per trial per year. Activating the same trial for a new release does not grant additional 300 requests.
 
 > All Telerik AI tools share a single request limit for your Telerik account. For example, the Telerik Copilot extension and the Telerik MCP server both take up from the same usage quota.
diff --git a/ai/mcp-server.md b/ai/mcp-server.md
@@ -19,6 +19,7 @@ To use the Telerik Blazor MCP server, you need:
 * A [compatible MCP client (IDE, code editor or app)](https://modelcontextprotocol.io/clients) that supports *MCP tools*.
 * A [Telerik user account](https://www.telerik.com/account/).
 * An active [DevCraft or Telerik UI for Blazor license](https://www.telerik.com/purchase/blazor-ui) or a [Telerik UI for Blazor trial](https://www.telerik.com/blazor-ui).
+* A [Blazor application that includes Telerik UI for Blazor](slug:blazor-overview#getting-started).
 
 ## Installation
 
@@ -162,9 +163,9 @@ To increase the probability of the Telerik MVC Server being used, or to call it
 
 The following list describes how your prompts may look like:
 
-* Telerik Generate a Blazor Grid with sorting and paging enabled. Bind the Grid to a Person model and provide dummy data.
-* Telerik Generate a ComboBox for Blazor that shows a list of products. Create a Product class and generate sample data.
-* Telerik Show me sample code for a Blazor Grid with virtual scrolling for the rows and columns.
+* &quot;Telerik Generate a Blazor Grid with sorting and paging enabled. Bind the Grid to a Person model and provide dummy data.&quot;
+* &quot;Telerik Generate a ComboBox for Blazor that shows a list of products. Create a Product class and generate sample data.&quot;
+* &quot;Telerik Show me sample code for a Blazor Grid with virtual scrolling for the rows and columns.&quot;
 
 
 ## Number of Requests
@@ -174,7 +175,7 @@ The following list describes how your prompts may look like:
 The Telerik Blazor MCP Server allows the following maximum number of requests, depending on your [Telerik license type](https://www.telerik.com/purchase/faq/licensing-purchasing):
 
 * Perpetual licenses: 50 requests per year
-* Subscription licenses: 300 requests per day
+* Subscription licenses: virtually unlimited number of requests with a fair use threshold of 300 requests per day
 * Trial licenses: 300 requests per trial per year. Activating the same trial for a new release does not grant additional 300 requests.
 
 > One prompt may trigger several requests to the MCP server, depending on the complexity.
diff --git a/ai/overview.md b/ai/overview.md
@@ -0,0 +1,41 @@
+---
+title: Overview
+page_title: Telerik Blazor AI Tooling Overview
+description: Learn about the AI-powered developer tools that integrate with your IDE or code editor for greater productivity and enhanced developer experience.
+slug: ai-overview
+tags: telerik,blazor,ai
+published: True
+position: 1
+---
+
+# Telerik Blazor AI Coding Assistant Overview
+
+The Telerik Blazor AI Coding Assistant improves your developer experience and increases your productivity when implementing Blazor apps that include Telerik UI for Blazor. The coding assistant is an AI code generator that provides proprietary context to AI models in order to produce higher quality code samples with the [Telerik UI for Blazor components](https://www.telerik.com/blazor-ui) and API.
+
+The Telerik AI Coding Assistant is integrated in:
+
+* The [Telerik Blazor GitHub Copilot Extension](slug:ai-copilot-extension)
+* The [Telerik Blazor MCP Server](slug:ai-mcp-server)
+
+The major differences between these tools are:
+
+* The MCP server is more powerful and can handle more complex prompts that require several requests to the AI model. An MCP-enabled client like GitHub Copilot in **Agent** mode can make changes to your app and rebuild it to verify the AI suggestions.
+* The responses of the GitHub Copilot extension may contain shorter or partial code snippets and more explanations how to accomplish the task. When using the MCP server, the AI response is mostly code.
+
+## Getting Started
+
+To use the Telerik Blazor AI Coding Assistant, you need:
+
+* A [Telerik user account](https://www.telerik.com/account/).
+* An active [DevCraft or Telerik UI for Blazor license](https://www.telerik.com/purchase/blazor-ui) or a [Telerik UI for Blazor trial](https://www.telerik.com/blazor-ui).
+* A [Blazor application that includes Telerik UI for Blazor](slug:blazor-overview#getting-started).
+
+> A Telerik [Subscription license](https://www.telerik.com/purchase/faq/licensing-purchasing) is recommended in order to use the Telerik Blazor AI Coding Assistant:
+> 
+> * Subscription license holders can make an unlimited number of requests.
+> * Perpetual license holders and trial users have a limited number of requests per year.
+
+## Next Steps
+
+* Install the [Telerik Blazor GitHub Copilot Extension](slug:ai-copilot-extension).
+* Add the [Telerik Blazor MCP Server](slug:ai-mcp-server) to an MCP-enabled client.
diff --git a/getting-started/client-blazor.md b/getting-started/client-blazor.md
@@ -101,6 +101,12 @@ The final step in this tutorial is to use a Telerik UI for Blazor component in a
 
 @[template](/_contentTemplates/common/get-started.md#add-component-sample)
 
+## Step 7: Install Telerik AI Coding Assistants
+
+Use the [Telerik Blazor MCP server](slug:ai-mcp-server) or the [Telerik Blazor GitHub Copilot extension](slug:ai-copilot-extension) to generate code snippets that include Telerik UI for Blazor components and API.
+
+@[template](/_contentTemplates/common/get-started.md#next-steps-after-getting-started)
+
 ## Video Tutorial
 
 If you prefer video instructions, you can also check the video tutorial below.
diff --git a/getting-started/hybrid-blazor.md b/getting-started/hybrid-blazor.md
@@ -114,6 +114,10 @@ namespace MyBlazorMauiAppName
 
 Add your desired Telerik Blazor components in the app as in a native Blazor app. Explore the available UI for Blazor components and their features in our [live demos](https://demos.telerik.com/blazor-ui).
 
+### 8. Install Telerik AI Coding Assistants
+
+* Use the [Telerik Blazor MCP server](slug:ai-mcp-server) or the [Telerik Blazor GitHub Copilot extension](slug:ai-copilot-extension) to generate code snippets that include Telerik UI for Blazor components and API.
+
 ## Running the Blazor Hybrid App
 
 You can now run the hybrid application in debug mode, but it's recommended to [be aware of possible caveats during deployment and prevent them upfront](slug:hybrid-blazor-apps#known-issues).
@@ -127,7 +131,6 @@ Refer to the following articles for more information on each technology stack:
 ## Next Steps
 
 * [Explore the specifics of Telerik UI for Blazor in native MAUI](slug:hybrid-blazor-apps)
-* Use the [Telerik Blazor MCP server](slug:ai-mcp-server) or the [Telerik Blazor GitHub Copilot extension](slug:ai-copilot-extension) to generate code snippets that include Telerik UI for Blazor components and API.
 
 ## See Also
 
diff --git a/getting-started/web-app.md b/getting-started/web-app.md
@@ -121,9 +121,11 @@ The final step in this tutorial is to use a Telerik UI for Blazor component in a
 
 @[template](/_contentTemplates/common/get-started.md#add-component-sample)
 
-## Next Steps
+## Step 7: Install Telerik AI Coding Assistants
 
-* Use the [Telerik Blazor MCP server](slug:ai-mcp-server) or the [Telerik Blazor GitHub Copilot extension](slug:ai-copilot-extension) to generate code snippets that include Telerik UI for Blazor components and API.
+Use the [Telerik Blazor MCP server](slug:ai-mcp-server) or the [Telerik Blazor GitHub Copilot extension](slug:ai-copilot-extension) to generate code snippets that include Telerik UI for Blazor components and API.
+
+@[template](/_contentTemplates/common/get-started.md#next-steps-after-getting-started)
 
 ## See Also
 
diff --git a/getting-started/what-you-need.md b/getting-started/what-you-need.md
@@ -37,6 +37,7 @@ The required milestones to obtain and use Telerik UI for Blazor are:
 1. Add the [CSS theme and JavaScript file](#css-theme-and-javascript-files).
 1. Add the [`<TelerikRootComponent>`](#telerikrootcomponent).
 1. [Add components to a view](#add-telerik-components-to-a-view).
+1. Install [Telerik Blazor AI coding assistants](#install-telerik-ai-coding-assistants).
 
 
 ## NuGet Packages
@@ -260,12 +261,13 @@ The Blazor application is ready to use Telerik components.
 }
 ````
 
-@[template](/_contentTemplates/common/get-started.md#next-steps-after-getting-started)
-
-## Next Steps
+## Install Telerik AI Coding Assistants
 
 * Use the [Telerik Blazor MCP server](slug:ai-mcp-server) or the [Telerik Blazor GitHub Copilot extension](slug:ai-copilot-extension) to generate code snippets that include Telerik UI for Blazor components and API.
 
+@[template](/_contentTemplates/common/get-started.md#next-steps-after-getting-started)
+
+
 ## See Also
 
 * [Automated MSI installer](slug:installation-msi)
