Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Microsoft

Azure Static Web Apps

Microsoft via Microsoft Learn

Overview

  • Module 1: Publish an Angular, React, Svelte, or Vue JavaScript app with Azure Static Web Apps. Use Visual Studio Code to create and run the web app locally.
  • In this module, you will:

    • Choose an existing web app project with either Angular, React, Svelte or Vue
    • Run the application locally
    • Publish the app to Azure Static Web Apps
  • Module 2: Publish an Angular, React, Svelte, or Vue JavaScript app and API with Azure Static Web Apps and Azure Functions. Deploy your code from GitHub to a staging site using preview URLs.
  • In this module, you will:

    • Choose an existing web app project with either Angular, React, Svelte or Vue
    • Create an API for the app with Azure Functions
    • Run the application locally
    • Publish the app to Azure Static Web Apps
    • Publish the app and its API to Azure Static Web Apps to a staging site
  • Module 3: Publish an Angular, React, Svelte, or Vue JavaScript app with API and authentication using Azure Static Web Apps and Azure Functions. Deploy your code from GitHub to a staging site using preview URLs.
  • In this module, you will:

    • Choose an existing web app project with either Angular, React, Svelte or Vue
    • Publish the app and its API to Azure Static Web Apps
    • Integrate user authentication in an existing web app
    • Block unauthenticated users and allow only specific authentication providers
  • Module 4: Publish a Blazor WebAssembly app and .NET API with Azure Static Web Apps
  • In this module, you will:

    • Clone and run an existing Blazor web app locally
    • Create an API for the app with Azure Functions
    • Publish the app and its API to Azure Static Web Apps
  • Module 5: Use Gatsby and React to develop a static web app, then deploy it to the web with Azure Static Web Apps.
  • In this module, you will:

    • Use Gatsby to create a static web app
    • Add data to a page in the app with a GraphQL query
    • Deploy your app to the web with Azure Static Web Apps

Syllabus

  • Module 1: Publish an Angular, React, Svelte, or Vue JavaScript app with Azure Static Web Apps
    • Introduction
    • Exercise - Get started
    • Plan your Azure Static Web App
    • Exercise - Create an Azure Static Web App
    • Summary
  • Module 2: Publish an API to Azure Static Web Apps
    • Introduction
    • Exercise - Get started
    • Build an API with Azure Functions
    • Exercise - Create an Azure Functions project
    • Publish the API with GitHub Actions
    • Exercise - Publish the API with GitHub Actions
    • Knowledge check
    • Summary
  • Module 3: Authenticate users with Azure Static Web Apps
    • Introduction
    • Exercise - Get started
    • Manage authentication in Static Web Apps
    • Exercise - Add user authentication
    • Configure access for providers and roles
    • Exercise - Configure authentication providers and access
    • Summary
  • Module 4: Publish a Blazor WebAssembly app and .NET API with Azure Static Web Apps
    • Introduction
    • Exercise - Get started
    • Plan your Azure Static Web App
    • Exercise - Create an Azure Static Web App
    • Configure fallback routes
    • Exercise - Create your fallback routes
    • Build an API with Azure Functions
    • Exercise - Create an Azure Functions project
    • Publish the API with GitHub Actions
    • Exercise - Publish the API with GitHub Actions
    • Knowledge check
    • Summary
  • Module 5: Create and publish a static web app with Gatsby and Azure Static Web Apps
    • Introduction
    • Create a static app with Gatsby
    • Exercise - Create a static app with Gatsby
    • Add data to your Gatsby app
    • Exercise - Add data to your Gatsby app
    • Build and deploy to Azure Static Web Apps
    • Exercise - Build and deploy to Azure Static Web Apps
    • Knowledge check
    • Summary

Reviews

Start your review of Azure Static Web Apps

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.