Extending AI Agents: A live demo of the GitHub MCP Server
By GitHub
Key Concepts
- MCP (Model-Centric Protocol): A protocol enabling AI models to interact with the outside world, including fetching external context and creating side effects.
- MCP Server: Software that implements the MCP protocol, acting as an intermediary for AI models to access tools and external resources.
- MCP Registry: A platform for discovering and installing MCP Servers.
- VS Code MCP Host: An environment within Visual Studio Code that supports and runs MCP Servers, offering comprehensive protocol coverage.
- Agent Mode: A feature within VS Code that allows users to interact with AI agents powered by MCP Servers.
- Prompts (Slash Commands): Pre-defined commands within Agent Mode that trigger complex agentic workflows.
- Coding Agent: A specific agent that can interact with code repositories, assign issues, and modify code.
- Playwright MCP Server: An MCP Server that drives web browsers for human-computer interaction tasks.
- Mermaid Charts: A diagramming tool that can be rendered within GitHub, often generated by AI agents.
Introduction to MCP and GitHub MCP Server
Toby Padilla introduced the concept of MCP as a mechanism for AI to interact with the external world. This interaction primarily involves two aspects:
- Fetching Context: AI models can access information not included in their training data, such as recent publications or private internal data.
- Creating Side Effects: AI models can perform actions like creating files, modifying GitHub repositories, or designing in Figma.
MCP, approximately 11 months old, was created by Anthropic. Toby highlighted that it was more of a social innovation, standardizing existing function-calling APIs and bootstrapping the community with reference servers. The GitHub MCP Server, initially developed by Anthropic, became the most popular among the initial set. GitHub took ownership, rewrote it in Go, and launched it, achieving significant popularity, becoming the most popular open-source project on GitHub the week it launched, indicating a strong demand for driving GitHub's platform with agents.
Live Demo of GitHub MCP Server in VS Code
Sam Morrow demonstrated the GitHub MCP Server, focusing on its integration with VS Code.
Installing and Using the MCP Server
- MCP Registry: The demo began by showcasing the MCP registry web page, from which the MCP Server can be installed for VS Code and VS Code Insiders. VS Code is described as the most comprehensive MCP host, offering complete coverage of the latest spec and superior protocol support compared to Anthropic's hosts. VS Code Insiders is recommended for testing innovative MCP features.
- Agent Mode: Sam then navigated to the Agent Mode tab in VS Code.
- Simple Prompt: A basic prompt, "Can you list some issues from a Repo in my account?", was executed. The MCP Server immediately listed issues from the repository, including closed ones, without further action requested by the user.
- Coding Agent Prompt: A more complex workflow was demonstrated using a "Coding Agent" prompt. This prompt first asked for the repository to work on and then generated a prompt for the MCP Server. The server then analyzed issues in the repository and assigned them to the Coding Agent. The user had to grant permission for the session. The prompt was designed to avoid assigning low-quality or underspecified issues.
- Aggregating Pull Requests: Another prompt involved aggregating information from the GitHub MCP Server Repo. The agent was tasked with pulling recent pull requests and generating an issue celebrating the work done. The MCP Server listed the pull requests, processed the information, and created an issue. The resulting issue included a summary of the pull requests and generated Mermaid charts, showcasing the platform's ability to render them. This was highlighted as a powerful tool for improving issue bodies and performing summary work, especially for managers.
Interacting with Files and Repositories
- Fetching Files: Sam demonstrated the ability to pull down files from GitHub. The MCP Server can access any file within a GitHub repository across different revisions and branches. The
index.htmlfile was fetched and previewed using a VS Code plugin. - Coding Agent and Website Redesign: The Coding Agent prompt used earlier was shown to have worked on different revisions of a website. The demo then transitioned to "Agents HQ" to show the latest agent session. This session also utilized the GitHub MCP Server itself, referencing issues within the repository it was working on.
- Previous Redesign Example: A previous instance where the agent was instructed to redesign a web page was shown. The resulting pull request included a "before and after" screenshot of the work. This illustrated the ability to iterate on ideas and steer agent sessions. The concept of using GitHub's mobile app for website editing was mentioned, emphasizing the accessibility and power of MCP.
- Playwright MCP Server: The Copilot Coding Agent was noted to have both the GitHub MCP Server and the Playwright MCP Server installed. The Playwright MCP Server drives web browsers for human-computer interaction, enabling tasks like taking screenshots. This is particularly useful when not on a local machine, as it provides a quick round trip for website development and testing without local installations.
- Image File Fetching: The demo concluded with fetching a physical image file. The MCP Server was able to read the content of the image and provide access to it locally, demonstrating the use of multimedia and the ability to pull assets from GitHub for various purposes, such as design mockups or repository images.
Use Cases and Scalability
Toby Padilla returned to discuss broader use cases and the scalability offered by the GitHub MCP Server.
- Scaling Project Management: For open-source projects like the GitHub MCP Server, which receives a high volume of issues and pull requests (over 1000 forks), the MCP Server is invaluable for product managers. It can summarize recent activity, classify issues by priority, and cluster them by topic, making it easier to manage large amounts of information.
- Tool Configuration: The MCP Server offers dedicated endpoints and configuration options to include only the desired toolsets. This is documented in the open-source repository, encouraging users to explore options like read-only mode and secret scanning to prevent agents from pushing sensitive tokens to public repositories.
- Enterprise Integration: The GitHub MCP Server integrates with enterprise products, including GitHub Enterprise Cloud (GHEC).
- Copilot Integration: As mentioned, it's a default MCP Server within the Copilot Coding Agent.
- MCP Registry Expansion: The recently launched MCP registry, currently featuring high-quality partner servers, will soon integrate with the OSS MCP registry, allowing self-publication. This is expected to rapidly expand the registry to thousands of servers. Users are encouraged to visit github.com/mcp to discover MCP Servers.
Conclusion and Call to Action
Toby concluded by urging attendees to try out the MCP Server themselves. He recommended loading Agent Mode, visiting github.com/mcp, installing the MCP Server, and experimenting with tasks like summarizing issues or vibe coding to experience its capabilities firsthand.
Chat with this Video
AI-PoweredHi! I can answer questions about this video "Extending AI Agents: A live demo of the GitHub MCP Server". What would you like to know?