Kongsi melalui


Mulakan dengan pemalam Power Pages untuk GitHub Copilot CLI dan Claude Code (pratonton)

Pemalam Power Pages untuk GitHub Copilot CLI dan Claude Code menyediakan aliran kerja berbantukan AI untuk mencipta, menggunakan dan mengurus tapak aplikasi satu halaman (SPA) moden pada Power Pages. Daripada projek perancah secara manual, menulis kod API boilerplate dan mengkonfigurasi kebenaran, terangkan perkara yang anda mahukan dalam bahasa semula jadi dan pemalam mengendalikan pelaksanaan.

Pemalam ini menyokong kitaran hayat pembangunan tapak penuh melalui kemahiran perbualan, daripada perancah tapak baharu kepada menggunakannya, menyediakan model data Dataverse dan mengkonfigurasi pengesahan.

Penting

  • Ciri ini adalah dalam pratonton.
  • Ciri pratonton bukan untuk kegunaan pengeluaran dan kefungsian mungkin terbatas. Ciri-ciri ini tersedia sebelum keluaran rasmi supaya pelanggan boleh mendapatkan access awal dan memberikan maklum balas.
  • Semak cadangan ejen sebelum meluluskan

Prasyarat

Sebelum anda memulakan, sahkan bahawa anda mempunyai perisian dan kebenaran yang diperlukan.

Keperluan perisian

Komponen Versi minimum Maklumat lanjut
Node.js 18.0 atau lebih baru Muat turun Node.js
Platform Kuasa CLI (PAC CLI) 2.6.3 atau lebih baru (diperlukan untuk logik pelayan) Pasang PAC CLI
Azure CLI Terkini Pasang Azure CLI
GitHub Copilot CLI atau Kod Claude Terkini GitHub Copilot CLI atau Kod Claude
Sambungan Visual Studio Code dan Power Platform Tools (Pilihan) Terkini Muat turun Kod VS dan Pasang Alat Platform Kuasa

Anda juga memerlukan:

  • Persekitaran Power Platform dengan Power Pages didayakan.
  • Sesi PAC CLI yang disahkan disambungkan ke persekitaran sasaran anda. Jalankan pac auth create jika anda belum menyambung lagi.
  • Sesi Azure CLI mendaftar masuk kepada penyewa yang sama. Jalankan az login untuk mengesahkan.

Sahkan pengesahan:

Sahkan anda disahkan dengan menggunakan arahan tersebut pac auth list .

pac auth list           # Should show authenticated profile

Jika anda tidak disahkan, jalankan arahan ini:

pac auth create --environment <Instance url>        # Authenticate to Power Platform

Tip

Untuk mendapatkan URL tika, pergi ke Power Pages rumah, pilih ikon Tetapan di penjuru kanan sebelah atas, dan kemudian pilih Butiran sesi.

Pasang pemalam

Pasang pemalam Power Pages daripada pasaran. Jika anda menggunakan GitHub Copilot CLI, lihat dokumentasi sambungan CLI Copilot untuk langkah pemasangan yang setara. Perintah berikut menggunakan sintaks Claude Code.

Jalankan pemasang untuk menyediakan semua pemalam dengan kemas kini automatik didayakan:

Windows (PowerShell):

iwr https://raw.githubusercontent.com/microsoft/power-platform-skills/main/scripts/install.js -OutFile install.js; node install.js; del install.js

macOS/Linux/Windows (cmd):

curl -fsSL https://raw.githubusercontent.com/microsoft/power-platform-skills/main/scripts/install.js | node

Pemasang secara automatik:

  • Memasang pac CLI jika ia belum dipasang.
  • Mengesan alatan yang tersedia, seperti Claude Code dan GitHub Copilot CLI.
  • Mendaftarkan pasaran pemalam dan memasang semua pemalam yang disenaraikan.
  • Mendayakan kemas kini automatik supaya pemalam kekal terkini.

Selepas pemasangan, mulakan semula Claude Code atau GitHub Copilot CLI untuk mengakses kemahiran pemalam sebagai arahan garis miring dalam sesi ejen anda.

Pasang daripada pasaran

  1. Buka Kod Claude di terminal anda.

  2. Tambah pasaran Microsoft:

    /plugin marketplace add microsoft/power-platform-skills
    
  3. Pasang pemalam Power Pages:

    /plugin install power-pages@power-platform-skills
    

Selepas anda memasang pemalam, mulakan semula Claude Code atau GitHub Copilot CLI untuk mengakses kemahiran pemalam sebagai arahan garis miring dalam sesi ejen anda.

Tip

Untuk menerima kemas kini pada pasaran dan kemahiran secara automatik, hidupkan kemas kini automatik. Gunakan /plugin arahan, pergi ke Pasaran, pilih pasaran dan hidupkan kemas kini automatik.

Gambaran keseluruhan kemahiran

Pemalam ini menyediakan kemahiran yang merangkumi kitaran hayat penuh laman web Power Pages. Gunakan setiap kemahiran secara perbualan, sama ada sebagai arahan garis miring atau dengan menerangkan perkara yang anda mahu do.

Kemahiran Perintah Apa yang dilakukannya
Buat laman web /create-site Perancah tapak, menggunakan arah reka bentuk anda, dan membina halaman dan komponen
Gunakan tapak /deploy-site Membina projek dan memuat naiknya ke Power Pages dengan menggunakan PAC CLI
Aktifkan laman web /activate-site Menyediakan rekod tapak web dan memberikan URL awam
Sediakan model data /setup-datamodel Mencipta jadual, lajur dan perhubungan Dataverse
Tambah data sampel (pilihan) /add-sample-data Mengisi jadual Dataverse dengan rekod ujian yang realistik
Sepadukan API Web /integrate-webapi Menjana kod klien, perkhidmatan dan kebenaran jadual API yang ditaip
Sediakan pengesahan /setup-auth Menambah fungsi log masuk dan log keluar serta access control berasaskan peranan
Cipta peranan web /create-webroles Menjana fail YAML peranan web untuk pengurusan access pengguna
Tambah logik pelayan /add-server-logic Menjana titik akhir JavaScript bahagian pelayan yang selamat untuk pengesahan, panggilan API luaran, pengurusan rahsia dan operasi data
Tambah aliran awan /add-cloud-flow Mengintegrasikan aliran awan Power Automate sedia ada ke dalam tapak anda untuk aliran kerja kelulusan, pemberitahuan dan automasi berjadual
Sepadukan bahagian belakang /integrate-backend Menganalisis prototaip anda, menentukan pendekatan yang betul (API Web, Logik Pelayan atau aliran awan) untuk setiap ciri dan mengatur urutan binaan lengkap
Tambah SEO /add-seo Menjana tag robots.txt, sitemap.xml, dan meta

Aliran kerja biasa

Aliran kerja hujung ke hujung yang biasa mengikut urutan ini:

  1. /create-site : Perancah, reka bentuk dan bina halaman
  2. /deploy-site : Muat naik ke persekitaran Power Pages anda
  3. /activate-site : Sediakan URL awam
  4. /setup-datamodel : Buat jadual Dataverse
  5. /add-sample-data : Mengisi jadual dengan rekod ujian
  6. /integrate-webapi : Jana kod klien API dan konfigurasikan kebenaran
  7. /create-webroles : Tentukan peranan access
  8. /setup-auth : Tambah log masuk, log keluar dan UI berasaskan peranan
  9. /add-server-logic : Tambah titik akhir bahagian pelayan yang selamat
  10. /add-cloud-flow : Sepadukan aliran Power Automate sedia ada
  11. /add-seo : Pengoptimuman enjin carian
  12. /deploy-site : Tolak perubahan akhir secara langsung

Tip

  • Anda tidak perlu mengikut susunan yang tepat ini. Setiap kemahiran menyemak prasyaratnya sendiri dan memberitahu anda jika ada sesuatu yang hilang. Sebagai contoh, anda boleh menjalankan /setup-auth sebelum ini /integrate-webapi jika tapak anda memerlukan pengesahan terlebih dahulu.
  • Jika anda tidak pasti pendekatan yang hendak digunakan untuk setiap ciri, jalankan /integrate-backend langkah 4 hingga 10 secara individu. Ia menganalisis prototaip anda, menentukan sama ada setiap ciri memerlukan API Web, Logik Pelayan atau aliran awan dan mengatur kemahiran dalam susunan yang betul.

Bina tapak Power Pages anda

Panduan ini merangkumi kitaran hayat penuh membina tapak Power Pages dengan pemalam, daripada perancah hingga penggunaan. Setiap langkah menerangkan apa yang anda katakan dan apa yang dilakukan oleh pemalam sebagai tindak balas.

Langkah 1: Buat laman web anda

Terangkan tapak yang anda mahukan dalam bahasa semula jadi: untuk apa, halaman yang diperlukan dan sebarang pilihan reka bentuk seperti skema warna, gaya susun atur atau fon. Jalankan /create-site atau hanya terangkan laman web anda dan pemalam mengenali niatnya.

Jika anda tidak menentukan rangka kerja, pemalam meminta anda memilih satu (React, Vue, Angular atau Astro), kemudian:

  1. Perancah project daripada templat dan menggunakan nama laman, warna dan token reka bentuk anda.
  2. Memasang kebergantungan, memulakan pelayan pembangunan dan membuka pratonton penyemak imbas langsung.
  3. Membina setiap halaman, komponen dan laluan yang anda minta dengan imej yang berkaitan.
  4. Mencipta komit git pada pencapaian penting supaya anda mempunyai sejarah rollback terbina dalam.

Langkah 2: Gunakan tapak anda

Jalankan /deploy-site untuk memuat naik tapak anda ke Power Pages. Pemalam:

  1. Mengesahkan bahawa PAC CLI dipasang dan sesi pengesahan anda aktif.
  2. Mengesahkan persekitaran sasaran dengan anda sebelum meneruskan.
  3. Menjalankan binaan pengeluaran dan memuat naik output yang disusun.
  4. Mencipta direktori artifacts penggunaan jika direktori belum wujud.

Nota

Jika persekitaran anda menyekat lampiran fail tertentu, pemalam mengesan masalah dan memberikan arahan untuk menyelesaikannya.

Langkah 3: Aktifkan laman web anda

Jalankan /activate-site untuk menjadikan laman web ini boleh diakses secara umum. Pemalam:

  1. Mencadangkan subdomain berdasarkan nama tapak anda dan membolehkan anda menyesuaikannya.
  2. Menyediakan rekod tapak web melalui API Power Platform.
  3. Mengundi sehingga tapak disiarkan secara langsung dan mengembalikan URL awam.

Pada ketika ini, anda mempunyai tapak kerja di URL awam. Langkah selebihnya menambah data, pengesahan dan SEO. Langkau sebarang langkah yang tidak digunakan pada tapak anda.

Langkah 4: Sediakan model data anda

Jalankan /setup-datamodel untuk mencipta jadual Dataverse yang diperlukan oleh tapak anda. Jika anda sudah mempunyai gambar rajah ER atau skema tertentu, berikan secara langsung dan bukannya meminta ejen menganalisis kod anda.

Pemalam melahirkan ejen Arkitek Model Data yang:

  1. Menganalisis kod tapak anda untuk menentukan data yang diperlukan oleh halaman dan komponen.
  2. Menanyakan persekitaran Dataverse anda untuk jadual sedia ada untuk mengelakkan pendua.
  3. Mencadangkan model data dengan jadual, lajur, jenis data dan perhubungan, divisualisasikan sebagai gambar rajah ER.

Anda menyemak dan meluluskan cadangan itu. Pemalam tidak mencipta apa-apa sehingga anda mengesahkan. Selepas kelulusan, pemalam mencipta jadual dan lajur melalui panggilan API dan menyimpan fail manifes yang digunakan oleh Langkah 5 dan 6.

Langkah 5: Tambah data sampel (Pilihan)

Jalankan /add-sample-data untuk mengisi jadual anda dengan rekod ujian. Langkah ini memerlukan model data daripada Langkah 4.

Pemalam melakukan tindakan berikut:

  1. Membaca manifes untuk memahami jadual, lajur dan perhubungan anda.
  2. Menjana nilai yang sesuai secara kontekstual untuk setiap jenis lajur, seperti e-mel yang realistik, tarikh yang munasabah dan amaun mata wang yang diformatkan.
  3. Menyelitkan rekod dalam tertib kebergantungan (jadual induk sebelum jadual anak) dan menyegarkan semula token pengesahan secara automatik semasa sisipan pukal.

Langkah 6: Sepadukan dengan API Web Dataverse

Jalankan /integrate-webapi untuk menggantikan data olok-olok dengan pertanyaan Dataverse langsung. Langkah ini memerlukan model data daripada Langkah 4.

Pemalam melakukan tindakan berikut:

  1. Mengimbas pangkalan kod anda untuk komponen yang menggunakan data olok-olok, panggilan pengambilan ruang letak atau tatasusunan berkod keras. Ia memetakan komponen ini ke jadual Dataverse anda.
  2. Melahirkan ejen Penyepaduan API Web untuk setiap jadual yang menjana:
    • Klien API yang dikongsi dengan pengurusan token anti-pemalsuan dan logik percubaan semula.
    • Jenis entiti TypeScript dan pemetaan domain.
    • Lapisan perkhidmatan CRUD.
    • Corak khusus rangka kerja, seperti cangkuk React, gubahan Vue atau perkhidmatan Angular.
  3. Melahirkan ejen Arkitek Kebenaran yang mencadangkan keizinan jadual dan tetapan laman.

Anda menyemak dan meluluskan cadangan kebenaran. Pemalam tidak membuat sebarang fail konfigurasi sehingga anda mengesahkan.

Langkah 7: Cipta peranan web

Jalankan /create-webroles untuk menentukan peranan access pengguna. Pemalam:

  1. Menanyakan persekitaran anda untuk peranan web sedia ada untuk mengelakkan pendua.
  2. Menjana takrifan peranan dengan pengecam unik.
  3. Menguatkuasakan bahawa setiap tapak mempunyai paling banyak satu peranan tanpa nama dan satu peranan yang disahkan.

Langkah 8: Sediakan pengesahan

Jalankan /setup-auth untuk menambah fungsi log masuk dan log keluar. Pemalam:

  1. Menjana perkhidmatan pengesahan untuk aliran Microsoft Entra ID dengan pengurusan token anti-pemalsuan.
  2. Mencipta komponen UI log masuk/log keluar yang disepadukan dengan reka letak tapak anda.
  3. Menambah utiliti access control berasaskan peranan yang menunjukkan atau menyembunyikan elemen UI berdasarkan peranan web pengguna.
  4. Menggunakan corak rangka kerja anda di seluruh (cangkuk React, gubahan Vue atau perkhidmatan Angular).

Langkah 9: Tambah logik pelayan

Jalankan /add-server-logic untuk menambah titik akhir bahagian pelayan selamat ke laman web anda. Gunakan Logik Pelayan apabila tapak anda memerlukan logik yang tidak boleh dijalankan dalam penyemak imbas, seperti panggilan API luaran, pengesahan bahagian pelayan, pengurusan rahsia atau operasi data merentas entiti.

Penting

Sokongan logik pelayan memerlukan PAC CLI versi 2.6.3 atau lebih baru. Gunakan skrip pemasangan pantas untuk mengemas kini kepada versi terkini.

Terangkan apa yang anda perlukan dalam bahasa mudah, dan pemalam:

  1. Melahirkan ejen Arkitek Logik Pelayan yang menganalisis kes penggunaan anda dan mengklasifikasikan kerumitannya.
  2. Mencadangkan reka bentuk titik akhir, konfigurasi keselamatan dan sebarang keizinan jadual yang diperlukan untuk semakan anda.
  3. Selepas anda meluluskan, menjana titik akhir JavaScript bahagian pelayan di /_api/serverlogics/<name>.
  4. Mencipta perkhidmatan bahagian klien yang ditaip untuk memanggil titik akhir daripada komponen anda.
  5. Mengemas kini komponen anda untuk memanggil perkhidmatan baharu.
  6. Mengkonfigurasikan tugasan peranan web dan keizinan jadual untuk titik akhir.

Anda menyemak dan meluluskan cadangan itu. Tiada kod dijana sehingga anda mengesahkan.

Kes penggunaan biasa:

Nota

Jalankan /add-server-logic sekali bagi setiap kes penggunaan. Contohnya, jika tapak anda memerlukan kedua-dua titik akhir pengesahan inventori dan titik akhir carian global, jalankan kemahiran dua kali.

Langkah 10: Sepadukan aliran awan

Jalankan /add-cloud-flow untuk menyepadukan aliran awan Power Automate sedia ada ke laman web anda. Kemahiran ini menyambungkan laman Power Pages anda kepada aliran yang telah anda cipta dalam Power Automate. Ia tidak mencipta aliran awan baharu.

Pemalam:

  1. Mendaftarkan aliran awan sedia ada dengan tapak anda.
  2. Menjana kod bahagian pelanggan untuk mencetuskan aliran daripada halaman anda.
  3. Mengendalikan keadaan aliran kerja tak segerak dan corak panggilan balik.
  4. Wayar pertukaran data antara halaman dan aliran.

Gunakan /add-cloud-flow untuk aliran kerja kelulusan, pemberitahuan e-mel, kerja berjadual dan automasi dipacu peristiwa yang dikendalikan dengan lebih baik oleh Power Automate daripada titik akhir bahagian pelayan.

Alternatif: Gunakan /integrate-backend untuk merancang lapisan perkhidmatan penuh

Jika anda tidak pasti ciri yang memerlukan API Web, Logik Pelayan atau aliran awan, jalankan /integrate-backend dan bukannya menjalankan langkah 4 hingga 10 secara manual. Kemahiran ini bertindak sebagai orkestra yang:

  1. Menganalisis prototaip anda untuk mengenal pasti semua ciri yang memerlukan lapisan perkhidmatan.
  2. Mengklasifikasikan setiap ciri ke dalam pendekatan yang betul: API Web untuk CRUD standard, Logik Pelayan untuk pengesahan bahagian pelayan dan API luaran, atau aliran awan untuk aliran kerja kelulusan dan automasi.
  3. Mencadangkan pelan pelaksanaan berjujukan dengan semua kemahiran, kebergantungan dan konfigurasi.
  4. Selepas anda meluluskan, mengatur kemahiran dalam susunan yang betul.

Pelan ini berterusan, boleh disambung semula dan boleh diedit. Berhenti selepas sebarang langkah untuk menyemak kod yang dijana atau menguji tapak, dan sambungkan di mana anda berhenti dengan berlari /integrate-backend semula.

Langkah 11: Tambah SEO

Jalankan /add-seo untuk mengoptimumkan laman web anda untuk enjin carian. Pemalam:

  1. Menemui laluan daripada konfigurasi penghala rangka kerja anda.
  2. Menjana arahan enjin carian dan peta laman untuk semua laluan yang ditemui.
  3. Menambah teg meta: viewport, charset, perihalan, Graf Terbuka, Kad Twitter dan rujukan favicon.

Langkah 12: Gunakan tapak akhir

Jika anda melakukan sebarang langkah pilihan, jalankan /deploy-site semula untuk menolak perubahan secara langsung. Pemalam menjalankan binaan pengeluaran dan memuat naik tapak bersama-sama dengan semua artifak penggunaan (keizinan jadual, tetapan tapak, peranan web, fail logik pelayan) ke persekitaran Power Pages anda.

Sahkan tapak anda

Selepas anda melengkapkan kemahiran, sahkan tapak Power Pages anda berfungsi dengan betul.

  1. Pergi ke Power Pages.
  2. Cari laman web anda dalam senarai Laman aktif .
  3. Pratonton tapak anda pada desktop dengan menggunakan pilihan Pratonton .
  4. Uji fungsi.

Petua dan amalan terbaik

Petua berikut membantu anda memanfaatkan sepenuhnya pemalam dan ejen pengekodan AI semasa membina tapak Power Pages.

Tonton output terminal untuk alatan yang hilang pada larian pertama

Pemalam menyediakan kemahiran dan aliran kerja, tetapi ejen pengekodan AI - GitHub Copilot CLI atau Claude Code - melaksanakan arahan sebenar pada mesin anda. Apabila anda menggunakan alat ini buat kali pertama, perhatikan output terminal dengan teliti. Ejen pengekodan AI menjalankan arahan dan skrip di belakang tabir dan sesetengah arahan ini bergantung pada alatan yang mungkin tidak dipasang pada mesin anda. Jika langkah gagal, output terminal biasanya menunjukkan alat atau arahan yang tidak dapat ditemui.

Jika anda melihat ralat seperti command not found atau is not recognized, pasang alat yang hilang dan cetus semula aliran kerja. Ejen pengekodan AI meneruskan di mana ia berhenti selepas alat tersedia.

Semak cadangan ejen sebelum meluluskan

Ejen Arkitek Model Data dan Arkitek Kebenaran API Web membentangkan cadangan sebelum membuat perubahan. Luangkan masa untuk menyemak cadangan ini dengan teliti.

  • Cadangan model data: Semak sama ada nama jadual, jenis lajur dan perhubungan sepadan dengan keperluan perniagaan anda. Adalah lebih mudah untuk melaraskan cadangan daripada menamakan semula lajur selepas data telah dimasukkan.
  • Cadangan kebenaran: Sahkan bahawa setiap peranan mempunyai tahap access yang betul (cipta, baca, kemas kini, padam) untuk setiap jadual. Kebenaran jadual yang terlalu permisif ialah risiko keselamatan biasa.

Tampal ralat secara langsung dengan konteks

Apabila sesuatu gagal, sama ada ralat binaan, kegagalan penggunaan atau pengecualian masa jalan dalam penyemak imbas, salin output ralat penuh. Tampal bersama-sama dengan penerangan ringkas tentang apa yang anda lakukan. Lebih banyak konteks yang anda berikan, semakin cepat pembetulan.

Contoh: Ralat binaan

I ran npm run build and got this error. Fix it.

error TS2339: Property 'jobTitle' does not exist on type 'JobPosting'.

  src/components/JobCard.tsx:24:31
    24   <Text>{posting.jobTitle}</Text>
                                 

Tip

Sertakan nama fail, arahan yang anda jalankan dan perkara yang anda jangkakan akan berlaku. Pemalam menggunakan konteks ini untuk mencari masalah dan menggunakan pembetulan yang disasarkan dan bukannya meneka.

Kongsi ralat API Web dengan URL permintaan penuh

Isu biasa selepas penggunaan ialah ralat 403 daripada API Web Power Pages apabila lajur tidak didayakan untuk capaian API. Apabila anda menghadapi ralat ini, tampal URL API penuh dan respons ralat JSON yang lengkap. Mesej ralat memberitahu anda dengan tepat jadual dan lajur yang perlu diperbaiki, dan pemalam boleh mengemas kini kebenaran jadual YAML dan tetapan tapak untuk anda.

Contoh: Lajur tidak didayakan untuk API Web (403)

I'm getting a 403 error when the documents page loads. Here's the API call and the response. Fix the issue so this API works.

URL:
https://my-site.powerappsportals.com/_api/crd50_documents?$select=crd50_documentid,crd50_name,crd50_documentcategory,crd50_filetype,crd50_filesize,crd50_updateddate,crd50_description,_crd50_propertyid_value

Response:
{
  "error": {
    "code": "90040101",
    "message": "Attribute _crd50_propertyid_value in table crd50_document is not enabled for Web Api.",
    "innererror": {
      "code": "90040101",
      "message": "Attribute _crd50_propertyid_value in table crd50_document is not enabled for Web Api.",
      "type": "AttributePermissionIsMissing"
    }
  }
}

Ralat ini (AttributePermissionIsMissing) bermaksud lajur _crd50_propertyid_value carian wujud dalam jadual Dataverse tetapi tidak disenaraikan dalam konfigurasi keizinan jadual untuk API Web. Pemalam menyelesaikan ralat ini dengan menambah lajur yang hilang pada keizinan jadual YAML dan .powerpages-site/table-permissions/ menggunakan semula.

Nota

Power Pages Web API memerlukan setiap lajur yang dikembalikan oleh panggilan API untuk disenaraikan secara eksplisit dalam keizinan jadual. Sifat carian (awalan dengan _ dan akhiran dengan _value) mudah terlepas kerana nama API mereka berbeza daripada nama logik lajur dalam Dataverse. Apabila anda melihat AttributePermissionIsMissing, sentiasa tambahkan lajur tersebut pada keizinan jadual. Jangan ubah pertanyaan API.

Jadilah spesifik tentang apa yang anda mahukan

Permintaan yang tidak jelas menghasilkan hasil yang samar-samar. Beritahu pemalam dengan tepat apa yang anda perlukan, termasuk pilihan susun atur, medan data dan tingkah laku.

Sebaliknya Cuba
"Buat halaman untuk pekerjaan" "Cipta halaman penyenaraian pekerjaan dengan bar carian di bahagian atas, penapis cip untuk lokasi dan jabatan, dan grid kad yang menunjukkan tajuk, syarikat, julat gaji dan tarikh disiarkan untuk setiap pekerjaan"
"Betulkan penggayaan" "Kad kerja disusun secara menegak pada desktop. Jadikan ia dipaparkan dalam grid tiga lajur dengan jurang 16px pada skrin lebih lebar daripada 768px"
"Tambah beberapa data" "Tambah 20 contoh siaran kerja merentasi empat jabatan (Kejuruteraan, Pemasaran, Jualan, HR) dengan tajuk yang realistik, julat gaji antara $60k-$180k, dan tarikh yang disiarkan dalam tempoh 30 hari yang lalu"
"Sediakan API" "Sambungkan komponen JobListings ke jadual Dataverse cr_jobposting. Gantikan tatasusunan berkod keras dengan panggilan API sebenar yang mengambil tajuk, jabatan, gaji dan tarikh disiarkan"

Gunakan tangkapan skrin untuk masalah visual

Apabila tapak tidak kelihatan betul dalam penyemak imbas, ambil tangkapan skrin dan tampalkannya terus ke dalam perbualan atau berikan laluan fail. Konteks visual membantu mengenal pasti masalah reka letak, jarak dan penggayaan yang sukar diterangkan dalam teks.

The header overlaps the hero section on mobile. Here's a screenshot:

[paste screenshot or provide path to screenshot file]

Fix the header so it doesn't overlap. It should be a fixed header with the content starting below it.

Lelaran dalam langkah kecil

Daripada menerangkan keseluruhan laman web dalam satu gesaan, bina secara beransur-ansur. Mulakan dengan struktur dan susun atur, kemudian tambahkan ciri satu demi satu. Pendekatan ini memberi anda peluang untuk menyemak dan membetulkan kursus pada setiap langkah.

Step 1: /create-site → Get the basic scaffold and layout right
Step 2: "Add a hero section to the home page with a search bar"
Step 3: "Add a job listings page with filter and sort"
Step 4: "Add a job detail page that shows full description"
Step 5: /setup-datamodel → Create tables now that you know the data shape
Step 6: /integrate-webapi → Wire up real data

Tip

Selepas setiap langkah, semak pratonton penyemak imbas. Jika ada yang tidak kena, betulkan sebelum meneruskan. Lebih mudah untuk menyelesaikan masalah dalam satu komponen daripada menguraikan masalah di seluruh tapak.

Minta penjelasan sebelum meluluskan

Apabila anda tidak pasti tentang perubahan yang dicadangkan, terutamanya untuk kebenaran, pengubahsuaian model data atau konfigurasi pengesahan, minta pemalam untuk menerangkan perkara yang to do dan mengapa sebelum meluluskan.

Before you create the table permissions, explain what access each role will have and why. I want to understand the security implications.

Jalankan kemahiran secara bebas untuk pulih daripada masalah

Jika kemahiran gagal separuh jalan, anda tidak perlu memulakan semula. Setiap kemahiran berjalan secara bebas dan boleh meneruskan di mana ia berhenti. Sebagai contoh, jika /integrate-webapi gagal pada jadual ketiga, anda boleh menjalankannya semula dan ia mengesan kerja yang telah selesai.

/integrate-webapi failed while processing the cr_applications table. Here's the error: [paste error]. Resume the integration from where it stopped.