Microsoft Power Apps Cookbook E-Book

Eickhel Mendoza

• Herausgeber: Packt Publishing
• Kategorie: Fachliteratur
• Sprache: Englisch

Seitenzahl: 369

Veröffentlichungsjahr: 2021

Beschreibung

Microsoft Power Apps Cookbook is a complete resource filled with meticulously crafted recipes to help you build customized business apps that meet ever-changing enterprise demands. You will learn how to design modern apps with the low-code approach in a rapid application development environment by achieving enterprise-wide business agility.

Leseprobe

Microsoft Power Apps Cookbook

Become a pro Power Apps maker by applying practical use cases to solve ever-evolving business challenges

Eickhel Mendoza

BIRMINGHAM—MUMBAI

Microsoft Power Apps Cookbook

Copyright © 2021 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing or its dealers and distributors, will be held liable for any damages caused or alleged to have been caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

Group Product Manager: Aaron Lazar

Publishing Product Manager: Alok Dhuri

Senior Editor: Rohit Singh

Content Development Editor: Kinnari Chohan

Technical Editor: Rashmi Choudhari

Copy Editor: Safis Editing

Project Coordinator: Francy Puthiry

Proofreader: Safis Editing

Indexer: Pratik Shirodkar

Production Designer: Nilesh Mohite

First published: January 2021

Production reference: 1210121

Published by Packt Publishing Ltd.

Livery Place

35 Livery Street

Birmingham

B3 2PB, UK.

978-1-80056-955-3

www.packt.com

To my wife, Pili, the strongest woman who ever lived, and to my daughter, Amanda, the spark of my life.

Without their love and support, nothing would make sense.

– Eickhel Mendoza

Packt.com

Subscribe to our online digital library for full access to over 7,000 books and videos, as well as industry leading tools to help you plan your personal development and advance your career. For more information, please visit our website.

Why subscribe?

Spend less time learning and more time coding with practical eBooks and Videos from over 4,000 industry professionalsImprove your learning with Skill Plans built especially for youGet a free eBook or video every monthFully searchable for easy access to vital informationCopy and paste, print, and bookmark content

Did you know that Packt offers eBook versions of every book published, with PDF and ePub files available? You can upgrade to the eBook version at packt.com and as a print book customer, you are entitled to a discount on the eBook copy. Get in touch with us at [email protected] for more details.

At www.packt.com, you can also read a collection of free technical articles, sign up for a range of free newsletters, and receive exclusive discounts and offers on Packt books and eBooks.

Contributors

About the author

Eickhel Mendoza is a Microsoft Business Applications MVP with many years of experience from various roles in project management, Microsoft Azure development and operations, and, most recently, in Microsoft Power Platform technologies.

He is a team lead of the Business Apps department and oversees all projects related to Microsoft 365, Power Platform, and web development.

He has contributed to significant community events, such as the Power Platform World Tour, Global Azure Bootcamp, Microsoft 365 Developer Bootcamp, and Dynamics 365 Saturdays in recent years.

Eickhel also coordinates the TenerifeDev and Power Platform Canarias user groups with a group of like-minded developers eager to share their knowledge in different technologies.

I want to thank all the people who have helped shape my love of technology: my parents, my school teachers, and my co-workers, who always challenge me to create great things.

About the reviewer

Rebekka Aalbers-deJong started her career as a regular business but switched to work in IT over 10 years ago, first as an IT administrator, later as a technology consultant. She is an active contributor to the Microsoft Power Platform community as a speaker, blogger, and organizer of a local user group. She received the Microsoft MVP award for Business Applications for her contributions to the technical community in 2019.

Rebekka works as a technology consultant at Dutch Microsoft Partner Macaw, where she combines her experience as a non-IT business user, IT administrator, and software consultant to help companies implement Power Platform and build Power Platform solutions.

Rebekka lives in the Netherlands together with her husband and their two cats.

Packt is searching for authors like you

If you're interested in becoming an author for Packt, please visit authors.packtpub.com and apply today. We have worked with thousands of developers and tech professionals, just like you, to help them share their insight with the global tech community. You can make a general application, apply for a specific hot topic that we are recruiting an author for, or submit your own idea.

Table of Contents

Preface

Chapter 1: Building pixel-perfect solutions with Canvas Power Apps

Discovering best practices when building canvas apps

Variable naming

Control usage

Coding methodology

Creating an incident tracking solution – Setting up the data source

Explanation and overview

Getting ready

How to do it…

How it works…

Creating an incident tracking solution – Building the user interface

Explanation and overview

How to do it…

How it works…

Embedding an expense tracking list with SharePoint list Power Apps

Explanation and overview

How to do it…

How it works…

See also

Creating a Power App from existing data

Getting ready

How to do it…

How it works…

There's more…

Chapter 2: Building from data with model-driven apps

Technical requirements

Licensing requirements

Exploring Dataverse

Building a help desk solution

Getting ready

How to do it…

How it works…

Defining data structures

Explanation and overview

How to do it…

How it works…

Building the model-driven app

Explanation and overview

How to do it…

How it works…

Setting up business process logic

Explanation and overview

How to do it…

How it works…

Designing dashboards to visualize data

How to do it…

How it works…

Integrating canvas apps inside model-driven apps

How to do it…

How it works…

Chapter 3: Choosing the right data source for your applications

Technical requirements

Data sources and the licensing model

Power Apps/Power Automate for Microsoft 365

Reducing your application complexity by using Azure SQL database views

Getting ready

How to do it…

How it works…

There's more…

Choosing the right data source – real-world tests

Getting ready

How it works…

How it works…

There's more…

Integrating on-premises data with the data source flexibility of canvas apps

Getting ready

How to do it…

How it works…

Improving application speed and responsiveness by using static data

Getting ready

How to do it…

How it works…

Consuming external data by using Dataflows

Getting ready

How to do it…

How it works…

There's more…

Chapter 4: Automating processes with Power Automate

Technical requirements

Paid plans

The different types of flows

Automated

Instant

Scheduled

Business process

UI

Creating a sales survey solution with Power Automate and Microsoft Forms

Getting ready

How to do it…

How it works…

Building a file processing automation for SharePoint document libraries

Getting ready

How to do it…

How it works…

Overcoming Power Apps delegation with Power Automate

Getting ready

How to do it…

How it works…

There's more…

Creating a modular solution with Power Automate

Getting ready

How to do it…

How it works…

There's more…

Chapter 5: Extending the Platform

Technical requirements

User interface guidelines

Setting up your first canvas Power Apps component

Getting ready

How to do it

How it works

There's more

Building a floating action button component

Getting ready

How to do it

How it works

Creating a vertical navigation component

Getting ready

How to do it

How it works

Developing template fields using components

Getting ready

How to do it

How it works

Using the Power Apps component library

Getting ready

How to do it

How it works

Expanding communications with custom connectors

Getting ready

How to do it

How it works

There's more

Chapter 6: Improving User Experience

Technical requirements

Enhancing application interfaces

Getting ready

How to do it…

How it works…

Building a responsive password manager in Power Apps – setting up the Azure Key Vault service

Explanation and overview

How to do it…

How it works…

Building a responsive password manager in Power Apps – designing an adaptive application

Explanation and overview

Getting ready

How to do it…

How it works…

Chapter 7: Power Apps Everywhere

Technical requirements

Discovering Power Apps Mobile and the Windows desktop player

How to do it…

How it works…

There's more…

Leveraging modern browsers for Power Apps

Getting ready

How to do it…

How it works…

There's more…

Improving SharePoint document libraries with Power Apps

Getting ready

How to do it…

How it works…

There's more…

Embedding Power Apps in SharePoint pages

Getting ready

How to do it…

How it works…

There's more…

Making Power BI reports interactive with embedded Power Apps

Getting ready

How to do it…

How it works…

Working with Power Apps in Microsoft Teams channels

Getting ready

How to do it…

How it works…

There's more…

Automating the integration of Power Apps inside Teams

Getting ready

How to do it…

How it works…

Building apps with Dataverse for Teams

Getting ready

How to do it…

How it works…

There's more…

Chapter 8: Empowering your applications with no code Artificial Intelligence

Technical requirements

Creating a customer success solution using sentiment analysis

Getting ready

How to do it…

How it works…

Building a text recognition system using canvas apps

Getting ready

How to do it…

How it works…

Using Power Automate to create an invoice classification system

Getting ready

How to do it…

How it works…

There's more…

Chapter 9: Discovering the Power Platform admin center

Technical requirements

Managing Power Platform environments

How to do it…

How it works…

Gathering Power Platform analytics

Getting ready

How to do it…

How it works…

There's more…

Synchronizing data using data integration

Getting ready

How to do it…

How to do it…

There's more…

Managing connectors through data policies

Getting ready

How to do it…

How it works…

Chapter 10: Tips, Tricks, and Troubleshooting

Technical requirements

Sharing OneDrive data between tenants

Getting ready

How to do it

How it works

Playing with vectors – SVGs in canvas apps

Getting ready

How to do it

How it works

There's more

Transferring SharePoint List Power Apps from one site to another

Getting ready

How to do it

How it works

Troubleshooting using the Power Apps canvas Monitor

Getting ready

How to do it

How it works

There's more

Extending screen real estate using the canvas control

Getting ready

How to do it…

How it works

Handling image resources in components

Getting ready

How to do it

How it works

There's more...

Changing Azure SQL Server connections in Power Apps with ease

Getting ready

How to do it

How it works

Renaming files in SharePoint document libraries

Getting ready

How to do it

How it works

Chapter 11: Advanced Techniques with Power Apps Component Framework

Technical requirements

Setting up your environments

Getting ready

How to do it

How it works

There's more

Configuring Font Awesome

How to do it

How it works

Creating the project

Explanation and overview

How to do it

How it works

Building the application logic

How to do it

How it works

Deploying the solution

How to do it

How it works

Testing the component on a canvas app

How to do it

How it works

There's more

Other Books You May Enjoy

Preface

Power Apps is a low-code platform to build applications from Microsoft. With this platform, you can create solutions to solve your business needs while integrating with other components of the Power Platform, such as Power Automate or Power BI.

Quite different from the complete documentation that exists online, you will find that this is not your regular reference book. Instead, this book deals with real-world scenarios and experiences to help you get a headstart in your Power Apps projects.

Using a curated set of chapters, you will discover different aspects of Power Apps, from building canvas apps, designing model-driven solutions, extending with custom connectors, and integrating with other platforms to moving to the pro-developer side using Power Apps Component Framework.

Who this book is for

Since we are covering practical use cases, basic knowledge of building applications using Power Apps is required to take advantage of the solutions explored in this book. You will get a step-by-step tutorial on building the recipes crafted for each chapter.

What this book covers

Chapter 1, Building pixel-perfect Solutions with Canvas Power Apps, starts with the best practices for building canvas apps and continues with building solutions, including coverage of data source setup.

Chapter 2, Building from data with Model-Driven Apps, continues our journey by following a collection of recipes joined together to create an all-around help desk solution.

Chapter 3, Choosing the right Data Source for your applications, will help you to make a sound decision when determining the data source of your applications. This chapter also explains the importance of the licensing model on this platform.

Chapter 4, Automating Processes with Power Automate, focuses on several use cases to improve business processes using this component of the Power Platform.

Chapter 5, Extending the Platform, builds upon the concept of enhancing the application building process by using components. We will also learn how to extend the platform by creating custom connectors.

Chapter 6, Improving User Experience, looks at how to enrich your user interfaces to make your applications more appealing to end users. This chapter will also cover how to create a responsive application using the latest techniques available in Power Apps.

Chapter 7, Power Apps Everywhere, explains all the possible ways to use and integrate Power Apps on many platforms, from mobile device consumption to embedding scenarios on SharePoint and Power BI, without forgetting the latest on Microsoft Teams development, including Dataverse for Teams.

Chapter 8, Empowering Your Applications with no code Artificial Intelligence, focuses on using AI Builder solutions to improve our applications and processes by bringing artificial intelligence into the mix.

Chapter 9, Discovering the Power Platform admin center, is about learning how to manage the Power Platform using the tools and settings available in this admin center.

Chapter 10, Tips, Tricks, and Troubleshooting, offers a collection of hints from the application building experience in Power Apps with a set of topics that will help solve or improve a wide variety of scenarios.

Chapter 11, Advanced Techniques with Power Apps Component Framework, tackles the pro-developer side of things by building a Power Apps Component Framework component from scratch. We will look at setting up our development environment and deploying the component to an application.

To get the most out of this book

Before diving into building solutions with Power Apps, you are going to need a Microsoft 365 subscription. You might have one already from your work organization, but if you want to have a playground to build apps, I'm going to give you two suggestions.

Microsoft 365 Developer Program

This program allows you to have a Microsoft 365 subscription with many features available: 25 E5 user licenses, apps such as SharePoint and Microsoft Teams, learning resources, and more. It's the perfect sandbox environment to create your apps, not only to build Power Apps but also to learn other technologies from the whole Microsoft 365 ecosystem. This subscription renews automatically every 3 months as long as you are actively using it.

To get more information, please refer to https://developer.microsoft.com/en-us/microsoft-365/dev-program

Power Apps Community Plan

This option is the ideal choice if you want a more focused approach to the Power Platform. It offers a free environment for individual use with the same advantages of a paid plan, including premium connectors. However, there are some restrictions, such as app sharing, the need for a Microsoft organizational account, and the ability to use dataflows.

This subscription has no renewal process; it's perpetual. For more information, please visit https://powerapps.microsoft.com/en-us/communityplan.

Power Apps paid plans

The licensing model on this platform depends on the type of connector needed for your data sources. Standard connectors such as the one used for SharePoint don't require an additional license besides Microsoft 365, but premium or custom connectors do require a Power Apps license:

Per app: Allows building and using two apps (canvas or model-driven) plus one Power Apps portalPer user: Allows building and using unlimited apps (within service limits)

To get more insight into the licensing model, please visit https://powerapps.microsoft.com/en-us/pricing/.

If you are using the digital version of this book, we advise you to type the code yourself or access the code via the GitHub repository (link available in the next section). Doing so will help you avoid any potential errors related to the copying and pasting of code.

Download the example code files

You can download the example code files for this book from GitHub at https://github.com/PacktPublishing/Microsoft-Power-Apps-Cookbook. In case there's an update to the code, it will be updated on the existing GitHub repository.

We also have other code bundles from our rich catalog of books and videos available at https://github.com/PacktPublishing/. Check them out!

Download the color images

We also provide a PDF file that has color images of the screenshots/diagrams used in this book. You can download it here: https://static.packt-cdn.com/downloads/9781800569553_ColorImages.pdf

Conventions used

There are a number of text conventions used throughout this book.

Code in text: Indicates code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles. Here is an example: "Mount the downloaded WebStorm-10*.dmg disk image file as another disk in your system."

A block of code is set as follows:

html, body, #map {

height: 100%;

margin: 0;

padding: 0

}

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

[default]

exten => s,1,Dial(Zap/1|30)

exten => s,2,Voicemail(u100)

exten => s,102,Voicemail(b100)

exten => i,1,Voicemail(s0)

Any command-line input or output is written as follows:

$ mkdir css

$ cd css

Bold: Indicates a new term, an important word, or words that you see onscreen. For example, words in menus or dialog boxes appear in the text like this. Here is an example: "Select System info from the Administration panel."

Tips or important notes

Appear like this.

Get in touch

Feedback from our readers is always welcome.

General feedback: If you have questions about any aspect of this book, mention the book title in the subject of your message and email us at [email protected].

Errata: Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you have found a mistake in this book, we would be grateful if you would report this to us. Please visit www.packtpub.com/support/errata, selecting your book, clicking on the Errata Submission Form link, and entering the details.

Piracy: If you come across any illegal copies of our works in any form on the Internet, we would be grateful if you would provide us with the location address or website name. Please contact us at [email protected] with a link to the material.

If you are interested in becoming an author: If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, please visit authors.packtpub.com.

Reviews

Please leave a review. Once you have read and used this book, why not leave a review on the site that you purchased it from? Potential readers can then see and use your unbiased opinion to make purchase decisions, we at Packt can understand what you think about our products, and our authors can see your feedback on their book. Thank you!

For more information about Packt, please visit packt.com.

Chapter 1: Building pixel-perfect solutions with Canvas Power Apps

Power Apps is the platform of choice for building business solutions using a low-code method. This approach enables the rise of the citizen developer, a being inside every organization who is keen on learning technology, which also brings the expertise of the business process to which this person belongs.

One of its versions, canvas Power Apps, allows the creation of pixel-perfect implementations of user interfaces. As its name suggests, it brings a variety of tools to build any imaginable design into your applications. Whether it's a critical business application or a mobile tracking system, canvas apps gives you all the tools required to design your app.

During this chapter, we will discover how to create a sample of real-life applications that will give you an insight into different approaches when building canvas applications: standalone and embedded Power Apps. We will also learn how to set up different types of data sources for our applications.

This chapter consists of the following recipes:

Discovering best practices when building canvas appsCreating an incident tracking solution – Setting up the data sourceCreating an incident tracking solution – Building the user interfaceEmbedding an expense tracking list with SharePoint list Power AppsCreating a Power App from existing data

Discovering best practices when building canvas apps

Setting up data sources, defining business process flows, creating user interfaces; all these tasks are pieces of an application building process. These pieces come together to accomplish the main goal: to build a solution that solves a specific need.

One of the things that you need to consider is the maintainability of your app. Whether you are in charge of fixing bugs or adding new features in the future, using best practices is always a good idea. No matter the technology you are using, well-documented code is easier to maintain.

Even though Power Apps is a low-code platform, you need to consider certain things before you start building applications. Like any other developer team, you need to establish code standards. These standards allow your team to be more productive by setting predefined patterns for variable naming, control usage, and coding methodology.

Variable naming

Proper naming gives your developers instant insight into the scope of your variables. For example, if a variable name prefix starts with lcl (short for local), it means it's value will only be available on the current screen. On the other hand, using gbl (short for global) means that this variable is accessible across the whole application.

These examples might seem trivial, but if another developer needs to maintain your app or if your app serves as a template for other apps in your organization, setting these patterns from the start can help the app building and maintaining process.

Control usage

One of the vital elements of an application's success is performance. If an application is slow to start or takes several seconds to perform a task, it hurts user adoption.

Here are a few examples of this:

Having a great-looking app using many controls to build its user interface but hurting performance each time the screens get rendered.Displaying data to the user using a gallery inside a gallery. This approach might be tempting to present master-detail data, but this would be a significant slowdown in your application.

To avoid this, you need to learn the performance points of your platform. In Power Apps, one of the main recommendations for improving responsiveness is to reduce the number of controls.

Coding methodology

This concept describes a set of rules to regulate the application building process in a low-code team. Your solution infrastructure can also help you make an informed decision on how to build your application:

If you have data that rarely changes, you can create collections on application start to avoid round-trips each time data is required. Even more, if you have data that never changes, you can import this as static data inside your app for speedier access.Taking advantage of the features available in your data source can significantly improve your application building process and even its performance. For example, when using Dataverse or a relational database, there is a significant difference when querying data if you use a data source view instead of building the actual query in your application logic, especially if it needs complex relationships. Using these views gives you cleaner code while also improving performance. This improvement relays on the data source engine as it is the one that executes the data processing instead of the Power App.

These are examples of practices you can coordinate with your team when building apps. For a detailed list of best practices, please refer to https://powerapps.microsoft.com/en-us/blog/powerapps-canvas-app-coding-standards-and-guidelines/

Creating an incident tracking solution – Setting up the data source

Tracking processes is always an accustomed request from customers everywhere. As in any development process, the first step is to gather all the requirements needed to fulfill the business need; this will then help us design the data structure to support our application.

This recipe will set up the required fields in a SharePoint list to be our data source. We will also apply some settings to this list to make it as performant as it should be.

Explanation and overview

For this recipe, we will use SharePoint as a data source, so we will start by creating a list. The actual list creation process is pretty straightforward, but that leaves us with plenty of time for planning.

SharePoint Online performance considerations

When working with SharePoint Online, you need to keep in mind that we are working on a web application with specific response and performance levels to provide the best user experience. To meet this, Microsoft has set a view threshold of 5,000 elements per list. Even though a list can hold up to 30 million items, querying data exceeding this limit will result in platform errors and will make the list unresponsive.

These are a few recommendations to keep your lists performant:

Set an index for the columns you wish to filter. Always keep this in mind beforehand since you cannot change it if you have already exceeded the threshold.Prepare views for lists that might carry a large number of items by segments. Examples can be categories, years, and departments.Build your views with no more than 12 people, lookup, and managed metadata columns to avoid performance issues.

For reference on this subject, check out the following links:

https://support.microsoft.com/en-us/office/manage-large-lists-and-libraries-in-sharepoint-b8588dae-9387-48c2-9248-c24122f07c59https://support.microsoft.com/en-us/office/use-filtering-to-modify-a-sharepoint-view-3d8efc52-0808-4731-8f9b-3dfaeacea3d4

Getting ready

Before diving into developing solutions with Power Apps, you are going to need a Microsoft 365 subscription. Please refer to the Preface section of this book about suggestions on getting a playground to build your apps.

How to do it…

Go to the SharePoint site that is going to hold the two lists. Throughout the book, we will use a fake organization called AMPI Currents, which has this site: https://ampicurrents.sharepoint.com/sites/TrackersSelect + New and then List, which will ask for a list name and description. Please input Clients and leave the Description field blank. This action will create a list with a default structure:

Figure 1.1 – List creation procedure

Click on the gear icon on the top-right corner and select List settings to add and update the columns. This option will open all the configuration options available for a list, but we will be focusing on the Columns section.First, click on the Title column to edit it. We are doing this for user interface reasons. This field lets you open the selected record quickly from the list view, so we will set it as the client's name. Once it opens, just rename the column name to Name and then click OK.To add the rest of the fields, click Create column and then set the column name and type as seen in the following table:

Figure 1.2 – Clients list columns

Repeat steps 2 and 3 for the Incidents list. Rename the Title column to Incident and set the columns seen in the following table:

Figure 1.3 – Incident list columns

Choice means that it will use a provided list of items to choose from, and Lookup means that this column will link to another list that holds another set of data. In this case, we will use this column to relate the incidents to the clients.

Add the Customer Name column. Select the Lookup type and then, in the Get information from dropdown, select the Clients list we created before. Leave the rest of the options as default.For the Priority column, select the Choice type and replace the list of choices with High, Medium, and Low. Set the Default value as Low.Lastly, when adding the Comments column, specify the type of text to be Plain text to prevent formatting issues later when designing your app. We need to make this change because, otherwise, SharePoint will store this data in HTML to maintain the formatting and will make the text look different from the rest of the app.

Now that we have our lists in place, let's see how this list and its relationships come together.

How it works…

After setting up our data source, we can now start building some test data to use in our Power App.

Click on the gear icon in the top-right corner, select Site contents, and select the Clients list:

Figure 1.4 – Site contents option

Now, let's click on + New to add some random test data:

Name: Yennu EnterprisesAddress: One Yennu roadPhone: [phone]Email: [email protected]

Add as much data as you like. Now, repeat the same steps with the Incidents list by clicking on the gear icon and selecting the list from Site contents.

For Customer Name, you will see data loaded from the Clients list, and the Priority column will let you choose from the previously defined elements:

Incident: Failure in the programming of the executive elevatorCustomer Name: Yennu Enterprises (link)Date: 11/17/2020Priority: HighComments: The elevator returns itself to the last floor when idle.

Again, add as much data as you want, and now we are moving forward to the next section, where we will build a Power App from this data structure.

Creating an incident tracking solution – Building the user interface

Before designing interfaces, we need to ask ourselves what needs our application will solve. This analysis will help us decide which technology we will use, what infrastructure is holding every piece of our solution, and even how our end users will consume it.

Explanation and overview

We know the technology, and, with the help of the previous recipe, we have the data source section of our infrastructure solved. It's time to leverage Power Apps to automate the creation of the building blocks of our application.

Power Apps integrates deeply inside SharePoint as a tool to build solutions rapidly with its low-code principles. This integration allows the creation of a completely functional application in a few steps.

How to do it…

Go to the SharePoint site that has your lists. Click the gear icon on the top-right corner, select Site contents, and select the Incidents list.On the list's toolbar, select Power Apps and then Create an app. This action will open up a dialog asking you the name of your application:

Figure 1.5 – Power Apps integration inside SharePoint

After a little while, a brand-new application gets created with the base functionalities: records manipulation, search, listing, and sorting. It's now time to polish our application to have the desired results.First, let's edit our application title to match our application name and not the list. Go to Tree view, expand BrowseScreen1, and select the LblAppName1 label. On the right pane, change the value of the label by changing the Text value. Do the same for the rest of the screens.If you followed our example list data, you might see that some of the incident's text is not complete. To fix this, select the Title1 label from BrowseScreen1 and, in its properties, deselect Wrap. This change will add an ellipsis, making the user aware that there is more information:

Figure 1.6 – Disabling Wrap for long text

Next, let's fix EditScreen1 to allow more space for the comments data card. At this moment, we won't be using the attachments data card, so by expanding EditForm1 and selecting Attachments_DataCard1, we can uncheck its visible property. Increase Comments_DataCard2's Height value and then increase the DataCardValue10 control to match the new size, and finally, set the Mode property to Multiline to fix the text's vertical alignment. Do the same for the Incident data card if you want it to have more space as well.Finish up by changing the colors, fonts, and control alignment to match your style. In Chapter 6, Improving User Experience, we will cover some techniques to apply a style makeover to your application.

How it works…

Now that we have created our app from SharePoint data, we can take it for a test drive. The Power Apps Studio gives you a preview functionality for testing while you are developing it. You can do it in two ways:

Go back to BrowseScreen1 and then press the play button on the top right of the Studio interface. This action will execute the application to interact with it, just as if you were running it from your device of choice.

Figure 1.7 – Power Apps studio preview feature

Press the Alt key (Option on a Mac) to test a particular control. For example, if I press Alt and then click on a button, it will perform its OnSelect action. This way, you can test a specific control without leaving the design mode of the studio.

Important note

Never rely on these testing methods to deploy an application to production. Power Apps Studio gives you a responsive simulator to test your app based on a low resolution. While it serves you well for functionality testing, it's no match for real device testing. You need to check your app on the user medium of consumption. Examples include SharePoint, Teams, and mobile devices.

This application will allow you to have an incident tracking system for your organization. You can now test it by creating new incidents or editing existing ones. The Power Apps template should have taken care of the core functionality already, so verify your specific requirements, such as maximum text length, user interface design changes, and the like. Making subtle user interface changes such as font names and sizes can improve the overall look of the application:

Figure 1.8 – User interface changes for the incident tracking solution

Embedding an expense tracking list with SharePoint list Power Apps

Earlier, in the Creating an incident tracking solution – setting up the data source recipe, we discussed how to design our SharePoint data source. We will use the same steps to create our data source for this recipe.

Explanation and overview

Planning for this data source requires the creation of related columns to track expenses. As a template, we could use the following options.

Projects

This list will hold project information, which will help us link the fees and the customer who owns the project. For this connection, we will use the customer list created in the previous recipe.

Expenses

This list will save the information related to the expense.

How to do it…

Go to the desired SharePoint site and create the projects lists by selecting + New and then List:

Figure 1.9 – List creation process

Once the list gets created, click on the gear icon at the top right and select List settings. Add the following columns by clicking on the Create column link inside the Columns section:

Figure 1.10 – Projects list columns

To create the expenses list, click on the gear icon at the top right, and then Site contents. From there, select + New | List from the toolbar. Repeat step 1 with the following columns:

Figure 1.11 – Expenses list columns

For the Category column, use these choices as an example: Travel, Transport, Supplies, and Meals. Add as much data as you like.

Click on the gear icon on the top-right corner, select Site contents, and then select the Expenses list.On the list's toolbar, select Power Apps and then Customize forms. This action will automatically create an app based on the list structure. This time, it will build an app with only one form and one particular control called SharePointIntegration:

Figure 1.12 – SharePointIntegration control inside Power Apps

Make relevant changes to your app, such as increasing the comments' height, resizing the attachments' control, and making style changes.Save and publish your app.

How it works…

As you can see, the new application differs from the one that we created earlier because this one gets embedded inside the SharePoint list. It replaces the regular list's data entry mechanism by displaying the Power App whenever you want to view, edit, or add new records:

Figure 1.13 – SharePoint list power app

This integration gets done by the SharePointIntegration control we mentioned earlier. It acts as a bridge between SharePoint and Power Apps to catch the data events (view, create, and edit) while also allowing us to handle the save and cancel events:

Figure 1.14 – SharePointIntegration actions

These actions are regular code blocks that get triggered depending on each event.

Embedding Power Apps inside a SharePoint list gives us the flexibility to control how the data gets entered, improve the data validation, and even allow connections to other services besides SharePoint, just to name a few examples.

See also

Think outside the box when building embedded Power Apps. They are not only there to improve data entry forms. You can create full-fledged solutions inside your lists. Please refer to the following example showcased on the Power Apps blog: https://powerapps.microsoft.com/en-us/blog/island-council-of-tenerife-organizes-community-events-using-the-power-platform

Embedding Power Apps in SharePoint lists is just the tip of the iceberg. There are many more scenarios where you can enrich your current platforms by integrating Power Apps: Teams and SharePoint pages, to name a couple. Want to know more? Please refer to Chapter 7, Power Apps Everywhere, to view more recipes that extend the use of Power Apps.

Creating a Power App from existing data

Power Apps is the ideal choice when it comes to building solutions for the enterprise. These solutions are often needed to improve a particular process when it comes to data handling. Sometimes, you will start from scratch, but most of the time, the data structure will already exist but in need of a robust and flexible application to handle it.

For these situations, there are some ready-made processes in the Microsoft ecosystem that allow the creation of applications from a particular set of data. We will discover these processes from Azure, SharePoint, and the Power Apps platform itself.

Getting ready

Azure is a platform that provides a wide range of cloud services for all kinds of scenarios, for example, application development, data analysis, and cognitive services. To work with Azure, you will need to have an active subscription. To test the capabilities of this platform, you can apply for a free account by signing up here: https://azure.microsoft.com/en-us/free/

As this recipe requires that we start from data, we will need to have an Azure SQL database provisioned. If you don't have one already, please follow the steps of this quickstart to create one: https://docs.microsoft.com/en-us/azure/azure-sql/database/single-database-create-quickstart?tabs=azure-portal

How to do it…

To gather data from an existing Azure SQL database, take the following steps:

Go to the Azure portal, https://portal.azure.com, and from the main search, enter SQL databases and select the service from the list, as seen in the following screenshot:

Figure 1.15 – Azure SQL databases

A list of databases will appear for you to pick. Select the one that has the data needed for your application. This action will open the configuration page, sometimes called the blade, with all the settings to configure the database.On the left pane of the configuration page, you will find a section called Power Platform, in which you can start working with any of the services available:

Power BI, to connect and visualize the data from this database

Power Automate, to automate processes using SQL server templates

Power Apps, to use this database as one of the data sources of your application

Select Power Apps and then Get started, as seen in the following screenshot:

Figure 1.16 – Power Apps option in Azure

The Azure portal will open a Create an app form that will gather the required settings for your app. If this form is disabled, it means that you don't have an active Power Apps plan. You can apply for a trial one by clicking on the Start trial link on the form's header.Enter the app name and the credentials to authenticate to the database in the SQL Authentication section. Finally, select a table from the list of tables in the database. The following is a sample form to create an app:

Figure 1.17 – Create an app form

Click Create to start the app building process. If the Power Apps portal doesn't open, check whether your browser of choice has blocked the popup. In the following screenshot, you can see what happens in Microsoft Edge; you can click the link or select to always allow popups from the Azure portal:

Figure 1.18 – Pop-up blocking in Microsoft Edge

When the process finishes, you will see an application created from the table data with a browse screen and a detail screen:

Figure 1.19 – Power app from Azure SQL Database

Getting data from a SharePoint list is done as follows:

Go to your SharePoint site and open the list you want to use in your app. From the toolbar, select Power Apps | Create an app. On the right, a new pane will open, asking you the name of the app. Enter it and click Create.The Power Apps portal will start building the application from the selected list. This time, the template used to generate the app will also include an edit screen:

Figure 1.20 – Power app from SharePoint list

Creating apps from data using the Power Apps portal is done as follows:

Go to the Power Apps portal, https://make.powerapps.com, and from the left pane, select Create. Under the Start from data section, you will see some of the most popular data sources in the Microsoft ecosystem and an option of Other data sources. Selecting any of the choices will open a Connections page where you will be able to configure the service, as follows:

SharePoint: You will be able to choose from the available sites and lists.

OneDrive for Business: A list of Excel files will appear to select as your data source.

Using any other option will prompt you to create a connection to that service and, depending on the service, will let you configure more options regarding the application data source connectivity.

In the following screenshot, you can see OneDrive and SharePoint on the Connections page:

Figure 1.21 – Connections page

After selecting a data source, the Power Apps Studio will create an app based on the existing fields or columns.

How it works…

Depending on your selection, the application will have the required screens to handle the data source's information. When you create an application from an existing data source, Power Apps generates a minimum of two screens:

BrowseScreen, to list records and interact with actions such as sort and filterDetailScreen, to present a complete set of fields related to the selected record in BrowseScreen

A third screen only appears if you have the requirements necessary to update the records, EditScreen.

For instance, if you connect to a SharePoint list in which you only have read-only permission, you will only get BrowseScreen and DetailScreen. On a list with update permissions levels such as Contribute or Edit, the EditScreen will handle the creation and update of records, as seen in the following screenshot:

Figure 1.22 – EditScreen on Power Apps

When working with Azure SQL databases, there is an additional requirement for EditScreen. From Power Apps, you can only update tables with primary keys, including the deletion of records. If the table you select when creating the app from data doesn't have a primary key defined, you will only get BrowseScreen and DetailScreen, as seen in the previous How to do it… section when using Azure SQL as our data source.

Keep in mind that there are other known issues and limitations when working with Azure SQL databases. Visit https://docs.microsoft.com/en-us/connectors/sql/#known-issues-and-limitations for more information.

Please refer to the connector documentation of your data source of choice to learn more about possible issues or limitations that could compromise your solution: https://docs.microsoft.com/en-us/connectors/connector-reference/

There's more…

The applications created in this chapter are fully functional for handling data but lack appeal in the user interface department. To enhance their design, please refer to Chapter 6, Improving User Experience, to see how to apply an application makeover.