Loo ja redigeeri generatiivseid lehti tehisintellekti koodigenereerimise tööriistadega

Selles artiklis kirjeldatakse, kuidas kasutada AI koodi loomise tööriistu (nt GitHub Copilot CLI), et luua ja redigeerida Power Apps mudelipõhiste rakenduste generatiivseid lehti. Selle meetodi abil saate integreerida täiustatud koodi loomise võimalused otse arendustöövoogu, et luua uusi generatiivseid lehti või itereerida olemasolevatele, kasutades loomuliku keele juhiseid.

Näpunäide

Selline lähenemine on soovitatav tee generatiivsete lehtede koostamiseks. See annab teile juurdepääsu uusimatele eesliini tehisintellekti mudelitele, töötab avalikes pilvedes kogu maailmas ja võimaldab teil koostada mitu lehte ja tugitabeleid andmetabelid korraga.

AI koodi loomise tööriistade kasutamine generatiivsete lehtedega täiendab kasutajaliidesel põhinevat kogemust Power Apps (make.powerapps.com). See koodipõhine lähenemine sobib igale loojale või arendajale, kes soovib juurdepääsu uusimatele tehisintellekti mudelitele või eelistab töötada kohalike arendustööriistade ja CLI-põhiste töövoogudega.

Mida saad teha koodigenereerimise tööriistadega

  • Loo üks või mitu generatiivset lehte ühe jooksuga lihtsa keele nõuetest
  • Loo oma lehtedele vajalikud toetavad Microsoft Dataverse tabelid või taaskasuta olemasolevaid, sealhulgas näidisandmeid uute tabelite jaoks
  • Paiguta artefakte uude või olemasolevasse rakendusse ja lahendusse, sealhulgas luua rakendus või lahendus jooksvalt
  • Uuenda olemasolevaid generatiivseid lehti , taotledes muudatusi või täiustusi oma tehisintellekti tööriista kaudu
  • Deploy otse oma Power Apps keskkonda PAC CLI käskude abil
  • Tööta kohapeal oma eelistatud IDE ja arendustööriistadega, kasutades npm install IntelliSense'i tuge genereeritud koodile

Toimimisviis

  1. Kirjeldad, mida soovid ehitada, loomulikus keeles, näiteks "Loo generatiivne lehe juhtpaneel, mis näitab parimaid kontosid tulude järgi."
  2. Planeerija agent analüüsib teie taotlust ja pakub välja plaani. Plaan võib sisaldada ühte või mitut lehte, Dataverse'i tabeleid, mida lehed vajavad (uued või olemasolevad), ning rakendust ja lahendust, kus artefaktid asuvad. Planeerija delegeerib seejärel spetsialiseeritud agentidele plaani kirjelduse ehitamise. Näiteks tabeliehitaja ja lehe ehitaja.
  3. Sa vaatad plaani üle ja kohandad enne ehitamist. Saad muuta lehtede arvu, vahetada või lisada tabeleid, sihtida teist rakendust või paigutada artefaktid teise lahendusse.
  4. Agendid genereerivad tootmisvalmis TypeScripti ja Reacti koodi teie lehele või lehtedele koos toetavate failidega kohaliku arenduse jaoks.
  5. Tööriist paigutab artefaktid sinu keskkonda generatiivsete lehe PAC CLI käskude abil ning soovi korral käivitab brauseris verify-sammu, mis harjutab lehte genereeritud testidega.
  6. Sinu generatiivne leht ilmub sinu mudelipõhises rakenduses.

Eeltingimused

Enne alustamist veendu, et sul on siin kirjeldatud vajalik tarkvara ja õigused.

Tarkvaranõuded

Komponent Miinimumversioon Lisateave
Node.js 18.0 või hiljem Laadi alla Node.js
Power Platform CLI (PAC CLI) Viimased Paigalda PAC CLI
GitHub Copilot CLI, Claude Code või muu koodigenereerimise tööriist Viimased GitHub Copilot CLI või Claude kood

Täiendavad nõuded

  • Power Platformi keskkond, kus on mudelipõhine rakendus lehtede juurutamiseks.
  • Autentitud PAC CLI sessioon, mis on ühendatud sihtkeskkonnaga.

Märkus.

See võimekus on üle maailma kättesaadav avalikes pilvedes.

Paigalda plugin

Käivita installer, et seadistada kõik Power Platformi pluginad kas PowerShellis või Windows käsuaknas.

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

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

Paigaldaja automaatselt:

  • Tuvastab saadaolevad tööriistad (GitHub Copilot CLI, Claude Code)
  • Registreerib pluginate turu ja paigaldab kõik pluginad
  • Lubab automaatse uuenduse, et pluginad püsiksid ajakohased

Pärast paigaldamist taaskäivita vajadusel oma tehisintellekti tööriist.

Paigalda ainult generatiivse lehe plugin

Ainult generatiivse lehe plugina paigaldamiseks GitHub Copilot CLI või Claude Code'i jaoks:

  1. Lisa Power Platform Skills turu plugin: /plugin marketplace add microsoft/power-platform-skills
  2. Paigalda Power Apps plugin: /plugin install model-apps@power-platform-skills

Märkus.

Claude Code'i puhul saad plugina paigaldada erinevate ulatustega, näiteks globaalne, kohalik või kasutaja. Sõltuvalt ulatusest pead olema õiges kataloogis, et Claude Code saaks pluginat kasutada. Mine Laienda Claude oskustega.

Kui plugin on paigaldatud, saad pluginat kasutada kas nii:

  • Käsu käivitamine /genpage otseselt.
  • Kirjelda lehte, mida soovid luua. Tööriist tuvastab ja kasutab pluginat automaatselt.

Näpunäide

Lülita sisse automaatne uuendus, et saada automaatselt turule ja oskustele uuendusi. Kasuta käsku /plugin , liigu turuplatsidele, vali turg ja lülita sisse automaatne uuendamine.

Teiste tehisintellekti koodigenereerimise tööriistade kasutamine

Teiste tehisintellekti koodigenereerimise tööriistade puhul veendu, et su tööriistal oleks juurdepääs generatiivsetele lehe ressurssidele Power Platform skills GitHub hoidlast. Model-apps plugina kaust sisaldab komponentide dokumentatsiooni, näidiskoodi, PAC CLI käskude viiteid ja töövoo juhiseid, mis on vajalikud generatiivse lehe nõuetele vastava koodi loomiseks, sealhulgas kuidas luua lehti, mis toetavad mitut keelt ja piirkonda. Vaata hoidla readme lehte, et saada teavet nende ressursside kasutamise ja ligipääsu kohta oma eelistatud tööriistaga.

Oskuste ülevaade

Power Apps plugin pakub seda oskust generatiivsete lehtedega töötamiseks.

Oskus Käsk Kirjeldus
Generatiivsed lehed /genpage Loo koodi generatiivsete lehtede jaoks (stsenaariumite loomiseks või muutmiseks)

See oskus võimaldab sul kirjeldada, mida soovid ehitada, ning lasta tehisintellektil genereerida täielik TypeScripti ja React kood sinu generatiivsele lehele ning seejärel juurutada see otse sinu Power Apps keskkonda.

Loo uus generatiivne leht

Järgi seda töövoogu, kui ehitad uue lehekülje või lehtede komplekti nullist.

  1. Alusta vestlust oma tehisintellekti tööriistaga. Kirjelda, mida soovid luua. Ole nii konkreetne või avatud kui soovid — mida ebamäärasem on taotlus, seda rohkem agent ise täidab. Samuti võid lisada pildi või muid materjale, mis juhivad visuaale, teemasid ja paigutust. Näide:

    • "Loo generatiivne lehe juhtpaneel, mis näitab meie 10 parimat kontot tulude järgi, kasutades kontotabelit"
    • "Loo kaks lehte vabatahtlike registreerimiste haldamiseks — üks avatud vahetuste sirvimiseks ja teine registreerimise kinnitamiseks — kasutades näidisandmeid"
    • "Loo generatiivne leht intsidentide aruannete kuvamiseks kaardil, kasutades Incident tabelit"

  2. Kui küsitakse, vali loo või muuda. Kui planeerija agent pole kindel, kas soovid uut lehte või uuendada olemasolevat, küsib ta. Selle töövoo järgimiseks vali uue lehekülje loomine. Muutmiseks mine olemasoleva generatiivse lehekülje redigeerimisse.

  3. Vasta küsimustele, mida ehitada. Planeerija võib küsida, millist lehte soovid, tuues mõned näited ja aktsepteerides kohandatud kirjeldust, näiteks milliseid andmeid kasutada, paigutust, kuvatavat infot, interaktsioone jne. Ole konkreetne ärivajaduste ja andmenõuete osas, tuvasta mobiilinõuded varakult ning maini kõiki kasutajaliidese komponente või paigutuseelistusi. Planeerija võib esitada ka täpsustavaid küsimusi, näiteks kas kasutada Dataverse'i tabeleid või kõvakodeeritud näidisandmeid ning kas lisada leht olemasolevasse rakendusse või luua uus rakendus.

  4. Vaata üle ja kohanda plaani. Planeerija esitab plaani, mis sisaldab lehte või lehti, mida ta kavatseb ehitada, Dataverse'i tabeleid kasutada või luua (koos veergudega, mida ta plaanib kasutada), rakendust lehe majutamiseks (uus või olemasolev) ning lahendust, kus artefaktid asuvad. Iteratsiooni koos agendiga, et muuta kõike, mida soovid muuta — näiteks lehtede arvu, kasutatavaid või loodud tabeleid, sihtrakendust või sihtlahendust. Kinnita plaan, kui see sobib sinu kavatsusega.

  5. Lase agentidel ehitada ja juurutada. Spetsialiseerunud agendid genereerivad lehekülje või lehed, toetavad tabelid ja koodi ning seejärel juurutavad need sinu keskkonda.

  6. Soovi korral kontrolli brauseris. Pärast ehitamist võib agent pakkuda brauseris verify-stage'i, mis käivitab automaatselt genereeritud Playwrighti testid lehe vastu, et kinnitada selle korrektset laadimist ja toimimist. Kasuta seda, et märgata ilmselgeid vigu enne käsitsi testimist.

  7. Testi ja itereeri. Ava oma mudelipõhine rakendus Power Apps-is ja liigu uuele lehele. Kui vajad muudatusi, pöördu tagasi oma AI tööriista juurde ja kirjelda uuendusi loomulikus keeles.

Märkus.

Generatiivse lehe nime või asukohta saidikaardil saab igal ajal muuta mudelipõhise rakenduse disaineri abil.

Redigeeri olemasolevat generatiivset lehte

Kasuta seda töövoogu, et uuendada lehte, mis juba sinu keskkonnas eksisteerib.

  1. Ava olemasolev leht. Oma AI koodigeneraatori tööriistas taotle olemasoleva generatiivse lehe taastamist, sisestades lehekülje ID (GUID) või lehekülje nime saidikaardil ja rakenduses, kus see on. Näiteks: "Soovin uuendada lemmikloomade adopteerimise generatiivset lehte demo rakendusest."

  2. Kirjeldage oma uuendusi. Ütle tehisintellekti tööriistale, milliseid muudatusi soovid teha. Näide:

    • "Lisa filter, mis näitab ainult aktiivseid kirjeid"
    • "Muuda paigutust nii, et kaardid kuvatakse ruudustikuna nimekirja asemel"
    • "Lisa graafik, mis näitab kasutuselevõtu trende aja jooksul"
    • "Uuenda vormi, et lisada uus kohandatud väli lemmiklooma temperamendi jaoks"

  3. Vaata üle, avalda, testi ja korda. AI tööriist genereerib uuendatud TypeScripti koodi vastavalt sinu soovitud muudatustele. Järgi sama ülevaatuse, avaldamise ja testimise protsessi, mida kirjeldatakse jaotises "Loo uus generatiivne leht". Jätka loomuliku keele juhiste kordamist, kuni leht vastab sinu nõuetele.

Kohalikud arendusfailid

Kui tehisintellekti tööriist genereerib lehekülje, kirjutab ta ka kaks toetavat faili sinu kohalikku tööruumi, et muuta koodi ülevaatamine ja iteratsioon lihtsamaks:

  • package.json — deklareerib käitusaja ja arenduse sõltuvused, millele genereeritud leht kompileerib. Paigalda npm install need sõltuvused pärast generatsiooni.
  • genpage.d.ts — ümbritseva TypeScripti deklaratsioonid objektidele, mida npm-i kaudu ei paigaldata, näiteks dataApi ja pageInput.

Kui mõlemad failid on paigas ja npm install valmis, töötab sinu toimetaja IntelliSense, näiteks VS Code'is, genereeritud koodi vastu, nii et saad lehte üle vaadata või käsitsi redigeerida ilma, et näeksid punaseid kriipse lahendamata tüüpide puhul.

Seadista leht, mis aktsepteerib sisendparameetreid

Generatiivsed lehed suudavad vastu võtta sisendparameetreid recordId, entityName, ja data, võimaldades neil saada kontekstuaalseid andmeid, kui neid navigeeritakse teistelt lehtedelt või koodist. Kui juhendad tehisintellekti tööriista sisendparameetreid seadistama, genereerib ta sobiva initseerimiskoodi, et leht loeb ja kasutab neid väärtusi laadimisel.

Kirjelda parameetreid, mida soovid oma promptis:

  • "Seadista leht nii, et see aktsepteeriks konto registriId ja entityName. Kui leht laaditakse, kasuta neid parameetreid, et tuua ja kuvada vastavad konto andmed."
  • "Seadista see leht nii, et see aktsepteeriks andmeparameetrit, mis sisaldab kohandatud filtriobjekti. Kasuta seda, et filtreerida kuvatavaid kirjeid, kui leht laadib."

Lehele navigeerimiseks ja nende parameetrite edastamiseks vaata Navigeeri generatiivsele lehele ja sealt tagasi kliendi API abil.

Lokaliseerimine

Kui loote Power Apps oskuse abil generatiivse lehe, käsitletakse lokaliseerimist automaatselt. Agent tuvastab kõik sinu keskkonnas lubatud keeled ja genereerib koodi, et leht töötaks kõigi nende keeltega. Leht järgib iga kasutaja eelistatud keelt ja piirkondlikke vorminduseelistusi kuupäevade, numbrite ja valuuta osas.

Kui soovid sihtida teistsugust keelte komplekti kui need, mis on sinu keskkonnas lubatud, võid paluda agendil neid kohandada, näiteks:

"Uuenda seda lehte, et toetada ainult inglise, prantsuse ja hispaania keelt."

Märkus.

Generatiivse lehe saidikaardi kirje ei ole vaikimisi lokaliseeritud. Saidikaardi kirjete lokaliseerimiseks uuenda neid eraldi rakenduse disaineris.

Lisateabe saamiseks vaata Power Platform Skillsi hoidla lokaliseerimisjuhiseid .

Tõrkeotsing

Leht ei laadi Power Apps-is

Kui liigud generatiivsele lehele ja märkad veateadet või tühja ekraani:

  1. Avatud brauseri arendajate tööriistad (enamikus brauserites F12).

  2. Vali konsooli vahekaart.

  3. Kopeeri täielik veateade, sealhulgas virnajälg.

  4. Naaske oma tehisintellekti koodigenereerimise tööriista juurde ja kleepige viga kontekstiga:

    "Saan selle vea, kui avasin lehe: [kleebi viga siia]. Palun lahenda see probleem."

    AI tööriist analüüsib vea, tuvastab algpõhjuse ja genereerib paranduse.

  5. Vaata paranduse üle ja palu tööriistal leht uuesti avaldada.

Tööversiooni tagasipöördumine

Kui hiljutised muudatused rikkusid su lehte või tegid probleemi hullemaks, võid paluda AI tööriistal tagasi keerata varasemale töötavale versioonile:

"Hiljutised muudatused murdsid lehekülje. Palun pöörduge tagasi viimase tööversiooni juurde."

AI tööriist siis:

  1. Tuvastab tehtud muudatused
  2. Taastab varasema töökoodi
  3. Taasjuurutab stabiilse versiooni

Head tavad

  • Alusta lihtsalt. Alusta oma lehe lihtsast versioonist ja itereeri, et lisada keerukust.
  • Testi tihti. Paigalda ja testi oma lehte pärast iga olulist muudatust.
  • Ole konkreetne. Esita üksikasjalikud nõuded, et saada paremaid esialgseid tulemusi.
  • Kasuta olemasolevaid mustreid. Viita sarnastele lehekülgedele või kasutajaliidese mustritele, kui kirjeldad oma nõudeid.
  • Valideeri genereeritud kood. Alati vaata genereeritud kood üle, et veenduda, et see vastab teie organisatsiooni standarditele ja nõuetele.

Oluline

Kuigi tehisintellekti koodigenereerimise tööriistad püüavad parimal moel genereerida täielikku, tootmisvalmis koodi koos ligipääsetavuse ja turvalisuse parimate tavadega, vastutad lõppkokkuvõttes sina koodi valideerimise eest. Veendu, et genereeritud kood vastab sinu organisatsiooni standarditele, poliitikatele ja vastavusnõuetele.

Kitsendused

Generatiivsete lehtede piirangud, mis on loodud AI koodigeneraatori tööriistadega, on samad, mis generatiivsetel lehtedel, mis on loodud Power Apps makeri portaalis:

  • Sinu leht saab ühenduda ainult Dataverse'i tabelitega.
  • Koostöö ei ole toetatud – veendu, et korraga töötab generatiivse lehe kallal ainult üks looja.
  • Toetatud on ainult need andmetüübid: valik, valuuta, klient, kuupäev ja kell, ainult kuupäev, kümnendkomaarv, ujukomaarv, pilt, otsing, mitmerealine tekst, staatus, oleku põhjus, tekst, täisarv, jah/ei, unikaalne identifikaator.

Seotud sisu

  • Last updated on