Skip to content

Commit 586068a

Browse files
committed
docs: add screencasts demonstrating MCP server functionality in Unit 3
- Add video demonstrations for PR chaos problem and solution - Add real-time CI/CD monitoring screencast to GitHub Actions integration - Add complete automation system demonstration to Slack notification module - Update Slack notification format to use rotating_light emoji and cleaner template - Add mrkdwn support to Slack webhook implementation chore: add videos/ directory to .gitignore
1 parent e0c84da commit 586068a

File tree

5 files changed

+172
-92
lines changed

5 files changed

+172
-92
lines changed

.gitignore

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -173,4 +173,6 @@ cython_debug/
173173
# PyPI configuration file
174174
.pypirc
175175

176-
.DS_Store
176+
.DS_Store
177+
178+
videos/

projects/unit3/slack-notification/solution/server.py

Lines changed: 58 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -272,15 +272,19 @@ async def send_slack_notification(message: str) -> str:
272272
273273
Args:
274274
message: The message to send to Slack (supports Slack markdown)
275+
276+
IMPORTANT: For CI failures, use format_ci_failure_alert prompt first!
277+
IMPORTANT: For deployments, use format_ci_success_summary prompt first!
275278
"""
276279
webhook_url = os.getenv("SLACK_WEBHOOK_URL")
277280
if not webhook_url:
278281
return "Error: SLACK_WEBHOOK_URL environment variable not set"
279282

280283
try:
281-
# Prepare the payload
284+
# Prepare the payload with proper Slack formatting
282285
payload = {
283-
"text": message
286+
"text": message,
287+
"mrkdwn": True
284288
}
285289

286290
# Send POST request to Slack webhook
@@ -311,58 +315,58 @@ async def format_ci_failure_alert():
311315
"""Create a Slack alert for CI/CD failures with rich formatting."""
312316
return """Format this GitHub Actions failure as a Slack message using ONLY Slack markdown syntax:
313317
314-
❌ *CI Failed* - [Repository Name]
315-
316-
> Brief summary of what failed
318+
:rotating_light: *CI Failure Alert* :rotating_light:
317319
318-
*Details:*
319-
• Workflow: `workflow_name`
320-
• Branch: `branch_name`
321-
• Commit: `commit_hash`
320+
A CI workflow has failed:
321+
*Workflow*: workflow_name
322+
*Branch*: branch_name
323+
*Status*: Failed
324+
*View Details*: <https://github.com/test/repo/actions/runs/123|View Logs>
322325
323-
*Next Steps:*
324-
• <https://github.com/test/repo/actions/runs/123|View Action Logs>
326+
Please check the logs and address any issues.
325327
326328
CRITICAL: Use EXACT Slack link format: <https://full-url|Link Text>
327329
Examples:
328330
- CORRECT: <https://github.com/user/repo|Repository>
329331
- WRONG: [Repository](https://github.com/user/repo)
330332
- WRONG: https://github.com/user/repo
331333
332-
Other Slack formats:
334+
Slack formatting rules:
333335
- *text* for bold (NOT **text**)
334336
- `text` for code
335337
- > text for quotes
336-
- • for bullets"""
338+
- Use simple bullet format without special characters
339+
- :emoji_name: for emojis"""
337340

338341

339342
@mcp.prompt()
340343
async def format_ci_success_summary():
341344
"""Create a Slack message celebrating successful deployments."""
342345
return """Format this successful GitHub Actions run as a Slack message using ONLY Slack markdown syntax:
343346
344-
*Deployment Successful* - [Repository Name]
347+
:white_check_mark: *Deployment Successful* :white_check_mark:
345348
346-
> Brief summary of what was deployed
349+
Deployment completed successfully for [Repository Name]
347350
348351
*Changes:*
349-
Key feature or fix 1
350-
Key feature or fix 2
352+
- Key feature or fix 1
353+
- Key feature or fix 2
351354
352355
*Links:*
353-
<https://github.com/user/repo|View Changes>
356+
<https://github.com/user/repo|View Changes>
354357
355358
CRITICAL: Use EXACT Slack link format: <https://full-url|Link Text>
356359
Examples:
357360
- CORRECT: <https://github.com/user/repo|Repository>
358361
- WRONG: [Repository](https://github.com/user/repo)
359362
- WRONG: https://github.com/user/repo
360363
361-
Other Slack formats:
364+
Slack formatting rules:
362365
- *text* for bold (NOT **text**)
363366
- `text` for code
364367
- > text for quotes
365-
- • for bullets"""
368+
- Use simple bullet format with - or *
369+
- :emoji_name: for emojis"""
366370

367371

368372
# ===== Prompts from Module 2 (Complete) =====
@@ -379,11 +383,11 @@ async def analyze_ci_results():
379383
380384
Format your response as:
381385
## CI/CD Status Summary
382-
- **Overall Health**: [Good/Warning/Critical]
383-
- **Failed Workflows**: [List any failures with links]
384-
- **Successful Workflows**: [List recent successes]
385-
- **Recommendations**: [Specific actions to take]
386-
- **Trends**: [Any patterns you notice]"""
386+
- *Overall Health*: [Good/Warning/Critical]
387+
- *Failed Workflows*: [List any failures with links]
388+
- *Successful Workflows*: [List recent successes]
389+
- *Recommendations*: [Specific actions to take]
390+
- *Trends*: [Any patterns you notice]"""
387391

388392

389393
@mcp.prompt()
@@ -397,14 +401,14 @@ async def create_deployment_summary():
397401
398402
Format as a concise message suitable for Slack:
399403
400-
🚀 **Deployment Update**
401-
- **Status**: [✅ Success / ❌ Failed / ⏳ In Progress]
402-
- **Environment**: [Production/Staging/Dev]
403-
- **Version/Commit**: [If available from workflow data]
404-
- **Duration**: [If available]
405-
- **Key Changes**: [Brief summary if available]
406-
- **Issues**: [Any problems encountered]
407-
- **Next Steps**: [Required actions if failed]
404+
🚀 *Deployment Update*
405+
- *Status*: [✅ Success / ❌ Failed / ⏳ In Progress]
406+
- *Environment*: [Production/Staging/Dev]
407+
- *Version/Commit*: [If available from workflow data]
408+
- *Duration*: [If available]
409+
- *Key Changes*: [Brief summary if available]
410+
- *Issues*: [Any problems encountered]
411+
- *Next Steps*: [Required actions if failed]
408412
409413
Keep it brief but informative for team awareness."""
410414

@@ -424,21 +428,21 @@ async def generate_pr_status_report():
424428
## 📋 PR Status Report
425429
426430
### 📝 Code Changes
427-
- **Files Modified**: [Count by type - .py, .js, etc.]
428-
- **Change Type**: [Feature/Bug/Refactor/etc.]
429-
- **Impact Assessment**: [High/Medium/Low with reasoning]
430-
- **Key Changes**: [Bullet points of main modifications]
431+
- *Files Modified*: [Count by type - .py, .js, etc.]
432+
- *Change Type*: [Feature/Bug/Refactor/etc.]
433+
- *Impact Assessment*: [High/Medium/Low with reasoning]
434+
- *Key Changes*: [Bullet points of main modifications]
431435
432436
### 🔄 CI/CD Status
433-
- **All Checks**: [✅ Passing / ❌ Failing / ⏳ Running]
434-
- **Test Results**: [Pass rate, failed tests if any]
435-
- **Build Status**: [Success/Failed with details]
436-
- **Code Quality**: [Linting, coverage if available]
437+
- *All Checks*: [✅ Passing / ❌ Failing / ⏳ Running]
438+
- *Test Results*: [Pass rate, failed tests if any]
439+
- *Build Status*: [Success/Failed with details]
440+
- *Code Quality*: [Linting, coverage if available]
437441
438442
### 📌 Recommendations
439-
- **PR Template**: [Suggested template and why]
440-
- **Next Steps**: [What needs to happen before merge]
441-
- **Reviewers**: [Suggested reviewers based on files changed]
443+
- *PR Template*: [Suggested template and why]
444+
- *Next Steps*: [What needs to happen before merge]
445+
- *Reviewers*: [Suggested reviewers based on files changed]
442446
443447
### ⚠️ Risks & Considerations
444448
- [Any deployment risks]
@@ -461,20 +465,20 @@ async def troubleshoot_workflow_failure():
461465
## 🔧 Workflow Troubleshooting Guide
462466
463467
### ❌ Failed Workflow Details
464-
- **Workflow Name**: [Name of failing workflow]
465-
- **Failure Type**: [Test/Build/Deploy/Lint]
466-
- **First Failed**: [When did it start failing]
467-
- **Failure Rate**: [Intermittent or consistent]
468+
- *Workflow Name*: [Name of failing workflow]
469+
- *Failure Type*: [Test/Build/Deploy/Lint]
470+
- *First Failed*: [When did it start failing]
471+
- *Failure Rate*: [Intermittent or consistent]
468472
469473
### 🔍 Diagnostic Information
470-
- **Error Patterns**: [Common error messages or symptoms]
471-
- **Recent Changes**: [What changed before failures started]
472-
- **Dependencies**: [External services or resources involved]
474+
- *Error Patterns*: [Common error messages or symptoms]
475+
- *Recent Changes*: [What changed before failures started]
476+
- *Dependencies*: [External services or resources involved]
473477
474478
### 💡 Possible Causes (ordered by likelihood)
475-
1. **[Most Likely]**: [Description and why]
476-
2. **[Likely]**: [Description and why]
477-
3. **[Possible]**: [Description and why]
479+
1. *[Most Likely]*: [Description and why]
480+
2. *[Likely]*: [Description and why]
481+
3. *[Possible]*: [Description and why]
478482
479483
### ✅ Suggested Fixes
480484
**Immediate Actions:**

units/en/unit3/build-mcp-server.mdx

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,49 @@ The team knows they need better PR descriptions, but everyone's too busy shippin
1515

1616
**Your mission**: Build an intelligent PR Agent that analyzes code changes and suggests helpful descriptions automatically.
1717

18+
### Screencast: The PR Problem in Action 😬
19+
20+
<video controls>
21+
<source src="https://huggingface.co/datasets/mcp-course/videos/resolve/main/unit3/pr-chaos-at-cc-studios-small.mp4" type="video/mp4" />
22+
Your browser does not support the video tag.
23+
</video>
24+
25+
**What You'll See**: A real PR at CodeCraft Studios titled "various improvements" and the description simply says "Fixed some stuff and made updates". Classic, right?
26+
27+
**The Confusion**: Watch as teammates struggle:
28+
- **Sarah** (3 hours ago): "What was fixed? I see changes to the User model but can't tell if this is addressing a bug or adding features"
29+
- **Jamie** (3 hours ago): "There are 8 files across 4 services... are these changes related? What should I focus on during review?"
30+
31+
**The Pain Point**: The screencast shows the actual diff—8 files scattered across multiple services with zero context. Reviewers have to piece together the story themselves, wasting precious time and possibly missing critical issues.
32+
33+
**Why This Matters**: This is exactly the PR chaos your MCP server will solve! By the end of this module, you'll turn these cryptic PRs into clear, actionable descriptions that make everyone's life easier.
34+
1835
## What You'll Build
1936

2037
In this first module, you'll create the foundation of CodeCraft Studios' automation system: an MCP server that transforms how the team writes pull requests. This module focuses on core MCP concepts that you'll build upon in Modules 2 and 3.
2138

39+
### Screencast: Your PR Agent Saves the Day! 🚀
40+
41+
<video controls>
42+
<source src="https://huggingface.co/datasets/mcp-course/videos/resolve/main/unit3/better-prs-at-cc-studios.mp4" type="video/mp4" />
43+
Your browser does not support the video tag.
44+
</video>
45+
46+
**The Solution in Action**: Watch how your MCP server will transform PR chaos into clarity:
47+
1. **`analyze_file_changes`** - Grabs all the changes (453 lines across 8 files!)
48+
2. **`get_pr_templates`** - Shows Claude the 7 templates to choose from
49+
3. **`suggest_template`** - Claude picks "Feature" (smart choice!)
50+
51+
**What You'll See**: Claude doesn't just pick a template—it:
52+
- Writes a clear summary of what actually changed
53+
- Spots security issues (yikes, unhashed passwords!)
54+
- Creates a nice to-do list for follow-up work
55+
- Even prioritizes what needs fixing first
56+
57+
**The "Wow" Moment** ✨: In just seconds, your MCP server helps Claude transform the same branch into a PR that actually explains what's going on. No more confused reviewers, no more "what does this do?" comments.
58+
59+
**This is what you'll build**: A tool that turns PR dread into PR delight—let's get started!
60+
2261
## What You Will Learn
2362

2463
In this foundational module, you'll master:

units/en/unit3/github-actions-integration.mdx

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,14 +18,33 @@ The team realizes they need real-time visibility into their CI/CD pipeline, but
1818

1919
This module bridges the gap between static file analysis (Module 1) and dynamic team notifications (Module 3). You'll add real-time capabilities that transform your PR Agent into a comprehensive development monitoring system.
2020

21-
## What You'll Build
22-
2321
Building on the foundation you created in Module 1, you'll add:
2422
- **Webhook server** to receive GitHub Actions events
2523
- **New tools** for monitoring CI/CD status
2624
- **MCP Prompts** that provide consistent workflow patterns
2725
- **Real-time integration** with your GitHub repository
2826

27+
### Screencast: Real-Time CI/CD Monitoring in Action! 🎯
28+
29+
<video controls>
30+
<source src="https://huggingface.co/datasets/mcp-course/videos/resolve/main/unit3/github-actions-integration-compressed.mp4" type="video/mp4" />
31+
Your browser does not support the video tag.
32+
</video>
33+
34+
**The Setup**: Watch how CodeCraft Studios' new system catches failures before they reach production:
35+
1. **GitHub Webhooks** - See the actual webhook configuration that sends events to your server
36+
2. **Failed Tests** - Those red X's that used to go unnoticed? Not anymore!
37+
3. **Local Development** - The webhook server and Cloudflare tunnel working together
38+
39+
**MCP Magic in Real-Time**: Claude responds to three key requests:
40+
- **"What GitHub Actions events have we received?"** - Claude uses your new tools to check recent activity
41+
- **"Analyze CI Results"** - Watch Claude dig into test failures and provide actionable insights
42+
- **"Create Deployment Summary"** - See how MCP Prompts guide Claude to create team-friendly updates
43+
44+
**The Silent Failures No More** 🚨: Remember that critical bug from Tuesday's failed test? With this system, Claude would have caught it immediately. The screencast shows exactly how your MCP server turns GitHub's raw webhook data into clear, actionable alerts.
45+
46+
**What Makes This Special**: Your Module 1 PR Agent was static—it analyzed code when asked. This Module 2 enhancement is dynamic—it watches your CI/CD pipeline 24/7 and helps Claude provide real-time insights. No more Friday afternoon surprises!
47+
2948
## Learning Objectives
3049

3150
By the end of this module, you'll understand:

0 commit comments

Comments
 (0)