Blog

DevOps - Quickstart guide to setting up DevOps and enabling multiple app builders to simultaneously edit canvas apps

Do you want to enable multiple app builders to work on the same canvas app by using a Git repro hosted in DevOps? If you've never done this before, here's a quick guide to main steps that are needed to setup DevOps.

Power Apps supports the simultaneous editing of a canvas app by multiple app builders by connecting the app to Git.

The two most popular Git hosts are Github and Microsoft DevOps. Compared to Github, DevOps offers better features for those working within an organisation, particularly in the areas of project management and collaboration with 'fusion' teams.

The use of Github is well documented, so this post focuses on DevOps. Specifically, it covers how to set up DevOps and where to find the settings that are needed to connect a canvas app to Git.

First Step - Register an Azure Account

The first step is to create a Microsoft Azure Account through the following URL.

https://azure.microsoft.com/en-gb/free

Each organisation/tenant is entitled to 5 free DevOps licenses. What I recommend is to also register with the 'Visual Studio Dev Essentials program as that offers many additional free benefits.

https://visualstudio.microsoft.com/dev-essentials/


Step 2 - Set up DevOps

To setup Azure DevOps, visit the DevOps portal and create a new organization.

  
From the new organisation, we then create a new project. For this post, our project is called 'PowerApps Project'.



Managing the Git Repro in DevOps

The process of creating a project automatically creates a Git repro. We can manage this through the Repros menu in the left hand menu, as shown in the screenshot beneath.


There are 2 sections to note when setting up a repro for the first time. These are:

  • Initialize main branch with a README or gitignore
  • Clone to your computer - Generate Git Credentials

The repro requires a branch - the quickest way to do this is to click the 'Initialze' button in the 'Initialize main branch with a README or gitignore' section.

To connect to the repro from Power Apps, we need a 'personal access token'. Click the 'Generate Git Credentials' button to generate a username/password, as shown below.


It's really important to copy/make a note of the password because once we leave this page, it isn't possible to retrieve the password.

If a password becomes compromised, we should revoke it to help keep your repro secure. We can do this through the 'User settings' > 'Personal Access token' section shown below. We can also use this menu item to create further sets of credentials.


Setting up additional DevOps Users

The main purpose of Git is to support multiple app builders, so a key step is to enable access for additional users. The place to add additional users is through the 'Organization Settings' > Users menu.

To enable users to access the Git repro, the Access level must be 'Basic' or above. Stakeholder access does not provide sufficient permissions to access the repro.  
 


Connecting a Power App canvas app to a DevOps Git Repro

At this point, we can connect a new or an existing app to the repro in DevOps. Here's how to add an existing app to our repro.

In Power Apps, the first step is to enable the 'Show the Git version control setting' option in the settings of the app.


Enabling this setting reveals the 'Git version control' panel (shown beneath). Here, there are 3 values that we need to set:



These 3 values are:

  • 1 - Git repository URL
    We set this to the URL of the Git repro. We can determine this by navigating to the main repro page in the browser and copying the URL, or we can click the 'Clone' button to reveal a panel that contains the URL and a button to copy the URL to the clipboard.


  • 2 - Branch
    Here, we specify a branch name. Because, we initialized a 'main' branch, 'main' is the value that we enter here

    .

  • 3 - Folder
    When we connect an app to Git, Power Apps adds the files to a folder in the repro. For this example, we specify a new folder called 'AssetCheckoutApp'.

Authenticating to Git from Power Apps

After we enter the Git repro URL, branch and folder values, the next step prompts us to enter a Username and 'Personal access token'. These credentials correspond to the credentials that were generated through the 'Generate Git Credentials' button mentioned earlier in this post.




Because we specified a non-existent Git folder called 'AssetCheckoutApp', we need to confirm that we want to create a new folder.

Working with an app that's connected to Git

If the process succeeds, our app will now be connected to Git. If we now inspect our Git repro, we'll see the .json and .yaml files that make up the canvas app.


From Power Apps, we can now make changes to our app and click the refresh button to commit our changes to the Git repro, and to update our app with changes that other app builders have committed.

Conclusion

By connecting a canvas app to a Git repro, multiple app builders can edit an app at the same time. This post walked through the steps to setup DevOps and the settings that are needed to connect a canvas app to a Git repro hosted in DevOps.