Upload 10 files
Browse files- architecture.html +15 -0
- images/mcp_architecture_diagram.svg +82 -0
architecture.html
CHANGED
@@ -9,6 +9,15 @@
|
|
9 |
<link rel="preconnect" href="https://fonts.googleapis.com">
|
10 |
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
11 |
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
12 |
</head>
|
13 |
<body>
|
14 |
<header>
|
@@ -41,6 +50,12 @@
|
|
41 |
<p>
|
42 |
The Model Context Protocol (MCP) follows a client-server architecture that enables AI models to connect with external data sources and tools. This architecture consists of two main components:
|
43 |
</p>
|
|
|
|
|
|
|
|
|
|
|
|
|
44 |
<div class="two-column">
|
45 |
<div>
|
46 |
<h3>MCP Clients</h3>
|
|
|
9 |
<link rel="preconnect" href="https://fonts.googleapis.com">
|
10 |
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
11 |
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
12 |
+
<style>
|
13 |
+
.architecture-diagram {
|
14 |
+
width: 100%;
|
15 |
+
max-width: 800px;
|
16 |
+
margin: 2rem auto;
|
17 |
+
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
18 |
+
border-radius: 8px;
|
19 |
+
}
|
20 |
+
</style>
|
21 |
</head>
|
22 |
<body>
|
23 |
<header>
|
|
|
50 |
<p>
|
51 |
The Model Context Protocol (MCP) follows a client-server architecture that enables AI models to connect with external data sources and tools. This architecture consists of two main components:
|
52 |
</p>
|
53 |
+
|
54 |
+
<!-- Architecture Diagram -->
|
55 |
+
<div class="architecture-diagram">
|
56 |
+
<img src="images/mcp_architecture_diagram.svg" alt="MCP Architecture Diagram showing clients, servers, and transport layer interactions" width="800" height="600">
|
57 |
+
</div>
|
58 |
+
|
59 |
<div class="two-column">
|
60 |
<div>
|
61 |
<h3>MCP Clients</h3>
|
images/mcp_architecture_diagram.svg
ADDED
|