Configure a pipeline and push updates (preview)

In this article, you'll push Todo Application with Node.js and Azure Cosmos DB for MongoDB template changes through GitHub Actions or Azure DevOps via Azure Developer CLI (azd). However, you can apply the principles you learn in this article to any of the Azure Developer CLI templates.

Prerequisites

All templates include a default GitHub Actions and Azure DevOps pipeline configuration file called azure-dev.yml. This configuration file provisions your Azure resources and deploy your code to the main branch. You can find azure-dev.yml:

  • For GitHub Actions: in the .github/workflow directory.
  • For Azure DevOps: in the azdo/pipeline directory.

You can use the configuration file as-is or modify it to suit your needs.

Select your preferred pipeline provider to continue:

Authorize GitHub to deploy to Azure

To configure the workflow, you need to give GitHub permission to deploy to Azure on your behalf. Authorize GitHub by creating an Azure service principal stored in a GitHub secret named AZURE_CREDENTIALS.

  1. Run the following command to create the Azure service principal and configure the pipeline:

    azd pipeline config
    

    This command also creates a private GitHub repository and pushes code to the new repo.

    Note

    By default, azd pipeline config uses OpenID Connect (OIDC), called federated credentials. If you'd rather not use OIDC, run azd pipeline config --auth-type client-credentials.

    OIDC/federated credentials are not supported for Terraform.

    Learn more about OIDC support in azd.

  2. Supply the requested GitHub information.

  3. When prompted about committing and pushing your local changes to start a new GitHub Actions run, specify y.

  4. In the terminal window, view the results of the azd pipeline config command. The azd pipeline config command will output the GitHub repository name for your project.

  5. Using your browser, open the GitHub repository for your project.

  6. Select Actions to see the workflow running.

    Screenshot of GitHub workflow running.

Make and push a code change

  1. In the project's /src/web/src/layout directory, open header.tsx.

  2. Locate the line <Text variant="xLarge">ToDo</Text>.

  3. Change the literal ToDo to myTodo.

  4. Save the file.

  5. Commit your change. Committing the change starts the GitHub Action pipeline to deploy the update.

    Screenshot of steps required to make and commit change to test file.

  6. Using your browser, open your project's GitHub repository to see both:

    • Your commit
    • The commit from GitHub Actions being set up.

    Screenshot of your committed change in GitHub.

  7. Select Actions to see the test update reflected in the workflow.

    Screenshot of GitHub workflow running after test update.

  8. Visit the web frontend URL to inspect the update.

Clean up resources

When you no longer need the Azure resources created in this article, run the following command:

azd down

Next steps