Gyakorlat – Első lépések

  • 3 perc

Az Azure Static Web Apps egy GitHub-adattárból származó alkalmazások létrehozásával tesz közzé webhelyeket egy éles környezetben. Ebben a gyakorlatban egy GitHub-adattárból hoz létre egy webalkalmazást a Blazor használatával.

Adattár létrehozása

Ez a modul megkönnyíti egy új adattár létrehozását egy GitHub-sablontárház használatával. Elérhető egy sablon, amely egy Blazorból készült kezdőalkalmazást tartalmaz.

  1. Nyissa meg a sablontár sablonlapjáról való létrehozást.

    • Ha 404 Az oldal nem található hibaüzenet jelenik meg, jelentkezzen be a GitHubra, és próbálkozzon újra.

  2. Ha a rendszer a Tulajdonos megadását kéri, válasszon ki egy saját GitHub-fiókot.

  3. Nevezze el az adattárat a my-static-blazor-appnak.

  4. Az Azure Static Web Apps nyilvános és privát adattárakat is támogat. Ebben a gyakorlatban válassza a Privát lehetőséget láthatóságként.

  5. Válassza a Create repository (Adattár létrehozása) gombot.

Futtassa az alkalmazást

Ezzel létrehozott egy my-static-blazor-app nevű GitHub-adattárat a GitHub-fiókjában. Ezután klónozza az adattárat, és helyileg futtatja a kódot a számítógépen.

  1. A GitHub-adattárban válassza a Kód, majd a Megnyitás a Visual Studióval lehetőséget a menüben. Ez a parancssor arra kéri, hogy indítsa el a Visual Studiót, és klónozza az adattárat a gépére.

    • Ha a Visual Studio több verziója is telepítve van, győződjön meg arról, hogy az alkalmazás meg van nyitva a Visual Studio 2022-ben vagy újabb verziójában.

  2. Nyissa meg a ShoppingList.sln megoldásfájlt.

    Screenshot showing where to open the shopping list solution.

  3. Végül futtassa az előtérbeli ügyfélalkalmazást úgy, hogy kiválasztja az Ügyfelet az indítási projektként, és elindítja a hibakeresőt.

    Screenshot showing the client project selected.

Az alkalmazás megnyitása a böngészőben

Itt az ideje, hogy megtekintse a helyileg futó alkalmazást. A Visual Studio megnyitja a webhelyet az alapértelmezett böngészőben.

Screenshot showing the UI of your web app.

Az alkalmazásnak azt kell mondania, hogy adatok betöltése ... mert még nincs adat vagy API. A modul későbbi részében hozzáadja a webalkalmazás API-ját.

Most állítsa le a futó alkalmazást úgy, hogy befejezi a hibakeresési munkamenetet a Visual Studióban.

Következő lépések

Létrehozta az alkalmazást, és az most már helyileg fut a böngészőben.

Ezután közzéteszi az alkalmazást az Azure Static Web Appsben.