zzstoatzz Claude commited on
Commit
e7cc78c
·
1 Parent(s): 4504936

Replace YouTube cards with embedded video players

Browse files

- Convert YouTube tutorial cards to embedded iframe players
- Create reusable YouTubeEmbed component in /snippets/
- Follow existing component pattern (like VersionBadge)
- Use Mintlify-compatible JSX syntax (camelCase attributes)
- Add responsive styling for better viewing experience

This improves maintainability and ensures consistent YouTube embed styling across the docs.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

docs/community/showcase.mdx CHANGED
@@ -4,6 +4,8 @@ description: 'High-quality projects and examples from the FastMCP community'
4
  icon: 'users'
5
  ---
6
 
 
 
7
  ## Featured Projects
8
 
9
  Discover exemplary MCP servers and implementations created by our community. These projects demonstrate best practices and innovative uses of FastMCP.
@@ -16,13 +18,19 @@ Discover exemplary MCP servers and implementations created by our community. The
16
 
17
  #### Video Tutorials
18
 
19
- <Card title="Build Remote MCP Servers w/ Python & FastMCP" icon="youtube" href="https://www.youtube.com/watch?v=bOYkbXP-GGo">
20
- Claude Integrations Tutorial by Greg + Code - Learn how to build remote MCP servers using Python and FastMCP.
21
- </Card>
22
 
23
- <Card title="FastMCP — the best way to build an MCP server with Python" icon="youtube" href="https://www.youtube.com/watch?v=rnljvmHorQw">
24
- Tutorial by ZazenCodes - Comprehensive guide to building MCP servers with FastMCP in Python.
25
- </Card>
 
 
 
 
 
 
 
 
26
 
27
  ### Community Examples
28
 
 
4
  icon: 'users'
5
  ---
6
 
7
+ import { YouTubeEmbed } from '/snippets/youtube-embed.mdx'
8
+
9
  ## Featured Projects
10
 
11
  Discover exemplary MCP servers and implementations created by our community. These projects demonstrate best practices and innovative uses of FastMCP.
 
18
 
19
  #### Video Tutorials
20
 
21
+ **Build Remote MCP Servers w/ Python & FastMCP** - Claude Integrations Tutorial by Greg + Code
 
 
22
 
23
+ <YouTubeEmbed
24
+ videoId="bOYkbXP-GGo"
25
+ title="Build Remote MCP Servers w/ Python & FastMCP"
26
+ />
27
+
28
+ **FastMCP — the best way to build an MCP server with Python** - Tutorial by ZazenCodes
29
+
30
+ <YouTubeEmbed
31
+ videoId="rnljvmHorQw"
32
+ title="FastMCP — the best way to build an MCP server with Python"
33
+ />
34
 
35
  ### Community Examples
36
 
docs/snippets/youtube-embed.mdx ADDED
@@ -0,0 +1,12 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ export const YouTubeEmbed = ({ videoId, title }) => {
2
+ return (
3
+ <iframe
4
+ className="w-full aspect-video rounded-md"
5
+ src={`https://www.youtube.com/embed/${videoId}`}
6
+ title={title}
7
+ frameBorder="0"
8
+ allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
9
+ allowFullScreen
10
+ />
11
+ );
12
+ };