Skip to content

Latest commit

 

History

History
804 lines (541 loc) · 39.6 KB

00-full-development-setup-instructions.md

File metadata and controls

804 lines (541 loc) · 39.6 KB

Contoso Real Estate Development Environment Full Setup

These instructions guide you through setup, building, and deploying the Contoso Real Estate Solutions. These instructions assume that:

  1. You are using a Microsoft Windows 11 workstation with Administrative rights to install programs.
  2. You have access to an Azure Subscription with a user that has Entra ID administration rights.
  3. Your Power Platform tenant is in the same directory as your Azure Subscription.

✅Install Visual Studio Community

  1. Navigate to Download Visual Studio Tools - Install Free for Windows, Mac, Linux (microsoft.com) and select Community -> Free Download
  2. Open the downloaded VisualStudioSetup.exe and follow the instructions.
  3. On the Workloads tab, select:
    • ASP.NET and web development
    • Azure development
    • Data storage and processing
  4. On the Individual components tab, ensure the following are selected and add if required:
    • .NET 8.0 Runtime (Long Term Support)
    • .NET 6.0 Runtime (Long Term Support)
    • .NET Aspire SDK
    • .NET Framework 4.6.2 SDK
    • .NET Framework 4.6.2 targeting pack
    • .NET Framework 4.7.2 SDK
    • .NET Framework 4.7.2 targeting pack
    • .NET Framework 4.8 SDK
    • .NET Framework 4.8 targeting pack
    • .NET SDK
    • Windows 11 SDK (10.0.22621.0)
  5. Select Install
  6. Wait for the install to complete.
  7. When prompted to Sign in to Visual Studio, sign in with your Microsoft account if you have one, or select Skip this for now
  8. Choose your theme (dark is used in these instructions), and select Start.
  9. Close the Visual Studio installer window.

Tip

If you already have Visual Studio installed you can check the Workloads, and Individual components and add any missing by running the Visual Studio Installer from your start menu.

✅Install VSCode

  1. Navigate to Download Visual Studio Code - Mac, Linux, Windows and select Windows
  2. Open the downloaded VSCodeUserSetup-x64-...exe
  3. If you get the message "This User Installer is not meant to be run as an Administrator.", Select OK.
  4. Select I accept the agreement -> Next.
  5. Accept the default location -> Next.
  6. Accept the default Start Menu name -> Next.
  7. Select both of the Add "Open with Code" checkboxes -> Next -> Install.
  8. Select Finish once completed
  9. Open VSCode from the start menu.
  10. Select your theme. Dark Modern is used for these instructions.

✅Install Git for windows

  1. Navigate to Git - Downloads (git-scm.com) and select Windows
  2. Select Click here to download
  3. Open the downloaded Git installer exe.
  4. Select Next.
  5. Accept the default folder location -> Next.
  6. Select Add a Git Bash Profile to Windows Terminal -> Next.
  7. Accept the default start menu folder -> Next.
  8. In the dropdown select Use Visual Studio Code as Git's default editor -> Next.
  9. Leave the default Let Git decide -> Next .
  10. Leave the default Git from the command line and also from 3rd-party software -> Next.
  11. Leave the default Use bundled OpenSSH -> Next.
  12. Leave the default Use the OpenSSL Library -> Next.
  13. Leave the default Checkout Windows-style, commit Unix-style line endings -> Next.
  14. Leave the default Use MinTTY -> Next.
  15. Leave the default Fast-forward or merge -> Next.
  16. Leave the default Git Credential Manager -> Next.
  17. Leave the default Enable file system caching -> Next.
  18. Leave Enable experimental support for pseudo consoles unchecked -> Install.
  19. Select Finish once installed.

✅Install the Git CLI

  1. Navigate to GitHub CLI | Take GitHub to the command line
  2. Select Download for Windows
  3. Open the downloaded msi.
  4. Select Next -> Next-> Install.
  5. Select Finish once installed.

✅Install Azure CLI

The Azure CLI (az) is used to perform operations on Azure. The official instructions on installing can be found at Install the Azure CLI for Windows | Microsoft Learn

  1. Download the latest x64 installer from Install the Azure CLI for Windows | Microsoft Learn
  2. Run the downloaded installer.
  3. Alternatively, you can open a terminal using Windows Key + X and select Terminal (Admin)
  4. Then use the following command to install the Azure CLI
 $ProgressPreference = 'SilentlyContinue'; Invoke-WebRequest -Uri https://aka.ms/installazurecliwindows -OutFile .\AzureCLI.msi; Start-Process msiexec.exe -Wait -ArgumentList '/I AzureCLI.msi /quiet'; Remove-Item .\AzureCLI.msi

Note

The installation may take a few minutes.

✅Install Node

The TypeScript components require node to be installed so that they have access to the node run time and the node package manager (npm).

  1. Navigate to Node.js — Download Node.js® (nodejs.org)
  2. Select the Prebuilt installer tab and Download Node.js
  3. Run the downloaded installer.
  4. Select Next
  5. Accept the agrement - > Next
  6. Accept the default file path -> Next
  7. Accept the defaults -> Next
  8. Check 'Automatically install the necessary tools'
  9. Select Next -> Install
  10. Select Finish
  11. The Install Additional Tools dialog will popup, press any key to continue.
  12. Various packages will be installed automatically.

✅Create a GitHub account

For this workshop, we are going to be using a GitHub personal account. If you already have a GitHub personal account, you can skip this task and simply login to GitHub.

  1. Open GitHub in the browser session using the profile you created above.
  2. Click on Sign up on the top right corner.
  3. Enter your email address (Use a personal email address. Do not use your work address or the workshop account) and then click Continue.
  4. Create a password and then click Continue.
  5. Enter a username and then click Continue.
  6. Select whether you want to receive product updates or not and then click Continue.
  7. Solve the puzzle to verify your account and then click Create account.
  8. Enter the code that was sent to your email address and then when you've navigated to the welcome screen, click Skip personalization.

You now have a GitHub account - ensure you are logged in as your GitHub account in the browser profile that you created earlier.

✅Create a new browser profile (Microsoft Edge)

It's always good to have a separate browser profile for your work and for workshops like this. This way you can keep all of your credentials separate and not have to worry about logging out of your personal / work accounts.

  1. Open Microsoft Edge.

  2. Click on the profile icon (this may be on the top left or top right corner).

  3. It the bottom of the profile list, hover over Other profiles and then select Set up new work profile. If there are no existing profiles, simply select Add new account -> Sign in to sync data. Other Profiles

Important

Select Set up new work profile not Set up new personal profile

  1. Click Add.

    This will then open up a new browser window on your taskbar.

  2. In the new browser window, select Start without your data.

  3. Select either Allow or Don't allow, and then select Confirm and start browsing.

    Edge may prompt you to configure your new browser theme. If this happens, select System default, Light or Dark and select Next.

Note

All the screenshots in these labs are using Dark mode.

  1. Select Finish.

Important

Re-open these labs inside the new browser profile window so that any links will open in the correct profile.

✅Log in to Power Apps

Using the new browser profile, log into to Power Apps.

  1. In the new browser profile, navigate to make.powerapps.com

Important

Make sure you use the new browser profile, instead of an existing profile.

  1. Sign in if you are prompted to do so.

  2. If you're prompted to stay signed in, check Don't show this again, and select Yes.

  3. If asked to choose your region, select United States and select Get started.

    You should now be logged in and on the Power Apps Home Page.

✅Create a developer environment

For this workshop, you will need a Dataverse environment. You can create up to 3 of these for free. Developer environments will be deleted after a period of inactivity.

👉Subscribing to the developer plan

You are required to subscribe to the Power Apps Developer Plan to create developer environments that gives you access to all of the Power Platform resources for development purposes.

To create developer environments, you can create them in multiple ways:

  1. Subscribing to the Power Apps Developer Plan.
  2. Using the Power Platform Admin Center (PPAC)
  3. Using the Power Platform CLI

In this workshop we will use option 1 because it will automatically assign a developer license to yourself, where as the other options do not.

  1. Go to the Power Apps Developer Plan page (use the Edge profile you created for this workshop).
  2. Select Try for Free.
  3. Enter your username and check the Agree checkbox.- > Select Start free.
  4. Leave the country as United States and select the Accept button.
  5. After selecting Accept, a Power Platform developer environment will be created for you with the name [User Name]'s Environment. You will then be redirected to the maker portal.

👉Create developer environments

2 developer environments are required for the sample.

  1. Open the Power Platform admin center https://admin.powerplatform.microsoft.com/
  2. Select Environments in the left hand menu
  3. Select New, and enter CRE Core Dev (your name)
  4. Choose United States as the region.
  5. Select Developer as the Type.
    New Environment 1
  6. Select Next
  7. Select English (United States), and USD($).
    Add Dataverse
  8. Select Save.
  9. Wait for the environment to show as Ready
  10. Select the environment.
  11. Select Resources -> Dynamics 365 apps.
  12. Where Update available is shown, select the link.
  13. Check I agree to the terms of service.
  14. Select Update.
  15. Repeat for all updates.
  16. In the Dynamics 365 apps area, select Open App Source.
  17. Search for Dataverse Accelerator
  18. Select Get it now on the Dataverse Accelerator Card, and Get it now again
  19. Select your development environment, and check 'I agree' to the two checkboxes.
  20. Select Install.
  21. Repeat to create an environment named CRE Portal Dev (your name).
  22. Wait until the updates are installed in both environments.

✅Fork the Repo

  1. Inside GitHub, navigate to the main page of the repository.

  2. In the top-right corner of the page, click Fork.

  3. Select your own account for the Owner of the forked repository.

  4. Select Create fork.

  5. On GitHub, navigate to your fork of the repository.

  6. Open your new fork of the repo and select, select Code.

  7. Select the copy icon next to the GitHub CLI command. Clone Repo

  8. Open a new instance of VSCode and press Ctrl+Shift+` to open a terminal window. This should default to PowerShell.

  9. Change the current working directory to the location where you want the cloned directory.

    cd C:\repos

  10. Authorize with GitHub using:

    gh auth login

  11. Select the defaults GitHub.com, HTTPS, Login with a web browser

  12. Copy the one-time code and press Enter.

  13. In the popup browser authentication window, follow the instructions to select your account and paste the one-time code.

  14. Select Authorize GitHub when prompted.

  15. Close the browser tab and return to VSCode.

  16. Paste the gh cli command you copied in a previous step.

    git clone https://github.com/YOUR-USERNAME/YOUR-FORKED-REPO.git

  17. Open the repo using:

    cd contoso-real-estate-power
code . -r

  18. Select Yes, I trust the authors when prompted.

✅Install VSCode extensions

  1. The repo has a set of recommended extensions.

  2. Select the Extensions item from the Activity Bar on the left

  3. Under the RECOMMENDED section, select Install for the following extensions:

    1. Power Platform Tools

    2. Bicep

    3. ESLint

    4. GitHub Actions

    5. Jest Runner

    6. PowerShell

    7. Azure Tools

      Recommended Extensions

👉Authorize the PAC CLI

  1. Run the following command at the terminal inside VSCode:

    pac auth create

Note

If you see an error then close any existing terminals and open a new one using Ctrl+Shift+`

  1. Login with your Power Platform environment developer account that you used previously to create your developer environments.

  2. If you see a Pick an account screen, select your workshop user which should say Signed In next to it.

  3. You will then see a page asking if you're trying to sign in to Power Platform CLI - pac.

  4. The Code space terminal should show the message Authentication profile created showing the workshop user you were provided.
    Auth Profile

  5. At the terminal type pac auth list. You will see the new auth profile with an asterisk (*) next to it indicating that it is the currently selected profile. The profiles is created as UNIVERSAL meaning that it is not specific to any specific environment.

  6. To select our developer environment, expand the Power Platform left panel. If you do not see the UNIVERSAL profile, hover over the AUTH PROFILES area and select Refresh.

Tip

If you do not see the power platform extension logo as in the screenshot below, press Ctrl + Shift + P, and then type Developer: Reload Window and press ENTER.

  1. To select our developer environment, use the Star icon Select Environment. The Environment then should have a filled star next to it.
    Select Environment

  2. If you now run pac auth list you will see the URL of the environment you have selected listed. The asterisk (*) indicates that this is the currently selected auth profiles if you have multiple different profiles for different tenants. You can switch using pac auth select --index

Tip

You can also select an environment by using pac org select --environment <URL/ID/Unique Name/Partial Name>

  1. To ensure that you are connected to the correct environment, at the terminal type pac org who This will show the current connection and environment selected.

Who

✅Deploy Azure Resources

The Contoso Real Estate (Power Platform Edition) project utilizes several Azure components to enable its functionality. These components include:

  1. Payments API Azure Functions - This component is used to host the payments api that is used by:
    • Power Platform Custom Connector to create a Stripe Checkout session that is called by the portal using a Power Automate Flow. This is used for listing reservations.
    • Power Platform Custom Connector to list Payments
    • Dataverse Virtual Table Provider C# Plugin to expose the Payments as a Dataverse Virtual Table
    • Webhook that is called by Stripe when payments events are raised
  2. Azure SQL Database - Stores the payments made via Stripe
  3. Azure Key Vault - Used to store all secrets that are necessary and is configured as the backing for Power Platform Environment Variable secrets.
    • AZURE-SQL-CONNECTION-STRING-payments-api - SQL connection string for the Payments database. This does not contain any login username or password because the Azure Function uses a Managed Identity to connect to the database. E.g. Server=tcp:sql-***.database.windows.net,1433;Initial Catalog=contoso-real-estate;. Learn about Managed Identities in Azure Functions
    • cre-..-development-payments-api-client-secret- Custom Connector Client Secret that is referenced by the Power Platform Environment Variable Secret and used in the custom connectors.
    • StripeApiKey - The Stripe API key to use for payment processing
    • StripeWebhookSecret - The Stripe webhook secret to use for verifying webhook events
  4. Entra ID Application registrations used to authenticate Power Platform against the Payments API

🦾Deploying Azure Resources

To deploy the Azure resources required for the Contoso Real Estate (Power Platform Edition) project, you can use the azd up command. This command is part of the Azure DevOps CLI extension and allows you to define and manage your infrastructure as code.

Here are the steps to deploy the Azure resources using azd up:

  1. Open a PowerShell terminal window inside VSCode at the root of the cloned repo.

  2. Ensure the Azure CLI by following the instructions provided in the official Azure CLI documentation for your operating system. You can check the installation using at the VSCode powershell terminal:

    az version

  3. Log in to your Azure account by running the following command and following the prompts:

    az login --use-device-code

    Copy the code shown, open the browser profile window you created, and navigate to https://microsoft.com/devicelogin.

    Enter the code and select Next. Select your login and select Continue. Close the browser window once you have signed in.

Note

If you have multiple tenants, you may need to also provide the --tenant parameter.

  1. After successfully logging in, select the subscription you would like to deploy into.

    If you have previously logged in, you can view the subscriptions and select one using:

    az account list --output table
az account set --subscription <Subscription Id you wish to use>

  2. You must be a member of the User Access Administrator and Key Vault Administrator on your subscription to manage the access control on a key vault.

    # Set the subscription and user principal name
$subscriptionId = az account show --query id --output tsv
$currentUPN = az ad signed-in-user show --query userPrincipalName

# Find the roles of the current user for the currently selected subscription
az role assignment list --query "[?principalName=='$currentUPN' && scope=='/subscriptions/$subscriptionId'].roleDefinitionName" --output table

    If you do not see the two roles Key Vault Administrator and User Access Administrator, then use the following:

    # Assign the "Key Vault Administrator" and "User Access Administrator" role to the user
az role assignment create --role "Key Vault Administrator" --assignee $currentUPN --scope /subscriptions/$subscriptionId
az role assignment create --role "User Access Administrator" --assignee $currentUPN --scope /subscriptions/$subscriptionId
az role assignment create --role "Key Vault Secrets User" --assignee $currentUPN --scope /subscriptions/$subscriptionId

  3. The Power Platform Resource Provider must be registered in your Azure subscription so that Dataverse can access Azure Key Vaults in that subscription. At the VSCode PowerShell terminal, use:

    az provider register -n Microsoft.PowerPlatform
az provider show -n Microsoft.PowerPlatform --query "registrationState"

    Registration will take a few minutes.

  4. Ensure your terminal has the repo root as the current directory.

  5. Install the Azure DevOps CLI extension by running the following command:

    infra\azd\install-azd.ps1

Note

You must close and re-open all instances of VSCode. Use azd version at the VSCode terminal to ensure you have azd installed.

  1. Install bicep using:

    az bicep install

Note

Check you have the latest version of Bicep (>= 0.29.47) installed using az bicep version. Bicep is located in your azd bin folder %USERPROFILE%\.azd\bin

  1. Run the azd up command to start the deployment process:

    az extension add --name graphservices
azd up --environment development

    The environment parameter would normally be the environment that is being deployed to e.g. elaiza-dev1 UAT PROD

  2. When asked if you want to create the Environment, press 'Y'.

  3. Select the Subscription to use when prompted.

  4. Select the location to use - e.g. Central US

Important

When selecting a Azure location to deploy into, avoid using WEST US 2 due to there often being resource capacity limitations.

  1. When prompted for the 'principalLoginName' infrastructure parameter, enter your Power Platform username e.g. [email protected]. This will be stored in a file called .azure/<environmentname>/config.json. It is important to ensure that this user name is the one you have authenticated against Azure with. It will be used to set the administrator of the SQL Server.

Note

If you want to deploy updates to the code later on after the infrastructure has been published you can use azd deploy

  1. Monitor the deployment progress and check for any errors or warnings. The azd up command will provide detailed logs and feedback during the deployment process.

Note

You may need to run azd up a second time if there are errors the first time (due to azure replication)

azd up

📜Post deployment steps

Some settings cannot be performed by Bicep/ARM scripts (or are complex and beyond the scope of this sample). To complete the deployment the following tasks must be carried out:

  • Grant the Azure Function Payment API managed identity access to SQL Server. The Azure Functions run under a System Assigned Managed Identity (SAMI). This identity must be added to the SQL Server as an external user. This cannot be performed by a SQL Login (inside the bicep script), because it needs access to Entra ID.
  • Add admin consent to the Payment API client Entra ID Application registration, so that it can be used as an SPN connection in Power Platform
  • Grant your user access to the Payment API so that it can be used as an OAuth user connection in Power Platform for testing.

To perform the post deployment:

  1. You will need a stripe account for the payment API to function. You do not need a production account, a developer test account is created for free.

  2. Navigate to Sign Up and Create a Stripe Account | Stripe

  3. Enter you Email, Name, Country, and Password.

  4. Select Create account.

  5. Validate your email address by following the instructions.

  6. Navigate to https://dashboard.stripe.com/test/dashboard

  7. Run the following and follow the instructions carefully:

./infra/scripts/post-deployment-setup.ps1

Enter the environment that you deployed using azd. If you have deployed multiple times with different names, then you must pick the one you are setting up.

✅Deploying Core Development Solution

The Core development environment has the custom controls solution deployed as managed, and the Core solution deployed as unmanaged to enable it to be worked on.

  1. Using the Power Platform Developer Tools in VSCode, select the environment you wish to deploy to. You can see which environment you currently have selected by using:

    pac env who

  2. Inside VSCode, drag the script located at src\core\solution\deployment-scripts\1-deploy-to-development-environment.ps1 into the PowerShell terminal window, and press Enter to execute it

  3. Follow the instructions when running the script carefully. You will need to select the Azure environment that you deployed using azd up, then download the latest ContosoRealEstateCustomControls_managed.zip solution from releases and save into the temp_releases folder using the path given.

Note

If you receive the error SignTool.exe not found, then ensure you selected the Windows 11 SDK (10.0.22621.0) additional install when installing Visual Studio.

✅Core Post Deployment Steps

There are some manual tasks that cannot be performed during solution deployment after you have run the azure-api installation procedure and deployed to your development environment:

  • Reply URLs added to the Payments API Entra ID application registration to match the custom connectors
  • Update the Plugin Managed Identity to match your azure deployment

Run the following PowerShell and follow the instructions carefully:

  1. Drag the script located at src\core\solution\deployment-scripts\2-post-deployment-setup.ps1 into your VSCode terminal window and press Enter.
  2. You will be prompted to open the 2 custom connectors and copy the Reply Urls so that they can be added to the Entra ID application.
  3. You will be asked if you would like to update the managed identity settings. This will configure the virtual entity plugin to connect to the Azure API.

✅Deploying the Portal Development Solution

The source for the Portal solution is built using:

  • Power Pages
  • Power Apps Component Framework
  • Copilot Studio

When working on this solution, it must be deployed to a separate environment that has the CustomControls and Core solutions installed as a managed solution.

The following tasks must be carried out before you import that ContosoRealEstatePortal solution

🤖Turn off Automatic Copilot Creation for Power Pages

When a power pages site is created, by default a new Copilot will be created and the SiteComponent with type BotConsumer will be updated to point to the new copilot. This interferes with the CI/CD process. As a work around the the enableChatbotOnWebsiteCreation Tenant setting should be turned off using the Power Platform admin PowerShell:

# Install the Power Platform PowerShell Admin commands
# See https://learn.microsoft.com/en-us/power-platform/admin/powershell-installation
Install-Module -Name Microsoft.PowerApps.Administration.PowerShell

# Authenticate
Add-PowerAppsAccount -Endpoint prod

# Update tenant settings
$requestBody = @{
        powerPlatform = @{
            powerPages = @{
                enableChatbotOnWebsiteCreation = $false
            } 
        } 
    }

Set-TenantSettings -RequestBody $requestBody

For more information, see: https://learn.microsoft.com/en-us/power-pages/getting-started/enable-chatbot

👉Deploy to Portal Developer Environment

To deploy the Portal solution, perform the following steps:

  1. Ensure you have all the updates installed via the Dynamics 365 apps page in the admin portal for your CRE Portal Dev environment.

  2. Inside VS Code, change the selected environment to be your CRE Portal Dev environment by electing the environment in the Power Platform Developer Tools, or by using pac env list and pac env select -env "CRE Portal Dev (yourname)"

  3. Drag into the terminal the script at src\portal\solution\deployment-scripts\deploy-to-development-environment.ps1, press Enter, and follow the instructions carefully.

  4. You will be prompted to download the latest Custom Controls managed and Core managed solutions from releases and place into the temp_release folder location given.

  5. The Portal solution will be built locally

  6. The managed solutions are first installed, and then the portal unmanaged solution is imported.

✅Core Post Deployment Set up

To perform post deployment steps, first drag the Core solution post deployment setup script into the VSCode terminal and press Enter.

src\core\solution\deployment-scripts\2-post-deployment-setup.ps1

This will:

  • Reply URLs added to the Payments API Entra ID application registration to match the custom connectors
  • Update the Plugin Managed Identity to match your azure deployment

🔌Create connections

The portal solution uses a couple of connections. When importing the solution manually you will be prompted to wire up the different connection references to an actual connection, but when using the deployment script you will need to create them after deployment. The CI/CD pipeline automatically associates the connection references to connections using the deploymentSettings.json

Note: You will need to have run the post deployment steps for the core solution to setup the reply urls for the connectors.

This can be done automatically in the CI/CD deployment pipeline using the deploymentSettings.json but is easiest done manually when working on your development environment.

  • Dataverse - Connection used by Cloud Flows and Copilot Studio
  • Contoso Stripe API - Connection for Portal Cloud Flows
  1. Open make.powerapps.com and open the Contoso Real Estate Portal solution
  2. Open Connection References
  3. Select each connection reference and select + New connection under the Connection dropdown.
  4. Search for the Connector type (Dataverse or Contoso Stripe API) and select the + add button, and then Create.
  5. For production, SPNs will be used, however for development you can use your own account.
  6. Return to the Connection References panel, select Refresh, and select the connection you have created (it will show as your login name)
  7. Repeat for all connection references.
  8. Navigate to Cloud Flows and select Turn on for each flow that is in the Off Status. (This isn't needed in CI/CD since the connection references are configured using the deploymentSettings.json and the flows are automatically turned on)

👉Start an AI Builder trial

  1. Inside make.powerapps.com, navigate to AI hub in the left navigation menu (under ...)
  2. Select Start free trial on the banner message

AI builder trial

🌐Activate Power Pages Site

  1. Open the Contoso Real Estate Portal inside make.powerapps.com, navigate to Site.

  2. Select the Contoso Real Estate Portal. This will take you to Power Pages.

  3. You will see a message Website Not found since the web site is not yet created.

  4. Select Go Home.

  5. Navigate to Inactive Sites.

  6. Locate the Contoso Real Estate Portal, and select Reactivate.

  7. Append the environment name to the website name (for ease of identification)

  8. Enter a website address that references your environment - e.g cre-my-developer-environment

  9. Select Done

  10. Open the solution in make.powerapps.com

  11. Select Environment Variables -> Contoso Real Estate Portal Url

  12. Select + New Value, and enter the Url of your new site (e.g. https://cre-my-developer-environment.powerappsportals.com/) -> Save.

Note

This is used by the Copilot Studio Copilot to search the site.

  1. Wait for the portal to finish being created.

⚡Setup cloud flow triggers

When flows that are added to power pages are deployed, the trigger is not updated to match the target environment. For this reason, they must be manually re-configured. This creates unfortunately creates an unmanaged layer:

  1. Open your site in Power Pages
  2. Select Set Up -> Integrations -> Cloud Flows
  3. For each flow in the site, select the ellipsis ...
  4. Edit - Save (without changing anything).
  5. Power Pages will re-configure the trigger to point at the cloud flow in the current environment.

🤖Publish Chatbot

In order that you can test the portal chatbot in Copilot Studio you will need to configure authentication, if you don't want to test the Copilot you can simply skip to the Publish.

  1. Open Entra ID Application Registrations
  2. Select All applications
  3. Search for the name you gave to your site above (e.g. Contoso Real Estate Portal cre-my-developer-environment) and open the application registration. IMPORTANT: Pick the correct application that has the same name as your portal.
  4. Make a note of the Application (client) ID
  5. Select Certificates & Secrets -> Client Secrets
  6. Select Add new client select -> Add
  7. Enter a name (e.g. Portal Bot Testing)
  8. Copy the Secret Value (Not the Secret ID)
  9. Select Authentication
  10. Under Web Redirect URIs, select Add URI
  11. Enter https://token.botframework.com/.auth/web/redirect
  12. Select Save
  13. Open Copilot Studio -> Select your environment using the picker on the top right -> Open the Contoso Real Estate Bot under Copilots

Note

If this is your first time using Copilot Studio, Select Start a free trial.

  1. Select Settings on the top right
  2. Select Security
  3. Select Authentication
  4. Select Authenticate Manually
  5. Enter the following:
  • Service Provider: Generic OAuth 2
  • Client ID: The Application ID of the Application copied above
  • Client Secret: The secret value copied above
  • Scope list delimited: ,
  • Authorization URL template: https://login.microsoftonline.com/<YOUR TENNANT ID>/oauth2/v2.0/authorize
  • Authorization URL query string template: ?client_id={ClientId}&response_type=code&redirect_uri={RedirectUrl}&scope={Scopes}&state={State}
  • Token URL template: https://login.microsoftonline.com/<YOUR TENNANT ID>/oauth2/v2.0/token
  • Token URL query string template: ?
  • Token body template: code={Code}&grant_type=authorization_code&redirect_uri={RedirectUrl}&client_id={ClientId}&client_secret={ClientSecret}
  • Refresh URL template: https://login.microsoftonline.com/<YOUR TENNANT ID>/oauth2/v2.0/token
  • Refresh URL query string template: ?
  • Refresh body template: refresh_token={RefreshToken}&redirect_uri={RedirectUrl}&grant_type=refresh_token&client_id={ClientId}&client_secret={ClientSecret}
  • Scopes: profile email openid
  1. Select Save -> Save
  2. Select Publish on the top right and wait for the publish to complete.

✅Testing the portal

To test the portal:

  1. Navigate to the site is Power Pages
  2. Select Preview
  3. You will be asked to give consent to the requested information that allows access to the private Power Pages site.
  4. You can now search for listings, login, and register.
  5. You can test the Bot using a phrase such as 'Find me a property by the beach with a pool'.

✅ Testing the API Azure Function locally

You can run the unit tests on the Azure functions Payments API by performing the following steps:

  1. Open the solution in Visual Studio at contoso-real-estate-power\src\azure-api\Contoso.API.Payments.sln

  2. If you see the message 'This project is targeting a version of .NET which is not installed', select Install, and then re-open Visual Studio when complete.

  3. Open the Test Explorer using Test-> Test Explorer.

  4. The tests are integration tests and so require a direct connection to the deployed Azure Resources.

  5. Inside your azure portal, navigate to your resource control deployed, and select the Key Vault.

  6. Navigate to Secrets, and copy the value for the AZURE-SQL-CONNECTION-STRING-payments-api. Selecting the clip board icon will copy the value to your clip board.

  7. Right click on the Contoso.API.Payments project and select Manage User Secrets.

  8. Add the following keys:

      "AZURE-SQL-CONNECTION-STRING-payments-api": "<PASTE THE VALUE OF ThE SECRET AZURE-SQL-CONNECTION-STRING-payments-api>",
  "StripeApiKey": "<PASTE THE VALUE OF THE SECRET StripeApiKey>"

  9. Repeat for the StripeApiKey secret

  10. Save and close the secrets file.

  11. The Integration tests use the identity you are logged into the Azure CLI using, so ensure that the account used with az login has access to the Azure resources (e.g. the user that you used to deploy with).

  12. You can now run the integration tests

  13. If you Start the Azure Functions, they will also host the endpoints on localhost so you can debug and develop locally.

✅ Testing the Virtual Table Provider locally

The C# Plugin Virtual Table Provider calls the Azure Functions API using the Dataverse Managed Identity. In order to run this using a local integration test, you must setup the secrets to give a connection to the API

  1. Load the Payments Virtual Table Provider solution from src\core\plugins\payments-virtual-table-provider\PaymentVirtualTableProvider.sln

  2. cd In order to run the integration tests, you will need to add secrets to connect to the Azure Functions API. The secrets should never be added to this repo and are stored in your user appdata folder.

    The MicrosoftConfigurationBuilders.UserSecrets.UserSecretsConfigurationBuilder NuGet package is used to read the secrets from the user secrets store.

    You can create the secrets file using the following PowerShell:

    ./src/core/plugins/payments-virtual-table-provider/PaymentVirtualTableProvider.Tests/set-integration-test-secrets.ps1

    The easiest way to do this from Visual Studio is right click on the script and select Open in PowerShell ISE, then select Run Script.

  3. When prompted, enter the following - using the value from your azure .env file.

    1. Tenant Id for your Azure subscription - AZURE_TENANT_ID in your .env file
    2. Payments Client Application Id - ENTRA_API_CLIENT_APP_ID in your .env file
    3. Secret for the Payment Client - Inside Entra ID -> App Registrations -> All applications, find the application using the ID you provided. It will be called Client for Contoso Real Estate Payments API (your deployment name). Open it, and under Certificates & secrets, select + New client secret. Give a name similar to 'Integration Tests', Add and then Copy the Value.
    4. Resource Url for the payments client - api://ENTRA_API_APP_ID
    5. Scope for the payments client: api://ENTRA_API_APP_ID/user_impersonation
    6. Host for the payments API - SERVICE_API_URI in your .env file (without the https://)
    7. Base URL for the payments - set to api/
    8. Integration testing string - AuthType=OAuth; Username=<User Name>; Url=<Environment Url>; AppId=51f81489-12ee-4a9e-aaae-a2591f45987d; RedirectUri=app://58145B91-0C36-4500-8554-080854F2AC97; LoginPrompt=Auto

  4. You can now run the integration tests and they will connect to your Azure resources.

🗑️Deleting deployment

It is important to note that deploying these resources to your Azure subscription will have a consumption cost. Once you have finished with the deployment you can remove the deployment by using:

./infra/scripts/delete-entraid-applications-before-azd-down.ps1
azd down

Note

When prompted 'Would you like to permanently delete these resources instead, allowing their names to be reused?' select YES