สร้างแอปโมเดลเชิงความหมายด้วย GitHub Copilot

ใช้สูตรนี้เพื่อสร้างแอปวิเคราะห์ที่เชื่อมต่อกับโมเดลเชิงความหมายด้วยโหมด เอเจนต์ Copilot ของ GitHub Copilot เป็นโครงร่างสําหรับเทมเพลตแอปข้อมูล เพิ่มตัวเชื่อมต่อโมเดลเชิงความหมายของ Fabric สร้างคําสั่งค้นหาและการแสดงผล DAX และตรวจสอบความถูกต้องของแอป

เทมเพลตแอปข้อมูลนี้ให้การรับรองความถูกต้อง Fabric, คําแนะนําการสร้าง DAX, ส่วนประกอบภาพ และการตรวจสอบเบราว์เซอร์ ตัวเชื่อมต่อนี้ให้การเข้าถึงโมเดลเชิงความหมายที่ได้รับมอบหมายผ่านไคลเอนต์ Fabric Apps สําหรับข้อมูลเพิ่มเติม ดูสร้างแอปที่เชื่อมต่อกับแบบจําลองความหมาย

ในบทช่วยสอนนี้ คุณ:

  • เตรียม GitHub Copilot สําหรับการพัฒนาที่ขับเคลื่อนด้วยเอเจนต์
  • ถาม Copilot ช่วยสร้างเทมเพลตแอปข้อมูลแทน
  • เชื่อมต่อแอปกับโมเดลเชิงความหมาย
  • สร้างตัวสํารวจประสิทธิภาพการขายแบบอินเทอร์แอคทีฟ
  • ตรวจสอบและตรวจสอบการเปลี่ยนแปลงที่สร้างขึ้น
  • ปรับใช้แอปไปยัง Fabric
  • ตรวจสอบการติดตั้งและเปิดแอป

ข้อกําหนดเบื้องต้น

  • Node.js 20 ปีขึ้นไป
  • <ค 0>Visual Studio Code
  • GitHub Copilot ใน Visual Studio Code พร้อมโหมดเอเจนต์ให้ใช้งาน
  • บัญชี GitHub ที่สามารถเข้าถึง GitHub Copilot ได้
  • บัญชี บัญชี Microsoft ที่มีสิทธิ์เข้าถึง Fabric
  • พื้นที่ทํางาน Fabric ที่คุณมีสิทธิ์ ผู้สนับสนุน สมาชิก หรือผู้ดูแลระบบ
  • เปิดใช้งานงาน Fabric Apps สําหรับ tenant ของคุณ
  • เปิดใช้งานการตั้งค่าผู้เช่า Semantic Model Execute Queries REST API
  • สิทธิ์ในการสร้างและอ่านบนโมเดลเชิงความหมายที่โฮสต์บนความจุ Fabric หรือ Power BI
  • รหัสพื้นที่ทํางานและรหัสไอเท็มสําหรับโมเดลเชิงความหมาย

Note

Copilot ขออนุมัติก่อนจะรันคําสั่งเทอร์มินัล คุณต้องลงชื่อเข้าใช้เบราว์เซอร์แบบโต้ตอบเมื่อ Rayfin CLI ร้องขอ

เปิดโหมด เอเจนต์ Copilot บน GitHub

  1. เปิด Visual Studio Code
  2. เปิดโฟลเดอร์หลักที่คุณต้องการให้ Copilot สร้างโปรเจกต์
  3. เปิดแชท
  4. เลือกโหมด Agent
  5. ยืนยันว่าเอเจนต์มีสิทธิ์เข้าถึงเทอร์มินัลและพื้นที่ทํางาน

อย่าเปิดโฟลเดอร์ที่มีไฟล์ที่ไม่เกี่ยวข้องซึ่งคุณไม่ต้องการให้ Copilot ตรวจสอบหรือแก้ไข

โครงสร้างสําหรับแอปข้อมูล

คัดลอกพรอมต์ต่อไปนี้ไปยัง Copilot Chat:

Set up a new Fabric data app for me, end to end.

Create the project in a folder named sales-insights. Before changing code, read any
copilot-instructions.md files and agent guidance included in the scaffolded project.

Do the work yourself instead of only printing instructions:
1. Run `npm create @microsoft/rayfin@latest -- "sales-insights" --template dataapp --workspace <workspace-name>`.
2. In the scaffolded project, run `npx rayfin connector add --type fabric-semanticmodel --workspace-id <workspace-id> --item-id <semantic-model-item-id> --name salesModel --operations executeQuery`.
3. Run the version-matched npm install command printed by the connector command.
4. Open and inspect the scaffolded project. Explain the data app template's DAX query,
   visualization, data grid, theme, and browser-validation patterns.
5. Configure the template to use ConnectorsRayfinClient, the generated salesModel
   schema, and the fabricSemanticModel() runtime. Don't retain or add a direct
   Execute Queries REST API client.
6. If authentication is required, run `npx rayfin login` and pause while I complete
   sign-in.
7. Run the existing build and report any errors.
8. Summarize the scaffolded app and wait for my semantic model requirements.

Ask before making a destructive change or using a force option.

แทนที่ <workspace-name>, <workspace-id>, และ <semantic-model-item-id> ด้วยค่าสําหรับพื้นที่ทํางาน Fabric และโมเดลเชิงความหมายของคุณ อนุมัติคําสั่งเมื่อ Copilot รัน และดําเนินการเข้าสู่ระบบ Rayfin ให้เสร็จสมบูรณ์เมื่อมีการแจ้ง

ถาม Copilot ช่วยสร้างแอปของคุณ

อธิบายกลุ่มเป้าหมายของแอป คําถาม การโต้ตอบ และการแสดงผลของแอป salesModelตัวเชื่อมต่อจะระบุโมเดลเชิงความหมายไว้แล้ว

ใช้พรอมต์ต่อไปนี้เป็นสูตรเริ่มต้นสําหรับตัวสํารวจประสิทธิภาพการขาย ปรับข้อกําหนดทางธุรกิจให้เหมาะสมกับฟิลด์ที่มีอยู่ในโมเดลของคุณ

Use the existing salesModel connector to build a sales performance explorer for
sales managers.

Requirements:
- Inspect the generated connector schema and semantic model metadata before editing.
  Use actual table, measure, and column names instead of guessing them.
- Show KPI callouts for the model's revenue, order volume, and margin measures when
  those measures are available.
- Add a time-series chart for sales performance, a bar chart that compares a useful
  business category, and a detailed data grid.
- Add date and category filters, and use the template's cross-highlighting behavior.
- Use the template's DAX generation patterns and visual primitives. Minimize the
  number of DAX queries and don't duplicate queries for the same data.
- Submit DAX with client.connectors.salesModel.executeQuery(), check the returned
  status, and handle success and error results.
- Apply the semantic model's format strings consistently to cards, charts, tooltips,
  and the data grid.
- Include loading, empty, and error states.
- Don't add mock data, embed credentials, or implement a separate authentication flow.
- Preserve the template's Fabric authentication and the semantic model connector.
- Don't add dependencies unless they're necessary.

Before editing, inspect the relevant files and give me a short implementation plan.
Ask me to clarify any model fields that are ambiguous. Then make the changes, run
the existing build, and use the template's browser validation workflow to check the
layout at desktop and mobile sizes. Explain any errors you fix.

ตรวจสอบแผนของ Copilot ก่อนแก้ไขโครงการ หากแผนไม่ตรงกับความต้องการของคุณ ให้แก้ไขในแชทก่อนอนุมัติการใช้งาน

ตรวจสอบการเปลี่ยนแปลงที่สร้างขึ้น

หลังจาก Copilot เสร็จสิ้น ให้ขอให้มันตรวจสอบผลงานของตน:

Review the changes you made against every requirement in my previous prompt.

Check for:
- DAX queries that reference fields that aren't in the semantic model.
- Duplicate or unnecessary DAX queries.
- Hard-coded sample data, credentials, access tokens, or a second sign-in flow.
- Formatting that ignores the semantic model's format strings.
- Charts, filters, cross-highlighting, or data grid interactions that don't work.
- Missing loading, empty, or error states.
- TypeScript or build errors.

Fix confirmed issues, run the existing build and browser validation, and summarize
the final behavior.

ตรวจสอบความแตกต่างของซอร์สโค้ดใน Visual Studio Code ให้ความสนใจเป็นพิเศษกับ:

  • salesModelการกําหนดค่าตัวเชื่อมต่อ, สคีมาที่สร้างขึ้น และคําสั่งค้นหา DAX
  • การกําหนดค่าบริการใน rayfin/rayfin.yml.
  • การพึ่งพาใหม่ใน package.json.
  • การเปลี่ยนแปลงการตรวจสอบสิทธิ์หรือการเรียก REST โดยตรงที่ข้ามตัวเชื่อมต่อ
  • ความลับหรือข้อมูลรับรองที่คุณต้องไม่เปิดเผย

ปรับใช้และตรวจสอบการเชื่อมต่อโมเดลเชิงความหมาย

ถาม Copilot ให้ปรับใช้แอปและตรวจสอบการเชื่อมต่อ:

Deploy the app with `npx rayfin up`, then run `npx rayfin up status` and confirm
that the deployment is healthy. Give me the Fabric portal link from the command
output.

Don't add mock data if a semantic model query fails. Check the workspace and model
IDs in the connector configuration, the Semantic Model Execute Queries REST API
tenant setting, my Build and Read permissions, the DAX query, the connector error
result, and the browser console. Report the exact failure and the corrective action.

เปิดแอปจากพอร์ทัล Fabric เพื่อทดสอบคําค้นโมเดลเชิงความหมายแบบสด

ตรวจสอบความถูกต้องของแอป

ถาม Copilot ให้รันการตรวจสอบที่มีอยู่ของโปรเจกต์:

Validate the app without adding new tools.

1. Run the existing build and type-check commands from package.json.
2. Run the template's browser validation at desktop and mobile sizes.
3. Check for clipped charts, unreadable labels, empty visuals, and console errors.
4. Tell me which semantic model queries and user interactions I must verify in the
    Fabric portal.
5. Fix confirmed build, type, or layout errors, and rerun the failed check.

ในพอร์ทัล Fabric ให้ตรวจสอบเกณฑ์การยอมรับที่คุณให้ Copilot ทดสอบการตรวจสอบสิทธิ์ ตัวกรอง การไฮไลท์ข้าม การจัดรูปแบบข้อมูล สถานะว่าง การจัดการข้อผิดพลาด และผลลัพธ์ของแต่ละภาพ

ปรับใช้แอปที่เสร็จสมบูรณ์

หลังจากตรวจสอบการเปลี่ยนแปลงและทดสอบแอปแล้ว ให้ขอให้ Copilot ปรับใช้แอป:

Deploy the reviewed app to Fabric.

1. Show me the current git diff and summarize what will be deployed.
2. Run `npx rayfin up`.
3. Run `npx rayfin up status`.
4. Confirm that the deployment is healthy.
5. Give me the hosted app URL and Fabric portal link from the command output.

Stop and explain the issue if deployment or verification fails.

คําสั่งเดียวกัน npx rayfin up นี้จะอัปเดตการติดตั้งที่มีอยู่เมื่อคุณพัฒนาแอปต่อไป

ดําเนินการวนซ้ําด้วย Copilot

ใช้คําสั่งที่เน้นเฉพาะสําหรับการเปลี่ยนแปลงในภายหลัง รวมพฤติกรรมที่ต้องการ ผู้ใช้ที่ได้รับผลกระทบ ข้อจํากัด และขั้นตอนการตรวจสอบ

Add a product detail view to the sales performance explorer.

Open the view when a user selects a product in the data grid. Use fields and measures
that exist in the semantic model, reuse existing query results where practical, and
preserve filters and formatting. Run the existing build and browser validation, then
list the interactions and DAX results I should verify in the Fabric portal.

เก็บคําขอแต่ละรายการให้เล็กพอที่จะตรวจสอบได้ ตั้งค่าสถานะการทํางานก่อนที่จะขอให้ Copilot เปลี่ยนแปลงครั้งใหญ่หรืออาจทําลายล้าง

แก้ไขปัญหาเวิร์กโฟลว์ Copilot

Copilot พิมพ์เฉพาะคําสั่งเท่านั้น

บอก Copilot ให้รันคําสั่งเองและรายงานผลลัพธ์ ยืนยันว่าแชทอยู่ในโหมด Agent และเปิดใช้งานการเข้าถึงเทอร์มินัลแล้ว

คําสั่งรอการลงชื่อเข้าใช้

ดําเนินการเข้าสู่ระบบเบราว์เซอร์ให้เสร็จสมบูรณ์ จากนั้นแจ้ง Copilot ว่าการลงชื่อเข้าใช้เสร็จสมบูรณ์เพื่อให้ดําเนินการต่อได้

Copilot แก้ไขโฟลเดอร์ผิด

หยุดเอเจนต์ เปิดโฟลเดอร์โครงการแบบโครงสร้างใน Visual Studio Code และเริ่มแชทใหม่จากพื้นที่ทํางานนั้น

การปรับใช้สําเร็จแต่การสืบค้นโมเดลเชิงความหมายล้มเหลว

ถาม Copilot ตรวจสอบ workspace และ model ID ของ connector, การตั้งค่า Rest API tenant ของ Semantic Model Execute Queries REST, สิทธิ์ Build และ Read, DAX ที่สร้างขึ้น, ผลลัพธ์ข้อผิดพลาดของ connector และคอนโซลเบราว์เซอร์ อย่าแทนที่คําสั่งที่ล้มเหลวด้วยข้อมูลจําลอง

Copilot เสนอ--force

กําหนดให้ Copilot แสดงการดําเนินการสคีมาที่อาจทําลายได้ก่อน ยอมรับ --force เฉพาะเมื่อคุณเข้าใจและอนุมัติการสูญหายของข้อมูลที่อาจเกิดขึ้น

สําหรับปัญหาอื่น ๆ โปรดดูที่ การแก้ไขปัญหาแอป Fabric