Showing posts with label Visual Studio Code. Show all posts
Showing posts with label Visual Studio Code. Show all posts

Thursday, September 3, 2026

Enhancing C# Development with GitHub Copilot CLI and VS Code

GitHub Copilot is transforming how developers work by turning AI from a simple code generator into a practical development partner. In this article, we explore how to use GitHub Copilot CLI and Visual Studio Code together with the Awesome Copilot ecosystem to build better .NET applications, customize AI behavior, and bring domain-specific guidance directly into the development workflow. From designing models and applying best practices to installing reusable agents, instructions, and skills, this walkthrough shows how to make Copilot feel deeply integrated with the way you code.

Using GitHub Copilot CLI

Create a sample .NET Console app

From within a termnal window in a working directory, type the following commands:

dotnet new console -o AwesomeAthlete
cd AwesomeAthlete

Install GitHub Copilot CLI

Follow instructions at Installing GitHub Copilot CLI to install the GitGub Copilot CLI.

Start the copilot app by typing the following command inside the same folder as the .NET app created earlier:

copilot

Explore online plugins repo

Visit: https://github.com/github/awesome-copilot and review the plugins/csharp-dotnet-development plugin.

Install the plugin by entering this command in GitHub Copilot CLI:

/plugin install csharp-dotnet-development@awesome-copilot

To view a list of plugins, enter this command:

/plugin list

Let's get the plugin to do something useful. For example, ask the plugin to help you design some domain models by entering this command:

@csharp-dotnet-development help me design a class model for Athlete

Thereafter, you can enter this command to add the required C# classes:

add the class models to my app and put code in Program.cs that calls those classes and prints sample data to the console

Among others, the plugin contains a command named /csharp-dotnet-development:dotnet-best-practices. We can use this command by entering this instruction:

/csharp-dotnet-development:dotnet-best-practices

Since we have a very simple C# application, the only suggestion made by AI is to add documentation to the domain classes.

Exit GitHub Copilot CLI by typing in the /exit command.

/exit

Using Visual Studio Code (VS Code)

If you do not already have VS Code installed on your computer, you can get it from https://code.visualstudio.com/. Make sure to install the GitHub Copilot Chat extension before proceeding.

Open the AwesomeAthlete folder in VS Code. You ca do that by simply typing in the following from a termninal window from inside the AwesomeAthlete folder:

code .

Customize or Extend the Plugin

You can modify plugin components to suit your needs.

In plugin folder: ~/.copilot/installed-plugins/awesome-copilot/<plugin-name>/

  • Edit com.github.copilot/agents/*.md to change agent behavior
  • Edit skills/*/SKILL.md to add new skills

Restart VS Code to reload changes

Installing Awesome Copilot artifacts

Point your browser to Awesome GitHub Copilot. Let's try installing the Caveman Mode instruction that optimizes token interaction with AI. Click on Instructions.

Find the Caveman Mode instruction. Click on VS Code Install.

Click Yes on this dialog.

Choose to install the instructions in the current workspace under folder .github, instead of globally.

Accept the default name caveman-mode for the instructions.

The caveman-mode-instructions.md file is saved in your workspace under .github.

Here is an example on how to use this instruction. Enter the following into the VS Code chat window:

caveman-mode how many years did it take to build the empire state building in new york

The prompt is distilled to the essential keywords: Empire State Building construction duration. The response stays concise and focused, avoiding unnecessary wording. This keeps token usage low and saves you money.

Awesome Copilot

The Awesome Copilot (By Tim Heuer) extension for VS Code allows you to browse and download instructions, prompts, chat modes, and agents from the Awesome Copilot community.

Install the above extension into your VS Code. You wiill find Awesome Copilot in your explorer.

You will find folders Instructions, Agents, and Skills.

For example, expand the Agents node, then select CSharpExpert.agent.md.

If you decide to download this agent, click on the download tool beside it.

You can change the same of the agent .md file. Simply hit Enter to accept the default name.

The agent gets installed in your local workspace under .github/agents.

You can also modify any of these AI artifacts after you install them locally.

💡 TIP: There are new AI artifacts being added regularly. Click on refresh to load the latest.

@agentPlugins

There are multiple ways of installing AI plugins into VS Code. In your VS Code Extensions tab enter the keywoord @agentPlugins.

There are many plugins that you can choose from. You can narrow down the list by adding a filter. For example, I entered the csharp filter and received a short list of the plugings that fit that keyword:

Click on the csharp-dotnet-development plugin. You will see more information about the plugin. In this example, the plugin consists of a number of slash (/) commands and one agent.

I you are in a C# application, you can use the /csharp-dotnet-development:csharp-xunit slash command to generate test cases with this prompt:

/csharp-dotnet-development:csharp-xunit generate test cases

Plugins consist of plugin.json file, skills, agents, hooks, and MCP. Below is an illustration of the plugin architecture:

Any agents that are installed in your environment can be invoked from the chat window. For example, in the below illustration, I installed the CSharpExpert.agent.md agent locally and it is appears in the chat window ready to be invoked:

You can, at any time, disable or uninstall any plugin by right-clicking on it in the extensions tab and choosing disable or uninstall.

Conclusion

GitHub Copilot plugins extend AI-assisted development beyond simple code generation. With GitHub Copilot CLI, VS Code, and the Awesome Copilot ecosystem, you can add specialized agents, instructions, skills, hooks, and commands to your C# workflow.

These tools help you design .NET applications, apply best practices, generate tests, and customize Copilot to match your development style. Explore the available artifacts, install the ones that fit your needs, and adapt them to make GitHub Copilot a more effective development partner.

References

Manage Agents, Instructions, Prompts, & Skills in Seconds with this VS Code Extension

Get Awesome-Copilot custom chat modes and prompt files - right from within GitHub Copilot Chat.

GitHub Copilot Agent Plugins: Package & Distribute Skills, MCP, Hooks & Custom Agents

Monday, March 9, 2026

MCP server with Laravel

In this article, we will create a tool in our Laravel MCP server to add to-do items. We will then consume the MCP server from an MCP client like VS Code.

Source Code: https://github.com/medhatelmasry/mcp-todo-laravel

Getting Started

Create a standard Laravel app with the following command:

composer create-project laravel/laravel mcp-todo-laravel
cd mcp-todo-laravel

Install the official Laravel MCP package via Composer:

composer require laravel/mcp

Publish the MCP configuration and routing files:

php artisan vendor:publish --tag=ai-routes

This creates routes/ai.php, where we will register your MCP servers.

Open your application in VS Code. 

We need to register the ai.php in the application bootstrap file. Edit the bootstrap/app.php file. Make these changes:

1) Add this at the top:

use Illuminate\Support\Facades\Route;

2) Add this code just under “health: '/up',”:

then: function () {
  Route::prefix('mcp')
    ->middleware('api') // api middleware disables CSRF checks
    ->group(base_path('routes/ai.php'));
},


Create and Register the Server 

Generate an MCP server class to group our tools:

php artisan make:mcp-server TodoServer

This creates the following file:

<?php

namespace App\Mcp\Servers;

use Laravel\Mcp\Server;
use Laravel\Mcp\Server\Attributes\Instructions;
use Laravel\Mcp\Server\Attributes\Name;
use Laravel\Mcp\Server\Attributes\Version;

#[Name(Todo Server')]
#[Version('0.0.1')]
#[Instructions('This server is used to manage the to-do list. Tools are used to add to-do items.')]
class TodoServer extends Server {
    protected array $tools = [
        //
    ];

    protected array $resources = [
        //
    ];

    protected array $prompts = [
        //
    ];
}

Update the file with the text highlighted in yellow above.

Then, register it in routes/ai.php as either a local or web server (or both) by replacing the content with the following:


<?php
use App\Mcp\Servers\TodoServer;
use Laravel\Mcp\Facades\Mcp;

// Web server: accessible via HTTP POST at /mcp/todo
Mcp::web('/mcp/todo', TodoServer::class);

// Local server: runs as an Artisan command
Mcp::local('todo', TodoServer::class);


Create an MCP Tool 

Tools define the actions an AI can perform. Generate a new tool class with:

php artisan make:mcp-tool AddTodoTool

This adds the following tool:


<?php

namespace App\Mcp\Tools;

use Illuminate\Contracts\JsonSchema\JsonSchema;
use Laravel\Mcp\Request;
use Laravel\Mcp\Response;
use Laravel\Mcp\Server\Attributes\Description;
use Laravel\Mcp\Server\Tool;

#[Description('A description of what this tool does.')]
class AddTodoTool extends Tool {
    public function handle(Request $request): Response {
        //
        return Response::text('The content generated by the tool.');
    }
    public function schema(JsonSchema $schema): array {
        return [
            //
        ];
    }
}

Replace the above file with the following code:

<?php

namespace App\Mcp\Tools;

use Illuminate\Contracts\JsonSchema\JsonSchema;
use Laravel\Mcp\Request;
use Laravel\Mcp\Response;
use Laravel\Mcp\Server\Attributes\Description;
use Laravel\Mcp\Server\Tool;

#[Description('Add a to-do item to the database. It takes description, isDone (Boolean) and date as parameters.')]
class AddTodoTool extends Tool {
    public function handle(Request $request): Response {
        $validated = $request->validate( 
            [
                'description' => 'required|string',
                'isDone' => 'required|boolean',
                'created_at' => 'required|string',
            ]);

        logger($validated);

        return Response::text('The content generated by the tool.');
    }

    public function schema(JsonSchema $schema): array {
        return [
            'description' => $schema->string()
                ->description("The description of the to-do item")
                ->required(),
            'isDone' => $schema->boolean()
                ->description("True if done and False if not done")
                ->required(),
            'created_at' => $schema->string()
                ->description("The date when the to-do item was created")
                ->required(),
        ];
    }
}

Register the above tool in the $tools array in app/Mcp/Servers/TodoServer.php. Add the code highlighted in yellow below.

use App\Mcp\Tools\AddTodoTool;

. . . . . . . . . .

protected array $tools = [
    AddTodoTool::class,
];

Let’s now run the server with:

php artisan serve


Connecting to a Client

To test our server, we can use the MCP Inspector or add the endpoint to an AI IDE like VS Code. 

Let us first test with the MCP Inspector. In another terminal window from the same folder, start the MCP inspector with:

php artisan mcp:inspector mcp/todo

The inspector will open in your default browsesr. Add :8000 to the URL, then click on the black Connect button.

Click on Tools, followed by "List Tools".

Click on "Add Todo Tool", enter a description (like: Add to-do item: go to the gym), enter a date, then click on the "Run Tool" button - as shown below.

The following confirmation will be displayed:

We now know that the MCP server and to-do tool are working as expected. Let's consume the MCP service from VS Code. In Visual Studio Code, from the top menu, select View >> Pallette

Choose "MCP: Add Server ...".

Choose "HTTP (HTTP or Server-Sent Events).

Enter http://localhost:8000/mcp/todo for the URL, then hit ENTER.

Give the server ID: todo-mcp-server.

Choose: Workspace Available in the workspace, runs locally.

A file gets created under .vscode named mcp.json that looks like this:


{
	"servers": {
		"todo-mcp-server": {
			"url": "http://localhost:8000/mcp/todo",
			"type": "http"
		}
	},
	"inputs": []
}

Make sure the server is running.

In Visual Studio Code, open the chat panel by clicking on the below tool.

Choose Agent mode.


Next, click on the "Configure Tools ..." tool as shown below.

The "Configure Tools ..." panel will open at the top and you should see that our todo-mcp-server is running. 

Close the "Configure Tools ..." panel by clicking on the blue OK button.

Enter the following prompt into the chat windows:

using the todo mcp server, add this todo item: fix the dish washer dated 2026-03-07

VS Code will seek your permission to proceed. Click on the "Allow in this Session" button.

Sample Output:

Extending the Laravel MCP Tool

Let us get our Todo tool to add items into a SQLite database. We can get AI to do some of the coding for us. Enter this prompt into the chat window:
Create a model called Todo, Add a migration. The database table should have description (string) and isDone ( Boolean). In the model, add all columns as fillable.

This may request that you agree to the execution of this terminal window command:

It then asks you to run this command to apply the migration:

php artisan migrate

Go ahead and run the above command. 

In app/Mcp/Tools/AddTodoTool.php:

1) Add this at the top:

use App\Models\Todo;

2) Add this code to the handle() method just before the final return statement:

Todo::create($validated);

Test it out by entering this prompt:

I need to put gas in the car and buy bread.

Sample Result:

The todos table in the database/database.sqlite database file will contain the data that was just inserted into the database.

Conclusion

We have successfully added a Todo MCP tool in a Laravel application. There are so many opportunities to get AI to participate in a new way of concievinng applications that users can interface with using a AI chat interaction.

Sunday, October 19, 2025

Small Language Models with AI Toolkit Extension in VS Code

In this article, we will see how we can work with small language models (SLM) from the AI Toolkit extension in VS Code. Though the toolkit can do other things, our focus is to consume an ONNX SLM hosted on Visual Studio Code from a C# application. We will first look at an example that is based on OpenAI packages. We will later use a similar example based on the Sematic Kernal approach.

Companion Video: https://youtu.be/V_eWAM2fxJg

Prerequisites

You will need:

  • The latest version of VS Code
  • .NET version 9.0 or higher

What are small language models (SLMs)?

Small Language Models (SLMs) are compact versions of large language models (LLMs), designed to deliver strong performance in natural language tasks while using significantly fewer computational resources.

What is the AI Toolkit Extension in VS Code?

The AI Toolkit Extension for Visual Studio Code is a powerful, all-in-one environment for building, testing, and deploying generative AI applications—especially useful for developers working with small language models (SLMs).

Getting Started

Install the following Visual Studio Code extension:


Click on the three dots (...) in the left navigation of VS Code, and choose "AI Toolkit".

Click on "Model Catalog".

Scroll down down the list until you find “Local Models” >> ONNX >> Minstral 7B – (CPU – Small, Standard) >> + Add Model.

Once the model is fully downloaded, it will appear under Models >> ONNX.

Right-click on the model and select “Copy Model Name”.

I copied the following name for the "Minstral 7B" model: 

mistral-7b-v02-int4-cpu

Using OpenAI packages

Create a C# console application named AIToolkitOpenAI and add to it required packages with the following terminal window commands:

dotnet new console -n AIToolkitOpenAI
cd AIToolkitOpenAI
dotnet add package OpenAI

Start VS Code with:

code .

Click on the "AI Toolkit" tab in VS Code and make sure that the "Minstral 7B" model is running.

Replace content of Program.cs with this code:

using OpenAI;
using OpenAI.Chat;
using System.ClientModel;
using System.Text;

var model = "mistral-7b-v02-int4-cpu";
var baseUrl = "http://localhost:5272/v1/"; // root URL for local OpenAI-like server
var apikey = "unused";

OpenAIClientOptions options = new OpenAIClientOptions();
options.Endpoint = new Uri(baseUrl);
ApiKeyCredential credential = new ApiKeyCredential(apikey);
ChatClient client = new OpenAIClient(credential, options).GetChatClient(model);

// Build the prompt
StringBuilder prompt = new StringBuilder();
prompt.AppendLine("You will analyze the sentiment of the following product reviews.");
prompt.AppendLine("Each line is its own review. Output the sentiment of each review in");
prompt.AppendLine("a bulleted list and then provide a general sentiment of all reviews.");
prompt.AppendLine();
prompt.AppendLine("I bought this product and it's amazing. I love it!");
prompt.AppendLine("This product is terrible. I hate it.");
prompt.AppendLine("I'm not sure about this product. It's okay.");
prompt.AppendLine("I found this product based on the other reviews. It worked");

// send the prompt to the model and wait for the text completion
var response = await client.CompleteChatAsync(prompt.ToString());
// display the response
Console.WriteLine(response.Value.Content[0].Text);

Run the application with:

dotnet run

The application does sentiment analysis on what customers think of the product.

This is a sample of the output:

* I bought this product and it's amazing. I love it!: Positive sentiment
* This product is terrible. I hate it.: Negative sentiment
* I'm not sure about this product. It's okay.: Neutral sentiment
* I found this product based on the other reviews. It worked for me.: Positive sentiment

General sentiment: The reviews contain both positive and negative sentiments. Some customers expressed their love for the product, while others expressed their dislike. Neutral sentiment was also expressed by one customer. Overall, the reviews suggest that the product has the potential to elicit strong feelings from customers, both positive and negative.

Sematic Kernel packages

Create a C# console application named AIToolkitSK and add to it required packages with the following terminal window commands:

dotnet new console -n AIToolkitSK
cd AIToolkitSK
dotnet add package Microsoft.SemanticKernel

Start VS Code with:

code .

Click on the "AI Toolkit" tab in VS Code and make sure that the "Minstral 7B" model is running.

Replace content of Program.cs with this code:

using System.Text;
using Microsoft.SemanticKernel;
using Microsoft.SemanticKernel.ChatCompletion;
using Microsoft.SemanticKernel.Connectors.OpenAI;

var model = "mistral-7b-v02-int4-cpu";
var baseUrl = "http://localhost:5272/v1/";
var apikey = "unused";

// Create a chat completion service
var kernel = Kernel.CreateBuilder()
    .AddOpenAIChatCompletion(modelId: model, apiKey: apikey, endpoint: new Uri(baseUrl))
    .Build();
var chat = kernel.GetRequiredService<IChatCompletionService>();
var history = new ChatHistory();
history.AddSystemMessage("You are a useful chatbot. Always reply in a funny way with short answers.");
var settings = new OpenAIPromptExecutionSettings
{
    MaxTokens = 500,
    Temperature = 1,
};

while (true)
{
    Console.Write("\nUser: ");
    var userInput = Console.ReadLine();
    if (string.IsNullOrWhiteSpace(userInput)) break;

    history.AddUserMessage(userInput);

    var responseBuilder = new StringBuilder();
    Console.Write("\nAI: ");
    await foreach (var message in chat.GetStreamingChatMessageContentsAsync(userInput, settings, kernel))
    {
        responseBuilder.Append(message);
        Console.Write(message);
    }
}

This is a simple chat completion app.

Run the application with:

dotnet run

My prompt was:

Red or white wine with beef steak?

The response was:

AI:  Both red and white wines can pair well with beef steak, but a red wine is generally the more traditional choice. Red wines, such as Cabernet Sauvignon, Merlot, or Pinot Noir, have flavors that complement the rich and savory flavors of beef. However, if you prefer a lighter taste, a white wine such as Pinot Noir or Chardonnay can also work well with beef steak. Ultimately, it comes down to personal preference.

Conclusion

We have seen how to use SLMs hosted by VS Code through the AI Toolkit extension. We were able to communicate with the model from these two C# applications: (1) a app the uses OpenAI packages, and (2) an app that uses Sematic Kernel.