React Email Template Development
Build React-based email templates, preview them locally and review components, styling and localization.
Create MCP (Model Context Protocol) servers that enable LLMs to interact with external services through well-designed tools. The quality of an MCP server is measured by how well it enables LLMs to accomplish real-world tasks.
Microsoft provides extensive MCP infrastructure for Azure and Foundry services. Understanding this ecosystem helps you decide whether to build custom servers or leverage existing ones.
| Type | Transport | Use Case | Example |
|---|---|---|---|
| Local | stdio | Desktop apps, single-user, local dev | Azure MCP Server via NPM/Docker |
| Remote | Streamable HTTP | Cloud services, multi-tenant, Agent Service | https://mcp.ai.azure.com (Foundry) |
Before building a custom server, check if Microsoft already provides one:
| Server | Type | Description |
|---|---|---|
| Azure MCP | Local | 48+ Azure services (Storage, KeyVault, Cosmos, SQL, etc.) |
| Foundry MCP | Remote | https://mcp.ai.azure.com - Models, deployments, evals, agents |
| Fabric MCP | Local | Microsoft Fabric APIs, OneLake, item definitions |
| Playwright MCP | Local | Browser automation and testing |
| GitHub MCP | Remote | https://api.githubcopilot.com/mcp |
Full ecosystem: See 🔷 Microsoft MCP Patterns for complete server catalog and patterns.
| Scenario | Recommendation |
|---|---|
| Azure service integration | Use Azure MCP Server (48 services covered) |
| AI Foundry agents/evals | Use Foundry MCP remote server |
| Custom internal APIs | Build custom server (this guide) |
| Third-party SaaS integration | Build custom server (this guide) |
| Extending Azure MCP | Follow Microsoft MCP Patterns |
Creating a high-quality MCP server involves four main phases:
API Coverage vs. Workflow Tools: Balance comprehensive API endpoint coverage with specialized workflow tools. Workflow tools can be more convenient for specific tasks, while comprehensive coverage gives agents flexibility to compose operations. Performance varies by client—some clients benefit from code execution that combines basic tools, while others work better with higher-level workflows. When uncertain, prioritize comprehensive API coverage.
Tool Naming and Discoverability:
Clear, descriptive tool names help agents find the right tools quickly. Use consistent prefixes (e.g., github_create_issue, github_list_repos) and action-oriented naming.
Context Management: Agents benefit from concise tool descriptions and the ability to filter/paginate results. Design tools that return focused, relevant data. Some clients support code execution which can help agents filter and process data efficiently.
Actionable Error Messages: Error messages should guide agents toward solutions with specific suggestions and next steps.
Navigate the MCP specification:
Start with the sitemap to find relevant pages: https://modelcontextprotocol.io/sitemap.xml
Then fetch specific pages with .md suffix for markdown format (e.g., https://modelcontextprotocol.io/specification/draft.md).
Key pages to review: - Specification overview and architecture - Transport mechanisms (streamable HTTP, stdio) - Tool, resource, and prompt definitions
Language Selection:
| Language | Best For | SDK |
|---|---|---|
| TypeScript (recommended) | General MCP servers, broad compatibility | @modelcontextprotocol/sdk |
| Python | Data/ML pipelines, FastAPI integration | mcp (FastMCP) |
| C#/.NET | Azure/Microsoft ecosystem, enterprise | Microsoft.Mcp.Core |
Transport Selection:
| Transport | Use Case | Characteristics |
|---|---|---|
| Streamable HTTP | Remote servers, multi-tenant, Agent Service | Stateless, scalable, requires auth |
| stdio | Local servers, desktop apps | Simple, single-user, no network |
Load framework documentation:
For TypeScript (recommended):
- TypeScript SDK: Use WebFetch to load https://raw.githubusercontent.com/modelcontextprotocol/typescript-sdk/main/README.md
- ⚡ TypeScript Guide - TypeScript patterns and examples
For Python:
- Python SDK: Use WebFetch to load https://raw.githubusercontent.com/modelcontextprotocol/python-sdk/main/README.md
- 🐍 Python Guide - Python patterns and examples
For C#/.NET (Microsoft ecosystem): - 🔷 Microsoft MCP Patterns - C# patterns, Azure MCP architecture, command hierarchy
Understand the API: Review the service's API documentation to identify key endpoints, authentication requirements, and data models. Use web search and WebFetch as needed.
Tool Selection: Prioritize comprehensive API coverage. List endpoints to implement, starting with the most common operations.
See language-specific guides for project setup: - ⚡ TypeScript Guide - Project structure, package.json, tsconfig.json - 🐍 Python Guide - Module organization, dependencies - 🔷 Microsoft MCP Patterns - C# project structure, command hierarchy
Create shared utilities: - API client with authentication - Error handling helpers - Response formatting (JSON/Markdown) - Pagination support
For each tool:
Input Schema: - Use Zod (TypeScript) or Pydantic (Python) - Include constraints and clear descriptions - Add examples in field descriptions
Output Schema:
- Define outputSchema where possible for structured data
- Use structuredContent in tool responses (TypeScript SDK feature)
- Helps clients understand and process tool outputs
Tool Description: - Concise summary of functionality - Parameter descriptions - Return type schema
Implementation: - Async/await for I/O operations - Proper error handling with actionable messages - Support pagination where applicable - Return both text content and structured data when using modern SDKs
Annotations:
- readOnlyHint: true/false
- destructiveHint: true/false
- idempotentHint: true/false
- openWorldHint: true/false
Review for: - No duplicated code (DRY principle) - Consistent error handling - Full type coverage - Clear tool descriptions
TypeScript:
- Run npm run build to verify compilation
- Test with MCP Inspector: npx @modelcontextprotocol/inspector
Python:
- Verify syntax: python -m py_compile your_server.py
- Test with MCP Inspector
See language-specific guides for detailed testing approaches and quality checklists.
After implementing your MCP server, create comprehensive evaluations to test its effectiveness.
Load ✅ Evaluation Guide for complete evaluation guidelines.
Use evaluations to test whether LLMs can effectively use your MCP server to answer realistic, complex questions.
To create effective evaluations, follow the process outlined in the evaluation guide:
Ensure each question is: - Independent: Not dependent on other questions - Read-only: Only non-destructive operations required - Complex: Requiring multiple tool calls and deep exploration - Realistic: Based on real use cases humans would care about - Verifiable: Single, clear answer that can be verified by string comparison - Stable: Answer won't change over time
Create an XML file with this structure:
<evaluation>
<qa_pair>
<question>Find discussions about AI model launches with animal codenames. One model needed a specific safety designation that uses the format ASL-X. What number X was being determined for the model named after a spotted wild cat?</question>
<answer>3</answer>
</qa_pair>
<!-- More qa_pairs... -->
</evaluation>
Load these resources as needed during development:
https://modelcontextprotocol.io/sitemap.xml, then fetch specific pages with .md suffixhttps://raw.githubusercontent.com/modelcontextprotocol/python-sdk/main/README.mdhttps://raw.githubusercontent.com/modelcontextprotocol/typescript-sdk/main/README.md@mcp.toolQuality checklist
⚡ TypeScript Implementation Guide - Complete TypeScript guide with:
server.registerToolQuality checklist
🔷 Microsoft MCP Patterns - Complete C#/.NET guide with:
{Resource}{Operation}Command).AsRequired() / .AsOptional()Source: Microsoft · MIT · SHA-256 shown alongside the download.
License file included. A license and checksum are not a security certification. Review package instructions and scripts before running them.
microsoft-mcp-builder/SKILL.md12260 bytesmicrosoft-mcp-builder/SOURCE.txt186 bytesmicrosoft-mcp-builder/scripts/evaluation.py12579 bytesmicrosoft-mcp-builder/scripts/example_evaluation.xml1194 bytesAn adaptation record is bundled. Inspect the declared changes and archived original before use. Review adaptation and original-file hashes →
Machine-readable installation guide →Source and packaging checks recorded on 2026-10-03. These notes are not safety certification or measured task performance.
A chosen SDK/runtime; development dependencies; separate credentials for any external service.
Bundled Python helpers were syntax-checked only. Building or exposing a server requires authentication and network review. Core frontmatter was adapted by BB Skills for the existing namespace directory; unchanged original SKILL.md is archived. This does not imply client execution was tested.
Upstream commit: 84d8eaa8ae95930f55cdceb3e27196c795dab038
Runtime status: not tested by this catalog. Configure your client and test the skill in your own environment.
Records are supplied by the site administrator and bound to a specific package. They are not third-party safety certification. This page does not execute skills.
No published scenario records yet. Resource availability and download counts do not imply measured task performance.
Be the first to share your experience.
Sign in to leave a review →Build React-based email templates, preview them locally and review components, styling and localization.
Inspect documented Resend CLI operations for email, domains, templates and account administration.
Plan transactional email, templates, delivery events and account operations with Resend SDK references.
1 current outcome record · Read scope
Reference for the Claude API / Anthropic SDK — model ids, pricing, params, streaming, tool use, MCP, agents, caching, token counting, model …