Skip to content

Commit ba0efb8

Browse files
xplusplusaiclaude
xplusplusai
and
claude
committed
Add live demo page showcasing real-life MCP usage
Added comprehensive demo documentation at docs/demo/: - Step-by-step walkthrough of AI-assisted D365 F&O development - 7 annotated screenshots showing complete workflow - Real example: "Create External name field on VendGroup table" - Professional xplusplus.ai theme (Inter font, clean design) - Demonstrates semantic search, file access, pattern recognition - Updated README with link to demo page Demo highlights: - AI using search_fo_artifacts MCP tool iteratively - Reading standard D365 XML via fullLocalPath - Checking workspace for existing customizations - Generating complete table and form extensions - No hallucination - all based on real metadata Perfect showcase of FO Semantic MCP Server value proposition. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
1 parent 0ee6468 commit ba0efb8

File tree

10 files changed

+778
-0
lines changed

10 files changed

+778
-0
lines changed

‎README.md‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -162,6 +162,21 @@ Ask your AI assistant to search F&O artifacts, then guide it to:
162162
2. Search your workspace for custom code
163163
3. Combine insights for context-aware solutions
164164

165+
## 🎬 Live Demo
166+
167+
**See it in action!** Check out our [Real-Life Demo](docs/demo/index.html) showing how an AI agent uses the MCP server to complete a full D365 F&O customization task - from natural language request to working code.
168+
169+
**Task:** "Create a new field 'External name' on vendor group table and add it to form general tab"
170+
171+
**What you'll see:**
172+
- AI using semantic search to find D365 artifacts
173+
- Reading standard implementations via file paths
174+
- Checking workspace for existing customizations
175+
- Generating complete table and form extensions
176+
- All in a single session with proper D365 patterns
177+
178+
👉 [**View the Complete Demo**](docs/demo/index.html)
179+
165180
## 📖 What's New in v2.0
166181

167182
### Breaking Changes

‎docs/demo/images/1.png‎

77 KB
Loading

‎docs/demo/images/2.png‎

50.2 KB
Loading

‎docs/demo/images/3.png‎

66.7 KB
Loading

‎docs/demo/images/4.png‎

68.6 KB
Loading

‎docs/demo/images/5.png‎

69.5 KB
Loading

‎docs/demo/images/6.png‎

58.4 KB
Loading

‎docs/demo/images/7.png‎

104 KB
Loading

‎docs/demo/index.html‎

Lines changed: 300 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,300 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<meta name="description" content="Real-life demonstration of AI-assisted D365 F&O development using FO Semantic MCP Server">
7+
<title>FO Semantic MCP - Real-Life Demo</title>
8+
<link rel="preconnect" href="https://fonts.googleapis.com">
9+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
10+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
11+
<link rel="stylesheet" href="styles.css">
12+
</head>
13+
<body>
14+
<header>
15+
<div class="container">
16+
<h1>Real-Life Demo: AI-Assisted D365 F&O Development</h1>
17+
<p class="subtitle">Watch how an AI agent uses the FO Semantic MCP Server to complete a D365 F&O customization task</p>
18+
<nav class="breadcrumb">
19+
<a href="../../README.md">Home</a> /
20+
<a href="../GETTING_STARTED.md">Getting Started</a> /
21+
<span>Live Demo</span>
22+
</nav>
23+
</div>
24+
</header>
25+
26+
<main class="container">
27+
<section class="intro">
28+
<h2>📋 The Task</h2>
29+
<div class="task-box">
30+
<p><strong>User Request:</strong></p>
31+
<blockquote>
32+
"Create a new field 'External name' on vendor group table if it is not exist, and add it to form general tab"
33+
</blockquote>
34+
</div>
35+
36+
<div class="info-box">
37+
<h3>What You'll See:</h3>
38+
<ul>
39+
<li>✅ AI using <code>search_fo_artifacts</code> MCP tool to find standard D365 artifacts</li>
40+
<li>✅ AI reading standard XML files via <code>fullLocalPath</code></li>
41+
<li>✅ AI searching user's workspace for existing customizations</li>
42+
<li>✅ AI generating complete table and form extensions following D365 patterns</li>
43+
<li>✅ Complete implementation delivered in a single session</li>
44+
</ul>
45+
</div>
46+
</section>
47+
48+
<!-- Step 1 -->
49+
<section class="step">
50+
<div class="step-header">
51+
<span class="step-number">Step 1</span>
52+
<h3>Initial Search for VendGroup Table</h3>
53+
</div>
54+
<div class="step-content">
55+
<img src="images/1.png" alt="Step 1: Initial MCP tool call to search for VendGroup table">
56+
<div class="step-description">
57+
<h4>What's Happening:</h4>
58+
<ul>
59+
<li>AI breaks down the user request into actionable steps</li>
60+
<li>First action: Find the VendGroup table in standard D365</li>
61+
<li>Uses <code>search_fo_artifacts</code> with query: <em>"VendGroup vendor group table"</em></li>
62+
</ul>
63+
64+
<h4>Result:</h4>
65+
<p>Found 5 artifacts, including <strong>VendVendorGroupStaging</strong> table. AI recognizes this is a staging table, not the actual VendGroup table.</p>
66+
67+
<div class="highlight">
68+
<strong>🔍 Key Observation:</strong> The AI demonstrates intelligent refinement - it recognizes the initial results aren't quite right and prepares to search again.
69+
</div>
70+
</div>
71+
</div>
72+
</section>
73+
74+
<!-- Step 2 -->
75+
<section class="step">
76+
<div class="step-header">
77+
<span class="step-number">Step 2</span>
78+
<h3>Refined Search with Better Query</h3>
79+
</div>
80+
<div class="step-content">
81+
<img src="images/2.png" alt="Step 2: Refined search for actual VendGroup table">
82+
<div class="step-description">
83+
<h4>What's Happening:</h4>
84+
<ul>
85+
<li>AI recognizes staging table isn't what's needed</li>
86+
<li>Refines query to: <em>"VendGroup table vendor classification group"</em></li>
87+
<li>Uses more specific terminology to find the base table</li>
88+
</ul>
89+
90+
<h4>Result:</h4>
91+
<p>Found the actual <strong>VendGroup</strong> table with <code>fullLocalPath</code> to the XML file.</p>
92+
93+
<div class="highlight">
94+
<strong>💡 MCP Tool Value:</strong> The tool provides the exact file path to standard D365 metadata that the AI couldn't otherwise access.
95+
</div>
96+
</div>
97+
</div>
98+
</section>
99+
100+
<!-- Step 3 -->
101+
<section class="step">
102+
<div class="step-header">
103+
<span class="step-number">Step 3</span>
104+
<h3>Search for VendGroup Form</h3>
105+
</div>
106+
<div class="step-content">
107+
<img src="images/3.png" alt="Step 3: Search for VendGroup form">
108+
<div class="step-description">
109+
<h4>What's Happening:</h4>
110+
<ul>
111+
<li>AI now needs to find the VendGroup form to add the field to the General tab</li>
112+
<li>Uses <code>search_fo_artifacts</code> with query: <em>"VendGroup form vendor classification"</em></li>
113+
<li>Plans next steps: check for existing extensions, read standard implementations</li>
114+
</ul>
115+
116+
<h4>Result:</h4>
117+
<p>Found <strong>VendGroup Form</strong> artifact with full metadata and file path.</p>
118+
119+
<div class="highlight">
120+
<strong>🎯 Workflow Pattern:</strong> AI is following a systematic approach - find table, find form, check customizations, then implement.
121+
</div>
122+
</div>
123+
</div>
124+
</section>
125+
126+
<!-- Step 4 -->
127+
<section class="step">
128+
<div class="step-header">
129+
<span class="step-number">Step 4</span>
130+
<h3>Reading Standard Files & Checking Workspace</h3>
131+
</div>
132+
<div class="step-content">
133+
<img src="images/4.png" alt="Step 4: Reading F&O asset files via fullLocalPath">
134+
<div class="step-description">
135+
<h4>What's Happening:</h4>
136+
<ul>
137+
<li><strong>Critical moment:</strong> AI uses the <code>fullLocalPath</code> provided by MCP tool</li>
138+
<li>Reads actual VendGroup.xml files to understand structure</li>
139+
<li>Searches user's workspace for existing VendGroup extensions</li>
140+
<li>No existing extension found - will need to create new files</li>
141+
</ul>
142+
143+
<div class="highlight">
144+
<strong>🔑 This is the Core Value:</strong> The MCP tool bridges the gap between AI and local D365 metadata. The AI can now read the actual standard implementation instead of guessing or hallucinating.
145+
</div>
146+
</div>
147+
</div>
148+
</section>
149+
150+
<!-- Step 5 -->
151+
<section class="step">
152+
<div class="step-header">
153+
<span class="step-number">Step 5</span>
154+
<h3>Understanding Form Structure & Patterns</h3>
155+
</div>
156+
<div class="step-content">
157+
<img src="images/5.png" alt="Step 5: AI researching form structure and patterns">
158+
<div class="step-description">
159+
<h4>What's Happening:</h4>
160+
<ul>
161+
<li>AI reads CustParameters table extension to understand extension patterns</li>
162+
<li>Searches for "General tab" structure in VendGroup form</li>
163+
<li>Uses grep to find General tab naming conventions</li>
164+
<li>Reads CustTable form to understand similar implementations</li>
165+
</ul>
166+
167+
<h4>Result:</h4>
168+
<p>AI learns D365 patterns: TabGeneral naming, FastTab structure, field group organization.</p>
169+
170+
<div class="highlight">
171+
<strong>🧠 Context-Aware Development:</strong> The AI isn't just writing code - it's learning from existing patterns in both standard D365 and user's customizations.
172+
</div>
173+
</div>
174+
</div>
175+
</section>
176+
177+
<!-- Step 6 -->
178+
<section class="step">
179+
<div class="step-header">
180+
<span class="step-number">Step 6</span>
181+
<h3>Creating Extensions</h3>
182+
</div>
183+
<div class="step-content">
184+
<img src="images/6.png" alt="Step 6: AI creates table and form extensions">
185+
<div class="step-description">
186+
<h4>What's Happening:</h4>
187+
<ul>
188+
<li>AI creates <strong>VendGroup table extension</strong> with new field</li>
189+
<li>AI creates <strong>VendGroup form extension</strong> adding field to General tab</li>
190+
<li>Both files shown as "new" with line counts (+25 lines each)</li>
191+
<li>Proper XML structure following D365 conventions</li>
192+
</ul>
193+
194+
<h4>Key Details:</h4>
195+
<ul>
196+
<li>Field uses <code>Name</code> extended data type (EDT)</li>
197+
<li>Form control bound to VendGroup data source</li>
198+
<li>Placed in TabGeneral (General tab) as requested</li>
199+
</ul>
200+
</div>
201+
</div>
202+
</section>
203+
204+
<!-- Step 7 -->
205+
<section class="step">
206+
<div class="step-header">
207+
<span class="step-number">Step 7</span>
208+
<h3>Complete Summary & Next Steps</h3>
209+
</div>
210+
<div class="step-content">
211+
<img src="images/7.png" alt="Step 7: Final summary and next steps">
212+
<div class="step-description">
213+
<h4>What's Delivered:</h4>
214+
215+
<div class="summary-box">
216+
<h5>1. Table Extension</h5>
217+
<ul>
218+
<li>Added field to VendGroup table</li>
219+
<li>Field Type: String (using Name EDT)</li>
220+
<li>Label: "External name"</li>
221+
<li>Help Text: "External name for vendor group"</li>
222+
</ul>
223+
224+
<h5>2. Form Extension</h5>
225+
<ul>
226+
<li>Added field to VendGroup form</li>
227+
<li>Placed in TabGeneral (General tab)</li>
228+
<li>Bound to VendGroup data source</li>
229+
</ul>
230+
231+
<h5>3. Next Steps Provided</h5>
232+
<ol>
233+
<li>Build the model in Visual Studio</li>
234+
<li>Synchronize database to create the new field</li>
235+
<li>Test in UI (Accounts Payable > Setup > Vendor groups)</li>
236+
<li>Add to source control when verified</li>
237+
</ol>
238+
</div>
239+
240+
<div class="highlight success">
241+
<strong>✅ Task Complete:</strong> From a simple natural language request to complete, correct implementation - all in a single AI session with MCP tool assistance.
242+
</div>
243+
</div>
244+
</div>
245+
</section>
246+
247+
<!-- Conclusion -->
248+
<section class="conclusion">
249+
<h2>🎓 What This Demonstrates</h2>
250+
251+
<div class="demo-insights">
252+
<div class="insight-card">
253+
<h3>🔍 Semantic Search Works</h3>
254+
<p>The AI successfully found relevant D365 artifacts using natural language queries, even refining searches when needed.</p>
255+
</div>
256+
257+
<div class="insight-card">
258+
<h3>📁 File Access is Critical</h3>
259+
<p>The <code>fullLocalPath</code> field enabled the AI to read actual standard implementations instead of guessing structure.</p>
260+
</div>
261+
262+
<div class="insight-card">
263+
<h3>🧩 Pattern Recognition</h3>
264+
<p>AI learned from both standard D365 code and user's existing customizations to generate context-aware solutions.</p>
265+
</div>
266+
267+
<div class="insight-card">
268+
<h3>⚡ Iterative Workflow</h3>
269+
<p>The tool supported an exploratory workflow - search, read, search again, read more, implement.</p>
270+
</div>
271+
272+
<div class="insight-card">
273+
<h3>✨ Complete Implementation</h3>
274+
<p>From request to working code in minutes, with proper XML structure, naming conventions, and actionable next steps.</p>
275+
</div>
276+
277+
<div class="insight-card">
278+
<h3>🎯 No Hallucination</h3>
279+
<p>AI didn't make up field names, table structures, or form designs - it looked them up using real metadata.</p>
280+
</div>
281+
</div>
282+
</section>
283+
284+
<section class="cta">
285+
<h2>🚀 Try It Yourself</h2>
286+
<p>Ready to experience AI-assisted D365 F&O development?</p>
287+
<div class="cta-buttons">
288+
<a href="../GETTING_STARTED.md" class="btn btn-primary">Get Started Guide</a>
289+
<a href="https://github.com/xplusplusai/fo-semantic-mcp" class="btn btn-secondary">View on GitHub</a>
290+
</div>
291+
</section>
292+
</main>
293+
294+
<footer>
295+
<div class="container">
296+
<p>&copy; 2025 FO Semantic MCP Server | <a href="../../README.md">Documentation</a> | <a href="https://github.com/xplusplusai/fo-semantic-mcp/releases">Releases</a></p>
297+
</div>
298+
</footer>
299+
</body>
300+
</html>

0 commit comments

Comments
 (0)