Overview
In 2021, each month we will be releasing a monthly blog covering the webinar of the month for the Low-code application development (LCAD) on Azure solution.
LCAD on Azure is a new solution to demonstrate the robust development capabilities of integrating low-code Microsoft Power Apps and the Azure products you may be familiar with.
This month’s webinar is ‘Build Custom Power Apps with Power Apps Component Framework.’
In this blog I will briefly recap Low-code application development on Azure, provide an overview of how to build a code component, and how to add a PCF to a Power App.
What is Low-code application development on Azure?
Low-code application development (LCAD) on Azure was created to help developers build business applications faster with less code, leveraging the Power Platform, and more specifically Power Apps, yet helping them scale and extend their Power Apps with Azure services.
For example, a pro developer who works for a manufacturing company would need to build a line-of-business (LOB) application to help warehouse employees track incoming inventory.
That application would take months to build, test, and deploy, however with Power Apps’ it can take hours to build, saving time and resources.
However, say the warehouse employees want the application to place procurement orders for additional inventory automatically when current inventory hits a determined low.
In the past that would require another heavy lift by the development team to rework their previous application iteration.
Due to the integration of Power Apps and Azure a professional developer can build an API in Visual Studio (VS) Code, publish it to their Azure portal, and export the API to Power Apps integrating it into their application as a custom connector.
Afterwards, that same API is re-usable indefinitely in the Power Apps’ studio, for future use with other applications, saving the company and developers more time and resources.
To learn more, visit the LCAD on Azure page, and to walk through the aforementioned scenario try the LCAD on Azure guided tour.
How to Build a Code Component
Power Component Frameworks are custom code components that extend your application when out-of-the-box connectors don’t fully meet your needs. These code components are reusable that can be leveraged across Power Apps applications.
These components are all HTML or JavaScript but can support React and AngularJS as well. For those interested after reading this blog and watching the webinar, there is a PCF gallery that houses PCFs made by Microsoft developers and the Power Apps community, for any developer to leverage.
Feel free to add your own PCFs to the gallery!
Code components consist of three elements:
First is the manifest, an XML document that describes the meta data for the component.
Second is component implementation. To implement the component, the metadata is stored in the index.ts, also housing the logic. Additionally, there is a lifecycle to interact with the Power Apps component or framework.
Therefore, some methods will need to be created to control the lifecycle of the code component. Those methods are created when you “init” the project through the CLI.
Third are the resources; tags in the manifest that refer to the resource that the component requires to implement its’ visualization. Examples are css, code, img, html, and resx.
To better understand the PCF architecture below is an infographic describing the four standard methods created for you when you “init” the project through the CLI.
The next infographic depicts how the methods are invoked through a Framework Runtime process in a standardized life cycle.
What to expect in the webinar?
In the webinar Cassie Breviu walks you step by step on how to build a PCF in CLI and Visual Studio that adds a slider component for Power Apps.
The end user can leverage the slider when accounting for inventory, inputting customer order quantities, or a host of other use cases.
That is one of the great benefits of PCFs, that they are reusable across Power Apps for a variety of use cases.
Prior to importing the PCF into her Power App, Cassie will also demonstrate the necessary steps in the Power Platform Admin Center to secure her component and set the proper governance regulations.
Summary
Make sure to watch the webinar on February 25th to learn more about Power Apps and Power Component Frameworks. Moreover, look out for news about the POWERful Devs conference this September which will cover the roles of citizen developers, professional developers, and fusion teams.
Resources
Webinar Registration Link
Low Code Application Development on Azure
Microsoft Power Apps on Azure
