A Framework to Meet Your Needs
Working with the PCF CLI tools for someone not familiar with the Microsoft Azure ecosystem was quite a hurdle. As a side note, PCF CLI at the time of writing is not cross-platform and only available on Windows 10. During the course of development, I needed to create various entities, build Power Apps model-driven app, and provision environments. Being a complete novice in the environment made these steps confusing and frustrating.
With generous assistance from a seasoned PowerApps developer, I was able to follow the tutorial to create a horizontal slider straight out of jQuery UI that was ready to be customized via CSS. To demonstrate how the new control incorporated CSS, I added color to the slider handle.
Building a Customized PowerApp
The exercise I used to publish a custom component in PCF was relatively simple. PCF CLI allows a developer to make something that doesn’t exist in the list of out-of-the-box controls. For example, a map control built with the OpenLayers library, loading a tileset from a selection in a PowerApps form, and then allowing the user to draw geometries on the map control and automatically calculating the land area of the shapes. I would advise using the out-of-the-box controls whenever possible, but when a custom component is necessary, I would suggest the following based on what I learned:
- Use a CSS pre-processor. They are industry standard and can help simplify all but the least complex styles.
- Start out simple. Add complexity once you are sure your component builds properly.
- Make sure to use the CLI testing environment to preview your control. You don’t have to publish the control, add it to a model-driven app, etc. to see it work.