Deploying SPFx Apps Using Azure DevOps

In this Microsoft YouTube video, they unravel the process of deploying SharePoint Framework (SPFx) applications using Azure DevOps Pipelines. The video provides a step-by-step guide to the deployment process, illustrating the advantages of using Azure DevOps Pipelines in simplifying application rollout across different environments.

The guide begins by depicting the pre-requisites needed for the deployment process. Specifically, they highlight the need for a SharePoint tenant and Azure DevOps project. They emphasize on the requirement for suitable permissions for both resources. The video proceeds to outline the process of creating SPFx webparts and deploying them on SharePoint.

The next section of the video provides a walkthrough on setting up an Azure DevOps pipeline for the SPFx Apps. It demonstrates how the pipeline can automate and streamline the deployment process. The video gives a clear picture of how SPFx applications are built, bundled, and packaged within the pipeline.

In this guide, the video digs into the YAML pipelines, illustrating the need for classic pipelines particularly for beginners and how YAML pipelines can be used as one matures in this space. Thereby, applying both methods to leverage their benefits as per the project requirements.

The video concludes by showing the deployment of the packaged SPFx app onto SharePoint. This incorporates using the Azure CLI, executed within the Azure DevOps Pipeline, and furnishes the viewers with practical experience of the deployment process.

For more information on Microsoft's <a href="https://www.hubsite365.com/en-ww/pro-office-365/?id=dfae8889-9a69-ee11-9ae7-000d3a2891f5&topic=8904d497-c2da-ec11-bb3d-000d3a4860eb&theater=true">Developer Tools</a>, kindly visit their official page.

More On Azure DevOps Pipelines and SPFx Apps

Azure DevOps Pipelines by Microsoft is a cloud service that lets developers set up continuous integration and delivery pipelines for SPFx Apps. This service compiles code, runs tests, and facilitates deployment to various environments smoothly and reliably. The SharePoint Framework (SPFx) is a page-and-part model that enables client-side development for building SharePoint experiences. Together, they empower developers to create, test, and deploy SharePoint applications in a straightforward, efficient manner.

Read the full article SPFx Apps Deployment Guide with Azure DevOps Pipelines

Learn about SPFx Apps Deployment Guide with Azure DevOps Pipelines

This article dives deep into a YouTube video showcasing the deployment of SharePoint Framework (SPFx) apps using the Azure DevOps pipelines. If you're a developer or an individual in software development operations, interested in automating your deployment systems, then this is for you.

Before diving into the content, ascertain that you're familiar with both GitHub and Azure DevOps as they are vital to understanding Continuous Integration/Continuous Deployment (CI/CD) pipelines—all at the end of making software release processes predictable and less monotonous.

• Part 1: Deploying SPFx apps with Azure DevOps pipelines (Classic variant)
• Part 2: Deploying SPFx apps with Azure DevOps pipelines (all YAML variant)

Key to note is that we are deploying a SharePoint Framework application using multiple stages and deployments to multiple environments coupled with approval in between.

Firstly, we set up authentication to SharePoint using the Entra ID Application Registration via the client credentials grant flow with a certificate.

Once we've done that, we move to define some variables and upload certificates to Azure DevOps. Our Azure DevOps project pipeline has a Library where we add the variables and the PFX-files of the certificates. This makes it easy for the Pipeline to use them.

Still, on the Azure DevOps project, define the environments your Pipeline will use on the Pipelines > Environments page. Create two environments, one for acceptance and one for production. Utilize 'Approvals and checks' to configure the approval system from the details page of the production environment—this allows us to pause the pipeline and approve releases before going to production.

With our build & release pipeline ready, we can now create the pipeline. We do this by including a yaml-code file in our SPFx application repository. The code is a pipeline definition, written in YAML, containing multiple stages and multiple tasks to bundle and package and deploy the app.

The essence of this process is the CLI for Microsoft 365 script used to deploy the app. It's short and specific. It signs in using our Entra ID app and certificate that has been downloaded to the agent, configures SharePoint root-URL then uploads the app to the app catalog before deploying and upgrading it on the site.

Commits to the repository triggers the pipeline and runs the code for the first time. Give the Pipeline permission to use the certificates you downloaded, and the environments you're publishing. Upon successful configuration, the pipeline will automatically deploy the app after a successful build is run. Any extra stages will be deployed after approving them to do so. No more tedious steps in deploying those minor edits in your code!

Beneficial resources include:

• Microsoft Docs - Azure DevOps Pipelines key concepts
• CLI for Microsoft 365 - Logging into your tenant, Setting the URL, Adding an app, Deploying an app and Upgrading an app

Happy Coding!

More links on about SPFx Apps Deployment Guide with Azure DevOps Pipelines

Deploying SPFx apps with Azure DevOps pipelines (Classic ...

Aug 14, 2023 — In this blog post I will show you how you can deploy SPFx apps using Azure DevOps pipelines with a classic release pipeline.

Deploying SPFx apps with Azure DevOps pipelines (all YAML ...

Aug 16, 2023 — In this blog post I will show you how you can deploy SPFx apps using Azure DevOps pipelines with an all YAML build & release definition.

Implement Continuous Integration and ...

Jun 28, 2022 — Streamlining the build and deployment process by automating manual steps using Azure Pipelines. SharePoint Framework v1.17.2 release notes.

Keywords

SPFx Apps Deployment, Azure DevOps Pipelines, SharePoint Online, SharePoint framework, Continuous Integration, Continuous Deployment, Azure Pipeline Setup, DevOps Guide, Microsoft Azure Tutorial, SPFx DevOps Integration