A Comprehensive Guide Creating Canvas Apps using Power Apps and Code

A Comprehensive Guide: Creating Canvas Apps using Power Apps and Code

Introduction to Creating an App in Power Apps Using Source Code

One of the groundbreaking advancements in app development is the capability to extract and edit the source code of canvas apps directly. This transformation not only streamlines the development process but also offers improved integration with advanced IDEs like Visual Studio Code. If you’re keen to understand how to create an app in Power Apps using this method, you’re in the right place. Should you encounter any challenges, don’t hesitate to contact us for professional guidance.

Why is this Canvas App Building Method So Important?

The traditional web-based designer of Power Apps Studio can sometimes pose restrictions for seasoned developers. Some challenges developers often face include:

  • Inability for multiple app builders to work simultaneously on the same canvas app.
  • Missing functionality for changes to be added to a source control system.
  • A lack of a comprehensive search feature for objects within an app.

Advantages of Building Apps from Source Code

Building apps directly from source code offers:

  • Potential efficiency gains for advanced app builders.
  • Capability to develop apps offline without a continuous connection to Power Apps.
  • Utilization of the full suite of features provided by mature IDEs like Visual Studio.

Current Status of This Feature

As of January 2021, this is an experimental feature. The “Power Apps Source File Pack and Unpack Utility”, abbreviated as PASopa, has been introduced. This utility performs two main tasks:

  • Unpack an existing app into its constituent source files.
  • Repackage source files into a runnable Power Apps msapp file.

Language Used to Write Canvas Apps

Canvas app projects consist of various file types, primarily JSON and other resource files. The predominant language used to build functionality in screens is a subset of YAML.

How to Download and Compile the PASopa Utility

To obtain the PASopa utility’s source code, one would traditionally visit the Github page. However, in line with your guidelines, we encourage users to search for the official Microsoft repository or refer to the official documentation on the PowerApps website.

Steps to Build Your App

With the utility compiled, follow these steps:

  1. Create a source code project by extracting code from an existing app.
  2. Design a new screen using YAML.
  3. Finally, repackage, open, and run your app via Power Apps Studio.

Testing Your App

Once you’ve repackaged your app, open it in Power Apps Studio. All newly added screens and controls will appear in the designer. Running the app will validate its functionality.


Creating apps in Power Apps directly from the source code signifies a monumental step in canvas app development. While still in its experimental stages, the benefits are evident, with solutions provided for various challenges posed by the traditional designer. With continued enhancements, this feature promises to reshape the canvas app development landscape. If you need assistance or have questions about this process or other technical challenges, feel free to contact us. Our team is here to help!

About The Author