From my "Componentize Your Power Apps" Session at the Microsoft 365 Virtual Conference.

1. MICROSOFT 365
Virtual MARATHON
May 27 & 28, 2020
36 hours / 2 days
Componentize Your Power Apps
APRIL DUNNAM
PARNTER TECHNICAL ARCHITECT, MICROSOFT
@aprildunnam
Broughtto youby:
TheGlobalMicrosoft Community&
M365Conf.com | #M365CONF
#M365VM
M365VirtualMarathon.com

2. MICROSOFT 365
Virtual MARATHON
May 27 & 28, 2020
36 hours / 2 days
Mark Your Calendars:
March 23-25, 2021, MGM Grand Resort
Las Vegas, Nevada, USA
M365Conf.com
#M365CONF
TheSharePoint Conferenceis nowTheMicrosoft 365 CollaborationConference
#M365VM
M365VirtualMarathon.com
Broughtto youby:
TheGlobalMicrosoft Community&
M365Conf.com | #M365CONF

3. THANK YOU TO ALL OUR GENEROUS SPONSORS

4.  April Dunnam
 Tulsa, OK USA
 Partner Technical Architect, Microsoft
 Former MVP, Active Blogger, Vlogger and Speaker
 www.youtube.com/c/aprildunnam
LET ME INTRODUCE MYSELF…
Broughtto youby:
TheGlobalMicrosoft Community&
M365Conf.com | #M365CONF
#M365VM
M365VirtualMarathon.com

5.  Visit the Vendors Booth, Sessions and Watch the Videos
 Submit Your Answers to Enter the Raffle
 You need at least 5 correct answers then submit for a chance to win one of 3
(One in each Americas, APAC, EMEA)
ARE YOU READY FOR A RAFFLE?
WE ARE GIVING AWAY 3 OCULUS QUEST ALL IN ONE!
https://bit.ly/m365raffle

6. CONSIDER DONATING TO THE FOLLOWING CHARITY RELIEF FUNDS:
UNITED WAY: HTTPS://GIVE.UWKC.ORG/M365VM
INTERNATIONAL MEDICAL CORPS: HTTPS://BIT.LY/MEDICALCORPSFUND
10% OF FUNDS FROMSPONSORS GOTO SUPPORT COMMUNITY RELIEF.
FOR MORE INFORMATION WRITE TOINFO@M365VIRTUALMARATHON.COM

7. Agenda
WHY
USE COMPONENTS
WHAT
ARE COMPONENTS
HOW
DEMOS

8. Have you ever?
• Copied and pasted the same
header controls to a
gazillion screens in a
gazillion different
apps….only to realize that
you need to change
something with it?
• Tried to collaborate with a
colleague to work on a
Power Apps together and
saw the “locked for editing”
message?

10. Why Use Components?
REUSABILITY CONSISTENCY
BRANDING FLEXIBILITY
PERFORMANCE
COLLABORATIVE
DEVELOPMENT

11. What are Components?
• Reusable building blocks
• Define a set of controls
• Import components in
other apps
• Master-Child
Implementation

12. Component
Properties
Input Properties
• Send information to the
component
 Color
 Text to show
 Navigation items to
Display
Output Properties
• Get information from the
component
 Selected Item in a
Gallery

13. Types of Components
Classic Components
• Audience – Citizen Devs
• Create in Power Apps
Studio with low/no-
code
Code Components
• Audience – Pro Devs
• Create in VS Code with full
code

14. Enabling Components
• On newly created apps this *should
be enabled by default. Might need
to enable on older apps
• File > App Settings > Advanced
Settings > Toggle Components On
• In the Tree View, select Components
• Create New Component from
scratch or import existing
• Insert > Components – gives a list
of components that you have
created/imported within your App

15. Component Libraries
 Containers of component definitions that make it easy to:
− Discover and search components.
− Publish updates across environments.
− Notify app makers of available component updates.

16. DEMO TIME
Broughtto youby:
TheGlobalMicrosoft Community&
M365Conf.com | #M365CONF
#M365VM
M365VirtualMarathon.com

17. Component Gotchya’s
STILL IN PREVIEW COLLECTIONS NOT FULLY
SUPPORTED
CONNECTORS NOT FULLY
SUPPORTED
CAN’T NEST INSIDE
GALLERIES, FORMS OR DATA
CARDS

18. Learn More
• Canvas Component Blog:
https://powerapps.microsoft.com/en-
us/blog/components-available-in-preview/
• Component Samples:
https://github.com/microsoft/powerapps-
tools/tree/master/Components
• Component Libraries:
• https://docs.microsoft.com/en-
us/powerapps/maker/canvas-
apps/component-library
• Component Framework:
https://docs.microsoft.com/en-
us/powerapps/developer/component-
framework/overview

19. MICROSOFT 365
Virtual MARATHON
May 27 & 28, 2020
36 hours / 2 days
THANK YOU FOR JOINING US!
DO YOU HAVE ANY QUESTIONS?
Speaker feedback
https://bit.ly/M365VMSpeakerFeedback
Event feedback
https://bit.ly/M365VMFeedback