Skip to content

docs(AI): Add Overview page #2969

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
May 20, 2025
Merged

docs(AI): Add Overview page #2969

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
12d423f
docs(common): Add AI Code Assistant overview
dimodi May 20, 2025
6d4613c
Add one more difference between Copilot extension and MCP
dimodi May 20, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 0 additions & 2 deletions _contentTemplates/common/get-started.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
9 changes: 5 additions & 4 deletions ai/copilot-extension.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand Down Expand Up @@ -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.
* "`@telerikblazor` Generate a Grid with sorting and paging enabled. Bind the Grid to a Person model and provide dummy data."
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

blockquotes would be better representation

* "`@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."

## Number of Requests

Expand All @@ -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
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Either all, or no items should have ending punctuation

* 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.
Expand Down
9 changes: 5 additions & 4 deletions ai/mcp-server.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand Down Expand Up @@ -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.
* "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."


## Number of Requests
Expand All @@ -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.
Expand Down
41 changes: 41 additions & 0 deletions ai/overview.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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.
6 changes: 6 additions & 0 deletions getting-started/client-blazor.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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.
Expand Down
5 changes: 4 additions & 1 deletion getting-started/hybrid-blazor.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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).
Expand All @@ -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

Expand Down
6 changes: 4 additions & 2 deletions getting-started/web-app.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand Down
8 changes: 5 additions & 3 deletions getting-started/what-you-need.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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)
Expand Down
Loading