Developing a Power Apps code app on the Microsoft Power Platform enables developers to create custom applications that integrate seamlessly with business processes.
In this blog post, we explain how to build this app from scratch using the Power Platform command-line interface (CLI) and a TypeScript template. This approach is ideal for developers who want to build low-code but powerful apps with full control over code and design.
A Power Apps code app is a specialized application type that gives developers the flexibility of working with code (TypeScript, Node.js, CLI tooling) while still leveraging Power Platform capabilities. These apps are in general availability (GA) and designed for advanced use cases. To ensure users only access relevant data, implement Power BI row level security.
Unlike traditional canvas apps, code apps give your development team direct control over the app lifecycle — from initialization to deployment. According to Microsoft’s official Power Apps documentation, code apps support modern development workflows including Git version control, package management, and continuous deployment pipelines. This makes them a strong choice for enterprise solutions.
Whether you are an experienced developer or exploring low-code options, this step-by-step guide walks you through every stage — from environment setup to live deployment. If you have already built a code app, visit our guide on retrieving Dataverse records in this type of app.
Prerequisites and Environment Setup
Before getting started, ensure you have the following installed on your machine:
- A Power Platform environment with code apps enabled
- Node.js (LTS version) installed
- The Power Platform CLI (pac CLI) installed
- Git installed on your machine
Step-by-Step: Create a Power Apps Code App from Scratch
1. Set Up Your App Template
Open a terminal or command prompt and run the following commands.
<pre style="background: #f4f4f4; padding: 15px; border-radius: 5px; font-family: monospace;">
npx degit github:microsoft/PowerAppsCodeApps/templates/vite my-app
cd my-app
</pre>
This creates a new project folder for your Power Apps code app from a Vite template and moves into that directory (as shown below).
2. Authenticate Using Power Platform CLI
Authenticate the CLI to connect your Power Apps code app environment is connected to a valid environment. Run the commands below and sign in using your Microsoft Entra identity. (your Power Platform work or school account).
<pre style="background: #f4f4f4; padding: 15px; border-radius: 5px; font-family: monospace;">
pac auth create
pac env select --environment {environment id}
</pre>
3. Install Dependencies and Initialize the Code App
Next, install the required packages and initialize your code app with a display name. This step configures the project and prepares it for local testing.
<pre style="background: #f4f4f4; padding: 15px; border-radius: 5px; font-family: monospace;">
npm install
pac code init --displayname "App From Scratch"
</pre>
4. Run Your Power Apps Code App Locally
To preview your app during development, run the dev command. When successful, the CLI will open a local URL where you can test your code app in the browser.
Note: Ensure you use the same browser profile that is signed into your Power Platform tenant.
<pre style="background: #f4f4f4; padding: 15px; border-radius: 5px; font-family: monospace;">
npm run dev
</pre>
Build and Deploy to Power Apps Platform
Once local testing is complete, you can build and push your app to Power Apps.
npm run build: Compiles your TypeScript code and bundles assets.
pac code push: Publishes a new version of your code app to Power Apps.
<pre style="background: #f4f4f4; padding: 15px; border-radius: 5px; font-family: monospace;">
npm run build
pac code push
</pre>
Upon completion, the CLI will return a Power Apps URL – this is the link where your app can be run, shared, and managed in the Power Apps portal.
Creating a Power Apps code app from scratch provides developers with full control over app structure and deployment while leveraging the scalable Power Platform ecosystem.
Coming Up in Part 2:
In the next part of this blog series, we will move beyond app creation and focus on connecting the code app to Microsoft Dataverse. We will walk through a practical, code-first example that demonstrates how to retrieve multiple records from Dataverse using generated services.
Build Enterprise-Grade Solutions on Power Platform
Custom Power Apps development
Dataverse architecture planning
API and backend integrations
Secure enterprise deployments
Frequently Asked Questions
What is a Power Apps code app?
A Power Apps code app is a specialized application type that allows developers to build custom apps using pro-code tools like TypeScript, React, and Node.js within the Power Platform ecosystem. Unlike drag-and-drop Canvas apps, code apps offer granular control over performance and development lifecycle. Learn more in Microsoft's official Power Apps documentation.
How Does a Pro-Code Approach Compare to Canvas Apps?
The main difference lies in the development approach. Canvas apps utilize a low-code, drag-and-drop interface intended for rapid business logic implementation. Code apps utilize a "code-first" approach using the Power Platform CLI and standard web development stacks (like Vite and React). Code apps are best suited for professional developers who need to bypass the UI limitations of standard Canvas controls.
What Do I Need to Set Up Before Starting?
To build a code app, you need a local development environment configured with:
Node.js (LTS version).
Visual Studio Code (or preferred IDE).
Microsoft Power Platform CLI (pac).
Git for version control.
Access to a Power Platform environment with code app features enabled.
Can I use React and TypeScript to build Power Apps?
Yes. These apps are designed to work natively with modern web standards. The default template provided by Microsoft uses Vite and React with TypeScript, allowing developers to use familiar libraries, hooks, and component structures that are standard in the web development industry.
How Does This Differ from Power Apps Component Framework (PCF)?
PCF allows you to build individual custom controls (widgets) that live inside a Canvas or Model-driven app. A Code App is a standalone application entirely built with code. Think of PCF as a custom brick in a wall, whereas a Code App is the entire custom house built on the Power Platform foundation.
How Do I Publish My App to the Power Platform?
Deployment is handled via the Power Platform CLI. After developing locally, you run npm run build to bundle your assets, followed by pac code push. This command packages your code and publishes it directly to your connected Dataverse environment, generating a live URL for users.
When Should I Use This Instead of a Canvas App?
Use this app type when you need full control over UI frameworks, complex integrations, custom APIs, or enterprise-scale architecture. If your team is comfortable with TypeScript and modern development tooling, code components offer flexibility that canvas apps cannot provide. This approach is ideal for scenarios where performance, version control, and CI/CD pipelines are priorities, and where the low-code model of canvas apps would be too limiting. See Microsoft documentation on choosing the right Power Apps development approach.
Does It Work with Dynamics 365 and ERP Systems?
Yes. These apps can integrate with Dynamics 365, external APIs, and enterprise databases for advanced workflows. The connection model is the same as other app types on the platform, so you can call standard connectors and custom connectors alike. This makes it an excellent fit for organizations already using Dynamics 365 or other Microsoft business applications. Alphavima helps businesses implement and extend Microsoft Power Platform solutions including custom app development.
Need Help Creating Power Apps Code Apps?
Build TypeScript-based Power Apps Code Apps and Dataverse-integrated experiences — by certified Power Platform developers.