Use the Creator Kit

Before you use the components included with the Creator Kit, use the reference app to learn component behavior and implementation patterns. With the reference app, you'll also learn how to add components to an app.

The Creator Kit includes the following assets, distributed in three solutions:

Solution	Items
CreatorKitCore	24 Power Apps component framework and canvas components
CreatorKitReference (MDA)	A reference app (Model Driven with custom pages) to interactively learn with A canvas page template
CreatorKitReference (Canvas)	Reference app (Canvas) to interactively learn with (does not required standalone Power Apps license) A canvas template app A theme editor that generates Theme JSON, used to easily style consistent components

Learn how to add components to an app

After the kit has been installed, learn how to add the components to your app:

• How to add code components to a canvas app
• How to add canvas components to a canvas app

Create the building blocks

In this section, you'll learn details about the different apps, templates, and components that make up the Creator Kit.

• Reference app
• Templates
• Canvas app template
• Custom page template
• Canvas components
• Code components

Reference app

Use this app to learn about each component, get recommended best practices for the optimal user experience, interact with each component, and see behind the properties to the implementation code that enables their behavior. We recommend exploring the components of interest in the reference app before you use them in an actual app.

• Observe how the component behaves and renders data.
• Select the Code tab to see the underlying Power Fx formulas.
• Learn best practices from the inline guidance related to the control.

Templates

The templates are designed to help you quickly start creating responsive Fluent UI–based apps. They come with the custom components preloaded and attached to a Theme JSON variable, which reduces time to start developing.

Canvas app template

Make a copy of this app to create a new canvas app that requires the components from the kit.

To make a copy of the canvas template:

1. Create a new unmanaged solution.
2. In the ribbon, select Add existing > Apps > Canvas.
3. Select the Canvas Template app, and then select Add.
4. Edit the Canvas Template.
5. In the studio ribbon, select File > Save As and enter a new name for the copy. The copy will appear in the same solution.
6. Remove the original canvas app template from the solution.

Ensure that you only edit the copied app from now on, so that you can reuse the original app template.

Custom page template

Make a copy of this page to create a new custom page for a converged app.

Follow the preceding steps to make a copy of the canvas template app, except this time you'll select the Save As option in the upper-right corner:

1. In the upper-right corner, expand the menu next to the Save icon, and then select Save as.

   

2. Enter a new name, and then select Save.

   

3. Close the studio by selecting the back button in the upper-left corner. Notice that the copy has been created in the same solution.

   

4. Remove the original custom page template from the solution.

Fluent theme designer app

Use this app to generate a Theme Json object for styling components consistently.

See Theming for instructions on how to generate themes and reference themes from components.

Canvas components

Canvas components are defined in the Power CAT Component Library, and are implemented using canvas components.

Code components

Code components, implemented with the Power Apps component framework, are defined as individual custom controls in the solution.

You can view the code components on the components reference page.

Deploying apps that use Creator Kit components

Apps that use kit components can't be built outside of a solution, and they must be imported and exported as part of solutions.

• During development, build apps that use Creator Kit components in their own separate, unmanaged solution.
• When deploying an app that includes the components, the CreatorKitCore (managed solution) must be installed in the target environment before dependent solutions are imported.

For more information and general guidance, go to solution import troubleshooting tips.

Next step: View the components reference