Tutoriala: Sortu eta zabaldu orrialde bakarreko aplikazio bat GitHub Spark eta Codespaces erabiliz

Orrialde bakarreko aplikazioen euskarri berriak malgutasun handiagoa ematen die garatzaileei: Power Pages guneak sortu, pertsonalizatu eta kudeatu ditzakezu iturburu-kodean. GitHub Spark-en azken kaleratzearekin, garatzaileek gune bat sortu dezakete, zuzenean GitHub Codespace batean editatu eta Power Pages ingurune batean hedatu dezakete, arakatzailea utzi gabe. Tutorial honek lan-fluxu osoan zehar gidatzen zaitu.

GitHub Spark GitHub Copilot-en adimen artifizialeko hizkuntza naturaleko plataforma berria da. Garatzaileei web aplikazio modernoak azkar abiarazten laguntzeko diseinatuta. Kodea editatzeko GitHub Codespaces-ekin konbinatuta, Spark-ek eskaintzen du:

  • Zure proiekturako erabiltzeko prest dagoen txantiloi-biltegia.
  • Aurrez konfiguratutako dev edukiontziak ingurune koherenteetarako.
  • GitHub Copilot-en adimen artifizialeko lengoaia naturaleko plataforma.

Power Pages garatzaileentzat, horrek esan nahi du prest dagoen gune txantiloi batekin hasi zaitezkeela, pertsonalizatu eta konfigurazio lokal tradizionalik gabe zabaldu dezakezula.

Artikulu honen amaieran, jakingo duzu:

  1. Sortu Power Pages gune prototipo bat GitHub Spark erabiliz.
  2. Konfiguratu zure Codespace .NET eta PAC CLI euskarrirako.
  3. Eraiki eta igo orrialde bakarreko aplikazioa Power Pages ingurune batera.
  4. Berriro aktibatu eta probatu zure webgunea zuzenean Power Pages-etik.

Aurrebaldintzak

Hasi aurretik, ziurtatu hau duzula:

  • Ingurune bat Power Pages administratzaile pribilegioak dituena.
  • Power Platform CLI (PAC CLI) 1.44.x bertsioa edo berriagoa instalatuta eta autentifikatuta.
  • 9.7.4.x edo berriagoko gune bat. Power Pages
  • GitHub Spark lizentzia Codespaces-ekin zure frontend proiektu pertsonalizaturako.

Oharra

  • GitHub Spark erabiltzeko, ziurtatu GitHub lizentzia egokiak dituzula.
  • GitHub Spark edo Codespaces-en laguntza eskuragarri Spark laguntza-taldearen bidez.

1. urratsa: Hasi GitHub Spark txantiloiarekin

  1. Joan GitHub Spark tresnera eta sortu gune berri bat hizkuntza naturala erabiliz.
  2. Sortu ondoren, egin klik Ireki kode-espazioetan.

Honek hodeian oinarritutako garapen ingurune bat eskaintzen dizu, non zure Power Pages proiektuan lan egin dezakezun konfigurazio lokalik gabe.

2. urratsa: Eguneratu garapen-edukiontziaren konfigurazioa

Biltegiaren barruan, lokalizatu fitxategia:

.devcontainer/devcontainer.json

Aldatu ezaugarrien atala .NET 9.0 euskarria gehitzeko. Zure konfigurazioak honako itxura izan beharko luke:

"features": {
  "ghcr.io/devcontainers/features/sshd:1": {
    "version": "latest"
  },
  "ghcr.io/devcontainers/features/dotnet:2.3.0": {
    "version": "9.0"
  }
}

Berreraiki edukiontzia

Aldaketak gorde ondoren:

  1. Sakatu Ctrl + Shift + P (edo Command + Shift + P Mac-en) komando-paleta irekitzeko.
  2. Idatzi Codespaces: Berreraiki edukiontzia eta hautatu.
  3. Edukiontzia berrabiaraziko da. Prozesu honetan, .NET 9 eta gainerako mendekotasun guztiak instalatuko dira.
  4. Itxaron segundo batzuk instalazioa amaitu arte jarraitu aurretik.

Urrats honek ziurtatzen du zure Codespace ingurunea konfigurazio berriarekin freskatzen dela. Horrek ziurtatzen du zure Codespace-k Power Pages eraikitzeko tresnak egiteko beharrezko exekuzio-denbora duela.

3. urratsa: instalatu Power Platform tresnak

Codespaces terminaletik:

  1. Instalatu Power Platform tresnak (VS Code-ren luzapen gisa eskuragarri).
  2. Instalazio honek PAC CLI ere ekartzen du, guneak autentifikatu, deskargatu eta kargatzeko aukera ematen duen komando-lerroko interfazea.

4. urratsa: Konektatu zure Power Platform ingurunera

Erabili PAC CLI helburuko ingurunean autentifikatzeko:

pac auth create -u https://org12x34x45.crm.dynamics.com

Ordeztu URLa Power Platform ingurunearen benetako URLarekin.

5. urratsa: Eraiki zure webgunea

Zabaldu aurretik, eraiki zure webgunearen kodea:

npm run build

Komando honek zure gunea konpilatzen du eta artefaktuak karpeta batean dist irteten ditu.

6. urratsa: Igo zure webgunea

Zabaldu zure gunea Power Pages ingurunean, honako hau erabiliz:

pac pages upload-code-site --rootPath "./spark-template" --compiledPath "./dist" --siteName "YourSiteName"

Parametroak

Parametroa Aliasa Deskribapenak
--rootPath -rp Zure gunearen iturburu fitxategiak dituen tokiko karpeta
--compiledPath -cp Konpilatutako aktiboetarako bidea, React bezala build
--siteName -sn Zure gunearen bistaratzeko izena Power Pages

7. urratsa: Berriro aktibatu eta probatu

  1. Igo ondoren, zure webgunea Power Pages-ekoGune inaktiboak atalean agertzen da.
  2. Joan Gune inaktiboetara, bilatu zure gunea eta hautatu Aktibatu.
  3. Gunea aktibatzen denean, ireki bere URLa hedapena baieztatzeko.

Hurrengo urratsak: Babestu eta zabaldu zure webgunea

Zure webgunea martxan dagoenean: