Skip to content

Commit f6ee5d5

Browse files
antonpk1antonpk1
authored
Merge pull request #286 from modelcontextprotocol/ochafik/readme-mcp-config
docs: add MCP client configuration to READMEs
2 parents cac214f + 864bb6d commit f6ee5d5

File tree

22 files changed

+686
-27
lines changed

22 files changed

+686
-27
lines changed

‎README.md‎

Lines changed: 225 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,231 @@ Or edit your `package.json` manually:
7979

8080
The [`examples/`](https://github.com/modelcontextprotocol/ext-apps/tree/main/examples) directory contains additional demo apps showcasing real-world use cases.
8181

82-
To run all examples:
82+
<details>
83+
<summary>MCP client configuration for all examples</summary>
84+
85+
Add to your MCP client configuration (stdio transport):
86+
87+
```json
88+
{
89+
"mcpServers": {
90+
"basic-react": {
91+
"command": "npx",
92+
"args": [
93+
"-y",
94+
"--silent",
95+
"--registry=https://registry.npmjs.org/",
96+
"@modelcontextprotocol/server-basic-react",
97+
"--stdio"
98+
]
99+
},
100+
"basic-vanillajs": {
101+
"command": "npx",
102+
"args": [
103+
"-y",
104+
"--silent",
105+
"--registry=https://registry.npmjs.org/",
106+
"@modelcontextprotocol/server-basic-vanillajs",
107+
"--stdio"
108+
]
109+
},
110+
"basic-vue": {
111+
"command": "npx",
112+
"args": [
113+
"-y",
114+
"--silent",
115+
"--registry=https://registry.npmjs.org/",
116+
"@modelcontextprotocol/server-basic-vue",
117+
"--stdio"
118+
]
119+
},
120+
"basic-svelte": {
121+
"command": "npx",
122+
"args": [
123+
"-y",
124+
"--silent",
125+
"--registry=https://registry.npmjs.org/",
126+
"@modelcontextprotocol/server-basic-svelte",
127+
"--stdio"
128+
]
129+
},
130+
"basic-preact": {
131+
"command": "npx",
132+
"args": [
133+
"-y",
134+
"--silent",
135+
"--registry=https://registry.npmjs.org/",
136+
"@modelcontextprotocol/server-basic-preact",
137+
"--stdio"
138+
]
139+
},
140+
"basic-solid": {
141+
"command": "npx",
142+
"args": [
143+
"-y",
144+
"--silent",
145+
"--registry=https://registry.npmjs.org/",
146+
"@modelcontextprotocol/server-basic-solid",
147+
"--stdio"
148+
]
149+
},
150+
"budget-allocator": {
151+
"command": "npx",
152+
"args": [
153+
"-y",
154+
"--silent",
155+
"--registry=https://registry.npmjs.org/",
156+
"@modelcontextprotocol/server-budget-allocator",
157+
"--stdio"
158+
]
159+
},
160+
"cohort-heatmap": {
161+
"command": "npx",
162+
"args": [
163+
"-y",
164+
"--silent",
165+
"--registry=https://registry.npmjs.org/",
166+
"@modelcontextprotocol/server-cohort-heatmap",
167+
"--stdio"
168+
]
169+
},
170+
"customer-segmentation": {
171+
"command": "npx",
172+
"args": [
173+
"-y",
174+
"--silent",
175+
"--registry=https://registry.npmjs.org/",
176+
"@modelcontextprotocol/server-customer-segmentation",
177+
"--stdio"
178+
]
179+
},
180+
"map": {
181+
"command": "npx",
182+
"args": [
183+
"-y",
184+
"--silent",
185+
"--registry=https://registry.npmjs.org/",
186+
"@modelcontextprotocol/server-map",
187+
"--stdio"
188+
]
189+
},
190+
"pdf": {
191+
"command": "npx",
192+
"args": [
193+
"-y",
194+
"--silent",
195+
"--registry=https://registry.npmjs.org/",
196+
"@modelcontextprotocol/server-pdf",
197+
"--stdio"
198+
]
199+
},
200+
"scenario-modeler": {
201+
"command": "npx",
202+
"args": [
203+
"-y",
204+
"--silent",
205+
"--registry=https://registry.npmjs.org/",
206+
"@modelcontextprotocol/server-scenario-modeler",
207+
"--stdio"
208+
]
209+
},
210+
"shadertoy": {
211+
"command": "npx",
212+
"args": [
213+
"-y",
214+
"--silent",
215+
"--registry=https://registry.npmjs.org/",
216+
"@modelcontextprotocol/server-shadertoy",
217+
"--stdio"
218+
]
219+
},
220+
"sheet-music": {
221+
"command": "npx",
222+
"args": [
223+
"-y",
224+
"--silent",
225+
"--registry=https://registry.npmjs.org/",
226+
"@modelcontextprotocol/server-sheet-music",
227+
"--stdio"
228+
]
229+
},
230+
"system-monitor": {
231+
"command": "npx",
232+
"args": [
233+
"-y",
234+
"--silent",
235+
"--registry=https://registry.npmjs.org/",
236+
"@modelcontextprotocol/server-system-monitor",
237+
"--stdio"
238+
]
239+
},
240+
"threejs": {
241+
"command": "npx",
242+
"args": [
243+
"-y",
244+
"--silent",
245+
"--registry=https://registry.npmjs.org/",
246+
"@modelcontextprotocol/server-threejs",
247+
"--stdio"
248+
]
249+
},
250+
"transcript": {
251+
"command": "npx",
252+
"args": [
253+
"-y",
254+
"--silent",
255+
"--registry=https://registry.npmjs.org/",
256+
"@modelcontextprotocol/server-transcript",
257+
"--stdio"
258+
]
259+
},
260+
"video-resource": {
261+
"command": "npx",
262+
"args": [
263+
"-y",
264+
"--silent",
265+
"--registry=https://registry.npmjs.org/",
266+
"@modelcontextprotocol/server-video-resource",
267+
"--stdio"
268+
]
269+
},
270+
"wiki-explorer": {
271+
"command": "npx",
272+
"args": [
273+
"-y",
274+
"--silent",
275+
"--registry=https://registry.npmjs.org/",
276+
"@modelcontextprotocol/server-wiki-explorer",
277+
"--stdio"
278+
]
279+
},
280+
"qr": {
281+
"command": "uv",
282+
"args": [
283+
"run",
284+
"/path/to/ext-apps/examples/qr-server/server.py",
285+
"--stdio"
286+
]
287+
},
288+
"say": {
289+
"command": "uv",
290+
"args": [
291+
"run",
292+
"--default-index",
293+
"https://pypi.org/simple",
294+
"https://raw.githubusercontent.com/modelcontextprotocol/ext-apps/refs/heads/main/examples/say-server/server.py",
295+
"--stdio"
296+
]
297+
}
298+
}
299+
}
300+
```
301+
302+
> **Note:** The `qr` server requires cloning the repository first. See [qr-server README](examples/qr-server) for details.
303+
304+
</details>
305+
306+
To run all examples locally in dev mode:
83307

84308
```bash
85309
npm install

‎examples/basic-server-preact/README.md‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,27 @@ An MCP App example with a Preact UI.
55
> [!TIP]
66
> Looking for a vanilla JavaScript example? See [`basic-server-vanillajs`](https://github.com/modelcontextprotocol/ext-apps/tree/main/examples/basic-server-vanillajs)!
77
8+
## MCP Client Configuration
9+
10+
Add to your MCP client configuration (stdio transport):
11+
12+
```json
13+
{
14+
"mcpServers": {
15+
"basic-preact": {
16+
"command": "npx",
17+
"args": [
18+
"-y",
19+
"--silent",
20+
"--registry=https://registry.npmjs.org/",
21+
"@modelcontextprotocol/server-basic-preact",
22+
"--stdio"
23+
]
24+
}
25+
}
26+
}
27+
```
28+
829
## Overview
930

1031
- Tool registration with a linked UI resource

‎examples/basic-server-react/README.md‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,27 @@ An MCP App example with a React UI.
77
> [!TIP]
88
> Looking for a vanilla JavaScript example? See [`basic-server-vanillajs`](https://github.com/modelcontextprotocol/ext-apps/tree/main/examples/basic-server-vanillajs)!
99
10+
## MCP Client Configuration
11+
12+
Add to your MCP client configuration (stdio transport):
13+
14+
```json
15+
{
16+
"mcpServers": {
17+
"basic-react": {
18+
"command": "npx",
19+
"args": [
20+
"-y",
21+
"--silent",
22+
"--registry=https://registry.npmjs.org/",
23+
"@modelcontextprotocol/server-basic-react",
24+
"--stdio"
25+
]
26+
}
27+
}
28+
}
29+
```
30+
1031
## Overview
1132

1233
- Tool registration with a linked UI resource

‎examples/basic-server-solid/README.md‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,27 @@ An MCP App example with a Solid UI.
55
> [!TIP]
66
> Looking for a vanilla JavaScript example? See [`basic-server-vanillajs`](https://github.com/modelcontextprotocol/ext-apps/tree/main/examples/basic-server-vanillajs)!
77
8+
## MCP Client Configuration
9+
10+
Add to your MCP client configuration (stdio transport):
11+
12+
```json
13+
{
14+
"mcpServers": {
15+
"basic-solid": {
16+
"command": "npx",
17+
"args": [
18+
"-y",
19+
"--silent",
20+
"--registry=https://registry.npmjs.org/",
21+
"@modelcontextprotocol/server-basic-solid",
22+
"--stdio"
23+
]
24+
}
25+
}
26+
}
27+
```
28+
829
## Overview
930

1031
- Tool registration with a linked UI resource

‎examples/basic-server-svelte/README.md‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,27 @@ An MCP App example with a Svelte 5 UI using runes for reactivity.
55
> [!TIP]
66
> Looking for a vanilla JavaScript example? See [`basic-server-vanillajs`](https://github.com/modelcontextprotocol/ext-apps/tree/main/examples/basic-server-vanillajs)!
77
8+
## MCP Client Configuration
9+
10+
Add to your MCP client configuration (stdio transport):
11+
12+
```json
13+
{
14+
"mcpServers": {
15+
"basic-svelte": {
16+
"command": "npx",
17+
"args": [
18+
"-y",
19+
"--silent",
20+
"--registry=https://registry.npmjs.org/",
21+
"@modelcontextprotocol/server-basic-svelte",
22+
"--stdio"
23+
]
24+
}
25+
}
26+
}
27+
```
28+
829
## Overview
930

1031
- Tool registration with a linked UI resource

‎examples/basic-server-vanillajs/README.md‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,27 @@ An MCP App example with a vanilla JavaScript UI (no framework).
55
> [!TIP]
66
> Looking for a React-based example? See [`basic-server-react`](https://github.com/modelcontextprotocol/ext-apps/tree/main/examples/basic-server-react)!
77
8+
## MCP Client Configuration
9+
10+
Add to your MCP client configuration (stdio transport):
11+
12+
```json
13+
{
14+
"mcpServers": {
15+
"basic-vanillajs": {
16+
"command": "npx",
17+
"args": [
18+
"-y",
19+
"--silent",
20+
"--registry=https://registry.npmjs.org/",
21+
"@modelcontextprotocol/server-basic-vanillajs",
22+
"--stdio"
23+
]
24+
}
25+
}
26+
}
27+
```
28+
829
## Overview
930

1031
- Tool registration with a linked UI resource

0 commit comments

Comments
 (0)