Skip to content

Commit 4e86a64

Browse files
didiyordanovadidiyordanova
committed
Add AI Coding Assistant
1 parent 249a718 commit 4e86a64

File tree

7 files changed

+383
-1
lines changed

7 files changed

+383
-1
lines changed

‎_config.yml‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,9 @@ navigation:
3030
styling-and-themes:
3131
title: "Styling and Themes"
3232
position: 5
33+
ai:
34+
title: "AI Coding Assistant"
35+
position: 6
3336
security:
3437
title: "Security"
3538
position: 7

‎_contentTemplates/common/ai-coding-assistant.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
#getting-started
2+
* A [Telerik user account](https://www.telerik.com/account/).
3+
* An active [DevCraft or Telerik UI for MAUI license](https://www.telerik.com/purchase/maui-ui) or a [Telerik UI for MAUI trial](https://www.telerik.com/maui-ui).
4+
* A [.NET MAUI application that includes Telerik UI for .NET MAUI]({%slug maui-getting-started%}).
5+
#end
6+
7+
#number-of-requests
8+
A Telerik [Subscription license](https://www.telerik.com/purchase/faq/licensing-purchasing) is recommended in order to use the Telerik MAUI AI Coding Assistant without restrictions. Perpetual license holders and trial users can make a [limited number of requests per year]({%slug ai-overview%}#number-of-requests).
9+
#end

‎ai/copilot-extension.md‎

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
---
2+
title: Copilot Extension
3+
page_title: Telerik MAUI GitHub Copilot Extension
4+
description: Learn how to add and use the Telerik MAUI GitHub Copilot extension as a .NET MAUI AI coding assistant and code generator for better developer productivity. The Telerik MAUI GitHub Copilot extension provides proprietary context about Telerik UI for .NET MAUI to AI-powered software.
5+
slug: ai-copilot-extension
6+
tags: telerik, maui, ai, dotnetmaui, coding assistant, ai server
7+
position: 10
8+
---
9+
10+
# Telerik MAUI GitHub Copilot Extension
11+
12+
The Telerik MAUI [GitHub Copilot](https://github.com/features/copilot) extension is an AI-powered coding assistant that provides specialized knowledge about [Telerik UI for .NET MAUI components](https://www.telerik.com/maui-ui).
13+
14+
This extension enhances GitHub Copilot with proprietary context about Telerik MAUI controls, helping you:
15+
16+
* Generate code snippets using Telerik MAUI components
17+
* Get contextual suggestions for component properties and methods
18+
* Access best practices and implementation patterns
19+
* Speed up development with AI-powered code completion
20+
21+
## Prerequisites
22+
23+
Before using the Telerik MAUI GitHub Copilot extension, ensure you have:
24+
25+
* 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).
26+
@[template](/_contentTemplates/common/ai-coding-assistant.md#getting-started)
27+
* The latest version of your [Copilot-enabled app](https://docs.github.com/en/copilot/building-copilot-extensions/about-building-copilot-extensions#supported-clients-and-ides) (for example, Visual Studio or Visual Studio Code).
28+
29+
## Installation
30+
31+
Follow these steps to install and configure the Telerik MAUI Copilot extension:
32+
33+
1. Go to the [Telerik MAUI GitHub App](https://github.com/apps/telerikmaui) page and click the **Install** button.
34+
1. You will see a list that includes your GitHub account and all GitHub organizations that you are part of. Select your GitHub account.
35+
1. Click the **Install & Allow** button. This will allow the GitHub Copilot extension to integrate with your GitHub account.
36+
1. Enter your GitHub password when prompted.
37+
1. You will be redirected to telerik.com. Enter your Telerik account credentials if prompted. This step links the GitHub Copilot extension with your Telerik account.
38+
1. Upon successful Telerik authentication, you will be redirected to a confirmation page that indicates successful Copilot extension installation.
39+
1. Restart your [Copilot-enabled app](https://docs.github.com/en/copilot/building-copilot-extensions/about-building-copilot-extensions#supported-clients-and-ides) (for example, Visual Studio and Visual Studio Code).
40+
1. Start a new chat session in Copilot.
41+
42+
## Usage
43+
44+
To use the Telerik MAUI Copilot extension:
45+
46+
1. Open the GitHub Copilot chat window in your [Copilot-enabled app](https://docs.github.com/en/copilot/building-copilot-extensions/about-building-copilot-extensions#supported-clients-and-ides) (for example, Visual Studio or VS Code).
47+
1. Ensure you are in **Chat** mode and not in **Edit** or **Agent** mode. The Edit and Agent modes do not use the Telerik Copilot extension. However, the Agent mode can use the [Telerik MAUI MCP server]({%slug ai-mcp-server%}).
48+
1. Start your prompt with `@telerikmaui` and type your request. Verify that `@telerikmaui` is recognized and highlighted; otherwise, the extension may not be properly installed.
49+
1. Look for a status label such as **Telerik MAUI working...** or **Telerik MAUI generating response...** in the output to confirm the extension is active.
50+
1. Grant permission to the Telerik MAUI extension to read your workspace files when prompted.
51+
1. For unrelated queries, start a new chat session in a new window to avoid context pollution from previous conversations.
52+
53+
### Sample Prompts
54+
55+
The following examples demonstrate useful prompts for the Telerik MAUI extension:
56+
57+
* "`@telerikmaui` Generate a DataGrid with sorting and paging enabled."
58+
* "`@telerikmaui` Create a Telerik ComboBox for MAUI with multiple selection enabled."
59+
* "`@telerikmaui` Show me how to implement a Chart with line series."
60+
* "`@telerikmaui` Generate a CollectionView with grouping and filtering capabilities."
61+
62+
## Number of Requests
63+
64+
@[template](/_contentTemplates/common/ai-coding-assistant.md#number-of-requests)
65+
66+
## Troubleshooting
67+
68+
If you encounter issues:
69+
70+
* Ensure the `@telerikmaui` mention is properly highlighted in your prompt
71+
* Verify that you have an active GitHub Copilot subscription
72+
* Restart your IDE after installation
73+
* Check that you're in Chat mode, not Edit or Agent mode
74+
75+
## See Also
76+
77+
* [GitHub Copilot Documentation](https://docs.github.com/en/copilot)
78+
* [GitHub Copilot Tutorials](https://github.com/features/copilot/tutorials)
79+
* [Telerik MAUI MCP Server]({%slug ai-mcp-server%})
80+
* [Telerik UI for .NET MAUI Documentation](https://docs.telerik.com/devtools/maui/)

‎ai/mcp-server.md‎

Lines changed: 210 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,210 @@
1+
---
2+
title: MCP Server
3+
page_title: Telerik MAUI MCP Server
4+
description: Learn how to add and use the Telerik MAUI MCP Server as a .NET MAUI AI coding assistant and code generator for better developer productivity. The Telerik MAUI MCP server provides proprietary context about Telerik UI for .NET MAUI to AI-powered software.
5+
slug: ai-mcp-server
6+
tags: telerik,maui,ai,ai server,dotnetmaui,coding assistant
7+
position: 20
8+
---
9+
10+
# Telerik .NET MAUI MCP Server
11+
12+
The Telerik MAUI [MCP (Model Context Protocol) Server](https://modelcontextprotocol.io/introduction) enhances your AI-powered development experience by providing specialized context about Telerik UI for .NET MAUI components.
13+
14+
This MCP server enables AI-powered IDEs and tools to generate more accurate, tailored code that leverages [Telerik UI for .NET MAUI components](https://www.telerik.com/maui-ui) and APIs. You can ask complex questions about Telerik components, request specific implementations, and generate comprehensive code solutions.
15+
16+
## Prerequisites
17+
18+
To use the Telerik MAUI MCP server, you need:
19+
20+
* [Node.js](https://nodejs.org/en) 18 or newer
21+
* An [MCP-compatible client](https://modelcontextprotocol.io/clients) that supports **MCP tools** (latest version recommended)
22+
23+
@[template](/_contentTemplates/common/ai-coding-assistant.md#getting-started)
24+
25+
## Installation
26+
27+
Install the Telerik MAUI MCP server using npm:
28+
29+
```bash
30+
npm i @progress/telerik-maui-mcp
31+
```
32+
33+
### Configuration
34+
35+
Use these settings when configuring the server in your MCP client:
36+
37+
| Setting | Value |
38+
|---------|-------|
39+
| Package Name | `@progress/telerik-maui-mcp` |
40+
| Type | `stdio` (standard input/output transport) |
41+
| Command | `npx` |
42+
| Arguments | `-y` |
43+
| Server Name | `telerikMauiAssistant` (customizable) |
44+
45+
### License Configuration
46+
47+
Add your [Telerik license key]({%slug set-up-your-license%}) as an environment parameter in your `mcp.json` file using one of these options:
48+
49+
**Option 1: License File Path (Recommended)**
50+
```json
51+
"env": {
52+
"TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FIL"
53+
}
54+
```
55+
56+
**Option 2: Direct License Key**
57+
```json
58+
"env": {
59+
"TELERIK_LICENSE": "YOUR_LICENSE_KEY_HERE"
60+
}
61+
```
62+
63+
> Option 1 is recommended unless you're sharing settings across different systems. Remember to [update your license key]({%slug set-up-your-license%}#updating-your-license-key) when necessary.
64+
65+
## Visual Studio
66+
67+
For complete setup instructions, see [Use MCP servers in Visual Studio](https://learn.microsoft.com/en-us/visualstudio/ide/mcp-servers).
68+
69+
> Early Visual Studio 17.14 versions require the Copilot Chat window to be open when opening a solution for the MCP server to work properly.
70+
71+
**Workspace-Specific Setup:**
72+
73+
1. Add `.mcp.json` to your solution folder:
74+
75+
```json
76+
{
77+
"servers": {
78+
"telerikMauiAssistant": {
79+
"type": "stdio",
80+
"command": "npx",
81+
"args": ["-y", "@progress/telerik-maui-mcp@latest"],
82+
"env": {
83+
"TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE",
84+
// or
85+
"TELERIK_LICENSE": "YOUR_LICENSE_KEY"
86+
}
87+
}
88+
}
89+
}
90+
```
91+
92+
2. Restart Visual Studio.
93+
3. Enable the `telerikMauiAssistant` tool in the [Copilot Chat window's tool selection dropdown](https://learn.microsoft.com/en-us/visualstudio/ide/mcp-servers?view=vs-2022#configuration-example-with-github-mcp-server).
94+
95+
**Global Setup:**
96+
Add the `.mcp.json` file to your user directory (`%USERPROFILE%`, e.g., `C:\Users\YourName\.mcp.json`).
97+
98+
### Visual Studio Code
99+
100+
For complete setup instructions, see [Use MCP servers in Visual Studio Code](https://code.visualstudio.com/docs/copilot/chat/mcp-servers).
101+
102+
> Visual Studio Code 1.102.1 or newer is required to use the Telerik MCP Server
103+
104+
**Setup Steps:**
105+
106+
1. Enable [`chat.mcp.enabled`](vscode://settings/chat.mcp.enabled) in Visual Studio Code settings.
107+
2. Create `.vscode/mcp.json` in your workspace root (or user folder for global setup):
108+
109+
```json
110+
{
111+
"servers": {
112+
"telerik-maui-assistant": {
113+
"type": "stdio",
114+
"command": "npx",
115+
"args": ["-y", "@progress/telerik-maui-mcp@latest"],
116+
"env": {
117+
"TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE",
118+
// or
119+
"TELERIK_LICENSE": "YOUR_LICENSE_KEY"
120+
}
121+
}
122+
}
123+
}
124+
```
125+
126+
3. For global discovery, enable [`chat.mcp.discovery.enabled`](vscode://settings/chat.mcp.discovery.enabled) in `settings.json`:
127+
128+
```json
129+
{
130+
"chat.mcp.discovery.enabled": true
131+
}
132+
```
133+
134+
4. Restart Visual Studio Code.
135+
136+
### Cursor
137+
138+
For complete setup instructions, see [Model Context Protocol](https://docs.cursor.com/context/mcp).
139+
140+
Create `.cursor/mcp.json` in your workspace root (or user folder for global setup):
141+
142+
```json
143+
{
144+
"mcpServers": {
145+
"telerikMauiAssistant": {
146+
"type": "stdio",
147+
"command": "npx",
148+
"args": ["-y", "@progress/telerik-maui-mcp@latest"],
149+
"env": {
150+
"TELERIK_LICENSE_PATH": "THE_PATH_TO_YOUR_LICENSE_FILE",
151+
// or
152+
"TELERIK_LICENSE": "YOUR_LICENSE_KEY"
153+
}
154+
}
155+
}
156+
}
157+
```
158+
159+
## Usage
160+
161+
To use the Telerik MCP Server:
162+
163+
1. Start your prompt with one of these triggers:
164+
- `/telerik` / `@telerik` / `#telerik`
165+
- `/telerikmaui` / `@telerikmaui` / `#telerikmaui`
166+
- `#telerik-maui-assistant`
167+
168+
2. Verify server activation by looking for these messages:
169+
- Visual Studio: `Running telerikMauiAssistant`
170+
- Visual Studio Code: `Running telerik-maui-assistant`
171+
- Cursor: `Calling MCP tool telerikMauiAssistant`
172+
173+
3. Grant permissions when prompted (per session, workspace, or always).
174+
175+
4. Start fresh sessions for unrelated prompts to avoid context pollution.
176+
177+
### Improving Server Usage
178+
179+
To increase the likelihood of the Telerik MCP server being used, add custom instructions to your AI tool:
180+
- [GitHub Copilot custom instructions](https://docs.github.com/en/copilot/customizing-copilot/adding-repository-custom-instructions-for-github-copilot#about-repository-custom-instructions-for-github-copilot-chat)
181+
- [Cursor rules](https://docs.cursor.com/context/rules)
182+
183+
### Sample Prompts
184+
185+
186+
"`/telerik` Generate a DataGrid with sorting and paging. Bind it to a Person model with sample ViewModel."
187+
188+
"`/telerikmaui` Create a ComboBox showing a product list. Include Product class and sample data."
189+
190+
"`/telerik` Build a CollectionView with sorting and filtering capabilities."
191+
192+
193+
## Number of Requests
194+
195+
@[template](/_contentTemplates/common/ai-coding-assistant.md#number-of-requests)
196+
197+
## Local AI Model Integration
198+
199+
You can use the Telerik MAUI MCP server with local large language models (LLMs):
200+
201+
1. Run a local model through [Ollama](https://ollama.com).
202+
2. Use a bridge package like [MCP-LLM Bridge](https://github.com/patruff/ollama-mcp-bridge).
203+
3. Connect your local model to the Telerik MCP server.
204+
205+
This setup allows you to use the Telerik AI Coding Assistant without cloud-based AI models.
206+
207+
## See Also
208+
209+
* [Telerik MAUI GitHub Copilot Extension]({%slug ai-copilot-extension%})
210+
* [AI Coding Assistant Overview]({%slug ai-overview%})

‎ai/overview.md‎

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
---
2+
title: Overview
3+
page_title: Telerik UI for .NET MAUI AI Tooling Overview
4+
description: Learn about the AI-powered developer tools that integrate with your IDE or code editor for greater productivity and enhanced developer experience.
5+
slug: ai-overview
6+
tags: telerik,maui,dotnetmaui,ai,coding assistant
7+
position: 0
8+
---
9+
10+
# Telerik UI for .NET MAUI AI Coding Assistant
11+
12+
The Telerik UI for .NET MAUI AI Coding Assistant enhances your developer experience and increases productivity when building .NET MAUI applications with Telerik UI for .NET MAUI components.
13+
14+
The coding assistant is an AI code generator that provides specialized context to AI models, enabling them to produce higher-quality code samples using the [Telerik UI for .NET MAUI components](https://www.telerik.com/maui-ui) and APIs.
15+
16+
## Available Tools
17+
18+
The Telerik AI Coding Assistant is available through:
19+
20+
* [Telerik MAUI GitHub Copilot Extension]({%slug ai-copilot-extension%})
21+
* [Telerik MAUI MCP Server]({%slug ai-mcp-server%})
22+
23+
### Key Differences
24+
25+
**MCP Server:**
26+
* More powerful and handles complex, multi-step prompts
27+
* Works with MCP-enabled clients like Cursor or GitHub Copilot in Agent mode
28+
* Can directly suggest changes and rebuild applications to verify generated code
29+
* Responses are primarily code-focused
30+
31+
**GitHub Copilot Extension:**
32+
* Provides detailed explanations alongside code suggestions
33+
* Offers shorter, focused code snippets
34+
* Better for learning and understanding implementation approaches
35+
36+
## Getting Started
37+
38+
To use the Telerik MAUI AI Coding Assistant, you need:
39+
40+
@[template](/_contentTemplates/common/ai-coding-assistant.md#getting-started)
41+
* @[template](/_contentTemplates/common/ai-coding-assistant.md#number-of-requests)
42+
43+
## Number of Requests
44+
45+
The Telerik MAUI AI Coding Assistant allows the following maximum number of requests based on your [Telerik license type](https://www.telerik.com/purchase/faq/licensing-purchasing):
46+
47+
| License Type | Request Limit |
48+
|--------------|---------------|
49+
| **Perpetual** | 50 requests per year |
50+
| **Subscription** | Virtually unlimited with fair use threshold of 300 requests per day |
51+
| **Trial** | 300 requests per trial period (does not reset with new trial activations) |
52+
53+
> **Important:** All Telerik AI tools share a single request quota for your Telerik account. Usage from the [Telerik Copilot extension]({%slug ai-copilot-extension%}) and [Telerik MCP server]({%slug ai-mcp-server%}) counts toward the same limit. Complex prompts in the MCP server may consume multiple requests.
54+
55+
## Privacy
56+
57+
The Telerik MAUI AI Coding Assistant operates under strict privacy guidelines:
58+
59+
**Data Access:**
60+
* No access to your workspace and application code.
61+
* Exception: when using the Telerik MCP server (or any other MCP server), the LLM generates parameters for the MCP server request, which may include parts of your application code.
62+
63+
**Data Usage:**
64+
* Your prompts are not used to train Telerik AI models.
65+
* Does not generate or access AI responses.
66+
* Provides enhanced context to improve responses from your chosen AI model (GPT, Gemini, Claude, etc.).
67+
68+
**Data Storage:**
69+
* Prompts and context are anonymized and stored only for statistical analysis and troubleshooting.
70+
* No association between prompts and your Telerik user account.
71+
* Usage metrics are collected to ensure [license compliance](#number-of-requests).
72+
73+
> Review the terms and privacy policies of your selected AI model and AI client.
74+
75+
## Next Steps
76+
77+
* Install the [Telerik MAUI GitHub Copilot Extension]({%slug ai-copilot-extension%})
78+
* Configure the [Telerik MAUI MCP Server]({%slug ai-mcp-server%}) with an MCP-enabled client

0 commit comments

Comments
 (0)