Meet /add-server-logic, /add-cloud-flow, and /integrate-backend – three skills that complete the application stack. They build on an already working site by introducing secure server-side logic, Power Automate cloud flows, and intelligent backend orchestration for end-to-end functionality.

What’s new

• /add-server-logic generates secure server-side JavaScript endpoints for validation, secret management, external API calls, and cross-entity operations.
• /add-cloud-flow integrates existing Power Automate cloud flows into your Power Pages site for approval workflows, notifications, and scheduled automation.
• /integrate-backend analyzes your prototype, determines the right approach (Web API, Server Logic, and/or cloud flow) for each feature, and orchestrates the complete build sequence.

/add-server-logic: secure server-side endpoints, generated end to end

Server Logic in Power Pages moves critical operations from the browser to the server for improved control, scalability, and security. It’s generally available, so it’s fully supported for production workloads. With server logic, your site can perform complex tasks and integrations without exposing sensitive logic or data on the client side. Server logic enables you to:

• Connect to external services. Integrate securely with REST APIs, Azure Functions, or other business systems, e.g., call the Stripe API to process a payment without exposing your API key. (Tutorial: interact with external services)
• Perform secure data operations. Query, update, or delete Dataverse records with consistent server-side validation, e.g., check inventory levels before accepting an order submission. (Tutorial: interact with Dataverse tables)
• Run custom logic. Calculate totals, enforce business rules, or enrich data with external lookups before returning results, e.g., aggregate data across multiple tables into a single global search response.
• Manage secrets server-side. Store credentials and API keys on the server, never in client code, e.g., authenticate with Microsoft Graph to upload documents to SharePoint. (Tutorial: interact with Microsoft Graph and SharePoint)

The /add-server-logic allows you to describe what you need in plain language, and it generates the server-side endpoint, web role assignments, table permissions, a typed client-side service, and component updates.

Here’s an example. Say your order form needs to validate inventory before accepting a submission:

You: "/add-server-logic Add validation that rejects orders when quantity exceeds inventory"

Plugin:
        → Creates server-logic/validate-order.js (server-side endpoint)
        → Assigns Authenticated Users web role
        → Verifies table permissions for cr_inventories
        → Creates src/services/serverLogic/validateOrder.ts (typed client)
        → Updates OrderForm.tsx to call validateOrder() before submit

Or say your site needs a global search that queries across multiple Dataverse tables (products, orders, and knowledge articles) and returns unified results. That kind of cross-entity aggregation can’t run from the browser in a single call:

You: "/add-server-logic Add a global search endpoint that searches across products,
      orders, and knowledge articles and returns combined results"

Plugin: 
        → Creates server-logic/global-search.js (server-side endpoint)
        → Queries cr_products, cr_orders, and cr_knowledge_articles
        → Aggregates and ranks results server-side
        → Assigns Authenticated Users web role
        → Verifies table permissions for all three tables (Read)
        → Creates src/services/serverLogic/globalSearch.ts (typed client)
        → Updates SearchPage.tsx to call globalSearch() on input

Before generating any code, a built-in Server Logic Architect agent analyzes your use case and presents a proposal for your review.

/add-cloud-flow: Power Automate integration from your site

Not everything belongs in a server-side endpoint. Approval workflows, email notifications, and event-driven automation are better suited to Power Automate cloud flows. The /add-cloud-flow skill integrates an existing cloud flow into your Power Pages site. It does not create new cloud flows. You build the flow in Power Automate, and the skill handles the integration: registering the flow with your site, generating the client-side code to trigger it, and wiring up data exchange between the page and the flow.

You: "/add-cloud-flow Connect the supplier approval flow to my application page"

Plugin: 
        → Registers the existing cloud flow with your site
        → Generates client-side code to trigger the flow
        → Handles async workflow state and callback patterns

Whether it’s a manager approval step, an order confirmation email, or a nightly data sync, /add-cloud-flow handles the integration so you focus on the business process.

/integrate-backend: let AI choose the right approach

Start here if you’re not sure whether a feature needs Web API, Server Logic, or a cloud flow. /integrate-backend acts as your server-side architect. It analyzes your website, determines the right approach for each feature, and orchestrates the plugin skills to build everything in the correct order.

Take a supplier portal with product listings, order submission, a global search across products and orders, and an invoice approval workflow. Without /integrate-backend, you’d need to figure out that product listings are standard CRUD (Web API), global search requires cross-entity aggregation on the server (Server Logic), and invoice approvals need a multi-step flow (Power Automate). You’d also need to sequence the work: Dataverse tables before Web API, web roles before Server Logic, authentication before server-side endpoints.

The /integrate-backend skill automatically scans your entire website and recommends relevant business processes.

You: /integrate-backend

Plugin:
  ANALYSIS
  ════════
  #   Feature              Approach         Reason
  1   Product listings     Web API          Standard CRUD on cr_products
  2   Order submission     Server Logic     Inventory validation + transaction
  3   Global search        Server Logic     Cross-entity aggregation on server
  4   Invoice approvals    Cloud Flow       Multi-step approval workflow

How it works

Every skill follows a propose-then-build workflow. An AI architect agent analyzes your request, designs the solution, and presents it for approval. No code is generated, and no infrastructure is created until you approve. This keeps you in control while eliminating manual configuration.

The decision framework is simple:

• Server Logic. Secrets or API keys, server-side validation, multi-table transactions, external or on-premises service calls, cross-entity search, rate limiting, or Dataverse plugin invocation.
• Cloud flow. Approval workflows, notifications, or scheduled processing.
• Web API. Everything else (standard CRUD operations).

Benefits

• Enhanced security. Business logic, secrets, and API keys stay on the server and are never exposed in the browser.
• Reduced manual configuration. Each skill generates endpoints, permissions, typed services, and component updates end to end.
• Intelligent approach selection. /integrate-backend determines whether each feature needs Web API, Server Logic, or a cloud flow, so you don’t have to.

Get started

Install or update the plugin and PAC CLI

Install the latest plugin and PAC CLI, as both are required. Server logic support was introduced in the latest PAC CLI release, so older versions will not work with /add-server-logic. For the easiest setup, use Quick Install (recommended), which installs all Power Platform plugins, updates PAC CLI, and enables auto-update.

Get started with the Power Pages plugin for GitHub Copilot CLI and Claude Code.

We are looking for your feedback

Your feedback helps us improve the developer experience on Power Pages. Share your thoughts and reach out on the Power Pages Community Forum. You can also submit ideas through the Power Pages Ideas portal.

The post Build your server-side logic with AI: new Power Pages Agentic Code skills appeared first on Microsoft Power Platform Blog.

This plugin is purpose-built for Power Pages. It understands table permissions, web roles, site settings, setting up authentication and Web API patterns. The code it generates is platform-aware, so you spend less time on manual configuration and more time building your site.

How it works

The plugin provides nine conversational skills covering the full lifecycle of a Power Pages single-page application (SPA) site. Here’s a typical end-to-end flow:

• Create your site (/create-site). Describe what you’re building, the pages you need, and your design preferences. The plugin scaffolds the project with your choice of framework (React, Vue, Angular, or Astro), installs dependencies, and opens a live browser preview.
• Deploy and activate (/deploy-site, /activate-site). The plugin builds your project, uploads it to Power Pages, and provisions a public URL.
• Set up your data model (/setup-datamodel). A specialized Data Model Architect agent analyzes your site’s code, checks your Dataverse environment for existing tables, and proposes a schema with an ER diagram. The plugin doesn’t create anything until you approve.
• Connect to live data (/integrate-webapi, /add-sample-data). The plugin scans your components for mock data and replaces it with production-ready API code, including typed clients, CRUD services, and framework-specific patterns. A Permissions Architect agent proposes table permissions and site settings for your review. You can also populate your tables with realistic test records.
• Add authentication and SEO (/setup-auth, /create-webroles, /add-seo). The plugin generates sign-in and sign-out functionality with Microsoft Entra ID, role-based access control, web role definitions, sitemaps, and meta tags.
• Deploy the final site (/deploy-site). A final deployment pushes your code, permissions, web roles, and site settings to your Power Pages environment.

Each skill works independently and checks its own prerequisites, so you can run them in any order. At every critical step, the plugin proposes changes and waits for your approval before it acts.

A typical end-to-end workflow

Get started

You need the following:

• Node.js 18 or later

• Power Platform CLI (PAC CLI) – latest version

• Azure CLI – latest version

• GitHub Copilot CLI or Claude Code

You also need a Power Platform environment with Power Pages and authenticated sessions for both PAC CLI and Azure CLI.

To install the plugin, open GitHub Copilot CLI or Claude Code and run the following commands:

/plugin marketplace add microsoft/power-platform-skills
/plugin install power-pages@power-platform-skills

After installation, run /create-site and describe what you want to build.

For the full walkthrough, see Get started with the Power Pages plugin for GitHub Copilot CLI and Claude Code.

Tip: New to GitHub Copilot CLI or Claude Code agentic coding tools?

Read Tips and best practices for guidance on writing effective prompts, sharing errors with context, building incrementally, and getting the most out of the plugin.

We are looking for your feedback

Your feedback helps us improve the developer experience on Power Pages. Share your thoughts and reach out on the Power Pages Community Forum. You can also submit ideas through the Power Pages Ideas portal.

The post Build Power Pages sites with AI using agentic coding tools (preview) appeared first on Microsoft Power Platform Blog.

Since the launch of the preview, we’ve heard the feedback from developers who want to bring modern front-end frameworks to Power Pages while still benefiting from built-in authentication, Web API access, and Dataverse integration. Today’s GA release makes that experience production ready.

What’s new in this release

• Generally available: SPA support is now production-ready and fully supported, starting with site versions 9.8.1.x and later.
• Styling fixes: We’ve resolved issues where Power Pages platform styles could override your custom CSS.
• Improved documentation: Updated guidance for authentication configuration and local development setup.

Pro tips for SPA development

Disable profile page redirect for SPAs

By default, Power Pages redirects users to the built-in profile page (/profile) after login. For SPA website, this redirect can disrupt your app’s navigation flow. Disable it by adding this site setting:

After updating this setting, users are redirected to the returnUrl specified in your login form, which defaults to the current page or your app’s home page.

Set up local development

You can run your SPA locally with full authentication and Web API access to accelerate your development cycle. This means JavaScript hot reload, local debugging, and immediate feedback without deploying changes to your portal every time. For step-by-step instructions, see Set up local development for SPA sites.

Resources

• Create single-page application (SPA) for Power Pages
• Power Pages Web API overview

We are looking for your feedback

Your feedback helps us improve the developer experience on Power Pages. Share your thoughts and reach out on the Power Pages Community Forum. You can also submit ideas through the Power Pages Ideas portal.

The post Announcing General Availability (GA) of building single-page applications for Power Pages appeared first on Microsoft Power Platform Blog.

The new Client API (Preview) addresses this by providing a stable, object-oriented $pages namespace. This allows developers to interact with site components using supported methods rather than hacking the DOM, ensuring reliability, maintainability, and upgrade safety.

What’s New: The $pages Object

Client API exposes a global $pages object that acts as the entry point for all client-side operations.

• Form & Control Manipulation: Programmatically get or set values, visibility, and disabled states for controls without guessing ID attributes.
• Multistep Form Navigation: Native methods like goToNextStep() and goToPreviousStep() to control user flow through complex wizard-style forms.
• Simplified Web API: A dedicated $pages.webAPI object that wraps Dataverse calls (Create, Read, Update, Delete) with clean async/await patterns, automatically handling the complexity of authentication headers.
• User & Session Management: Methods to trigger $pages.user.signIn() or signOut() and manage site languages dynamically.

How to Get Started

To use the Client API, you must ensure your logic runs only after the API is fully initialized. The $pages object is not available immediately on page load.

1. Initialize with onPagesClientApiReady

Use the new Microsoft.Dynamic365.Portal.onPagesClientApiReady function. The modern approach uses await to ensure a clean, sequential flow.

// Modern async/await initialization
let $pages = await Microsoft.Dynamic365.Portal.onPagesClientApiReady();
console.log("Client API is ready!");

2. Manipulate UI Controls (Read/Write/Hide)

Instead of searching for #element_id, use the forms collection to access controls securely.

// Get the API instance
let $pages = await Microsoft.Dynamic365.Portal.onPagesClientApiReady();

// Retrieve a specific form by ID
let form = $pages.currentPage.forms.getFormById('form_#1');

// Access controls
let controls = form.controls;

// Example: Hide the first control if it exists
if (controls.length > 0) {
    console.log(`Hiding control: ${controls[0].getName()}`);
    controls[0].setVisible(false); 
}

3. Interact with Dataverse (Web API)

Create and retrieve records using the simplified $pages.webAPI methods.

Note: Ensure you have configured Table Permissions and enabled the Web API for the specific tables you are accessing.

// Create a new Contact record
await $pages.webAPI.createRecord('contacts', { 
    firstName: 'John', 
    lastName: 'Doe' 
});

// Retrieve Accounts with OData query ($select)
let accounts = await $pages.webAPI.retrieveMultipleRecords('accounts', '$select=name&$top=3');
console.log(`Retrieved ${accounts.length} accounts.`);

We are looking forward to your feedback

Your feedback will help us continue to build on and improve the capabilities of this feature. We want to hear from you!

Please explore the Client API documentation and let us know your thoughts. You can submit your feedback and feature ideas on the Power Pages Ideas site.

The post Power Pages Client API (Preview): Native Client-Side Library for Forms and Data appeared first on Microsoft Power Platform Blog.

Why CodeQL

Security vulnerabilities can hide in plain sight especially in custom HTML and JavaScript that power dynamic site experiences. Traditional testing and QA often detect issues too late in the development cycle. However, CodeQL, a semantic code analysis engine from GitHub, scans your site’s codebase to identify vulnerabilities before they become security incidents. Whether it’s cross-site scripting (XSS), injection attacks, or insecure DOM access, CodeQL helps uncover these risks early and automatically.

When and Where CodeQL scan is Available

CodeQL scan is available in VS Code desktop for locally downloaded Power Pages sites. These are marked with the Current tag in your list of active sites. This means you must first download your site for local development using tools Visual Studio Code or Power Platform CLI.

To use this feature, make sure the Power Platform Tools extension is installed in Visual Studio Code (VS Code) Desktop. If you haven’t set up VS Code Desktop yet, see the Set up Visual Studio Code for Power Pages documentation for guidance. Once downloaded, the Run CodeQL screening option becomes available in the VS Code desktop’s Power Pages Actions view.

When selected, it:

• Performs static analysis on your HTML and JavaScript files
• Surfaces potential vulnerabilities across the codebase
• Provides actionable insights to remediate issues before publishing or deploying changes

Run a CodeQL security scan for your Power Pages site

Follow these steps to run a CodeQL security scan for your Power Pages site:

1. Download your Power Pages site locally using VS Code desktop
2. Open the downloaded site in VS Code desktop
3. Navigate to Power Pages Actions view and select the site from active site list
4. Right click on the site and select Run CodeQL screening command to initiate a security scan
5. Review the results, which highlight:
   • Vulnerable patterns in JavaScript
   • Deprecated or unsafe HTML usage
   • Code that could expose user data or be exploited by attackers

Benefits of using CodeQL Screening

• Shift-left your site security: Find issues during development, not post-deployment
• Higher code quality: Spot and fix security smells that affect performance and maintainability
• Compliance readiness: Improve your site’s posture for security audits and certifications

We are looking forward to your feedback

Security isn’t an afterthought it’s a core feature. With CodeQL Screening, Power Pages helps you build secure-by-design experiences for your customers and stakeholders.

• Learn more about developing Power Pages locally
• Get started with GitHub CodeQL on GitHub Docs

Explore these new capabilities and share your thoughts and experiences. Your feedback is crucial in shaping the future of Power Pages.

The post Strengthen Your Power Pages Security with CodeQL code scan appeared first on Microsoft Power Platform Blog.

Previously, moving from the Power Pages VS Code for the Web editor to the desktop version involved several manual steps:

• Launching VS Code Desktop and signing into the correct environment
• Manually downloading the site source using Power Platform CLI or the Actions view
• Navigating to the appropriate folders and opening the project

These manual steps disrupted developer flow, slowed down iteration, and added friction, especially when collaborating in fast-paced fusion teams.

What’s new

With the latest Power Pages update, developers can now:

Open VS Code Desktop directly from VS Code for the Web, which automatically downloads your site’s source code and sets up a ready-to-code workspace.

This creates a zero-friction, one-click experience that gets developers coding in seconds with full local context, all without leaving the Power Pages design environment.

If you don’t have VS Code Desktop installed on your system, the feature will prompt you to install Visual Studio Code Desktop along with the Power Platform Tools extension. These components are required for the seamless transition and auto-download for source code to work. Once installed, you’ll be able to take full advantage of this one-click experience.

Why VS Code Desktop?

Switching to VS Code Desktop unlocks advanced capabilities such as:

• GitHub Copilot for AI-assisted coding
• Configuration file editing for fine-grained control
• Develop with Live Preview for real-time feedback
• Write and run unit/integration tests for robust application quality
• Access to a wide range of extensions for debugging, linting, and productivity

For detailed guidance on how Power Pages integrates with VS Code Desktop, including setup steps and best practices, check out the official documentation here.

We are looking forward to your feedback

This update is part of a broader effort to make Power Pages a first-class platform for both makers and professional developers, with seamless transitions between no-code, low-code, and pro-code experiences.

Whether you’re creating external customer portals, partner ecosystems, or secure data-driven applications, Power Pages now fits seamlessly into your workflow, from lightweight, zero-footprint browser tools to powerful desktop tools in your development environments.

Explore these new capabilities and share your thoughts and experiences. Your feedback is crucial in shaping the future of Power Pages.

The post Seamlessly Open VS Code Desktop from Power Pages VS Code for the Web with auto-download site code appeared first on Microsoft Power Platform Blog.

Why Use GitHub Spark + Codespaces and Host in Power Pages?

GitHub Spark is an AI-powered tool that generates single-page applications using natural language prompts, while Codespaces provides a pre-configured development environment in the cloud.

Power Pages serves as a secure, scalable, and enterprise-grade platform tailored for modern web development. With built-in capabilities for security, governance, analytics, and seamless integration across the Microsoft Power Platform ecosystem, it provides everything you need to build, manage, and scale professional-grade web applications efficiently. Together, these enable:

• AI-assisted site generation with GitHub Spark
• Instant cloud-based coding with GitHub Codespaces
• Seamless deployment to Power Pages using Power Platform CLI
• Built-in security, governance, analytics, and seamless Power Platform integration delivered through Power Pages

Hosting Your Site in Power Pages

Once your site is created using Spark and edited in Codespaces, you can deploy it to Power Pages using the Power Platform CLI.

Quick steps:

1. Use GitHub Spark to generate your site template.
2. Open the project in GitHub Codespaces.
3. Customize your site using React or other SPA frameworks.
4. Deploy using pac pages upload-code-site.

To explore the complete step-by-step guide, refer to the document: Tutorial: Create and deploy a single-page application using GitHub Spark and Codespaces.

Demo

Key Resources

• Tutorial: Create and deploy a single-page application using GitHub Spark and Codespaces.
• Create single-page application in Power Pages
• Power Pages sample sites

The post Build and deploy a single-page application in Power Pages using GitHub Spark and Codespaces appeared first on Microsoft Power Platform Blog.

What’s New?

Power Pages now supports creating and deploying complete single-page applications through a code-first approach. This means developers can:

• Build modern React applications with full control over the frontend experience
• Use AI-powered coding assistants to accelerate development
• Use Power Pages Web APIs to perform data operations
• Deploy SPAs directly to Power Pages environments using the Power Platform CLI
• Maintain enterprise-grade security and governance

This represents a significant shift from traditional Power Pages development, offering developers flexibility while leveraging the platform’s security, governance, and scalability.

Prerequisites

Before diving in, ensure you have:

• Power Platform CLI version 1.44.x or later
• A Power Pages site on version 9.7.4.x or later

Demo

Key Features and Benefits

1. AI-Assisted Development

Developers can leverage next-generation AI tools like GitHub Copilot agent to transform their work. Instead of writing repetitive boilerplate code, developers can use natural language to describe what they want to build, letting AI handle the implementation details.

2. Modern Frontend Framework Support

Power Pages SPA sites are built using React, enabling developers to:

• Create responsive, dynamic user interfaces
• Implement complex state management
• Use the vast ecosystem of React components and libraries
• Build truly interactive experiences without page refreshes

3. Streamlined Deployment Process

The Power Platform CLI provides simple commands for uploading and downloading SPA sites:

# Upload your SPA to Power Pages
pac pages upload-code-site --rootPath "./my-app" --compiledPath "./build" --siteName "Contoso App"

# Download an existing SPA for editing
pac pages download-code-site --path "." --webSiteId "your-site-guid"

4. Enterprise Governance and Security

Despite being client-side applications, Power Pages SPAs maintain the platform’s robust security and governance:

• Full support for identity providers (Microsoft Entra ID, Microsoft Entra External ID, etc.)
• Table permissions and web roles enforcement on API calls
• Access to user context for personalized experiences
• Public and private site configurations

We are looking forward to your feedback

This feature enables professional developers to build sophisticated frontends while leveraging Power Pages’ backend capabilities, Power Pages is bridging the gap between low-code and pro-code development. Your feedback is crucial in shaping the future of this feature. We want to hear from you!

Check out the official documentation and the sample React site code to begin your journey into modern Power Pages development.

The post Build Modern Single-Page Applications in Power Pages (Preview) appeared first on Microsoft Power Platform Blog.

Feature Overview

Natural Language Search enables users to interact with list data in a more intuitive and conversational manner, significantly simplifying data exploration and discovery. By supporting both conversational phrases and specific text formats, this feature streamlines the search experience and makes data insights readily accessible.

Important: Ensure your Power Pages site is updated to version 9.7.4.x or later to utilize this feature.

How to enable this feature

You can enable Natural Language Search for your existing lists with the following simple steps:

1. Select the existing list you want to enhance.
2. Click Edit List > More options.
3. Under More options, locate the Enable search in this list toggle.
4. Turn this toggle On, then ensure Search with natural language is also activated.
5. Save your changes.

Your list is now ready for natural language search interactions!

Feature Capabilities

Natural Language Search offers the following key capabilities:

• Natural Language Queries: Interprets and retrieves precise data from conversational queries consisting of more than two words, e.g., Orders over 500 dollars.
• Text-based Search: If you enter two words or fewer, the list defaults to a text search. For specific text searches exceeding two words, enclose your search term in double quotes.
• Search Suggestions: Displays dynamic suggestions based on the table data. Users can click a suggested query to instantly perform a search, streamlining their experience and reducing effort.

We are looking forward to your feedback

We continue to improve and refine Power Pages, and your insights are invaluable. Explore the new Natural Language Search feature and share your thoughts and experiences. Your feedback is crucial in shaping the future of this feature. We want to hear from you!

See documentation here for a detailed overview.

The post Enable Natural Language Search for Lists in Power Pages (Preview) appeared first on Microsoft Power Platform Blog.

We have simplified managing Power Pages sites for developers and aim to minimize the learning curve for using CLI commands. Historically, developers needed to switch between multiple tools to interact with different types of sites to get required information for running Power Platform CLI commands. Recognizing this challenge, we are introducing a new feature that leverages context-specific actions triggered by a simple right-click, streamlining workflows for developers using Visual Studio Code.

Feature Overview

This feature enables users to execute a variety of site-specific actions directly from within VS Code Desktop. Whether a site is active, inactive, or stored locally, you can quickly perform tasks — ranging from uploading to previewing without leaving your development environment. This integration simplifies site management, enhances productivity, and delivers a more cohesive user experience.

Demo Video

Below is a video that demonstrates how these context-specific actions work within VS Code Desktop.

Feature Capabilities

For Active Sites:

• Preview: Clears cache and immediately opens the site in VS Code Desktop for a live preview
• Upload: Synchronizes local changes with your connected environment
• Download: Retrieves site content to a local folder for offline editing
• Site Details: Displays comprehensive details about the site, including metadata
• Reveal in Explorer: Opens the local directory containing the site’s code
• Open in Power Pages Studio: Launches the site in Power Pages Studio for low code editing experience

For Inactive Sites:

• Open Site Management: Opens the site within the Power Pages Management Application
• Site Details: Provides detailed information such as website ID, URL, and data model version

For Other (Local) Sites:

• Upload Site: Uploads local site configurations to your connected environment, transitioning them to inactive sites
• Reveal in Explorer: Directly navigates to the local directory containing the site’s code.

We are looking forward to your feedback

This new feature enhances the developer experience within the Power Pages ecosystem by integrating intuitive, context-based actions into VS Code Desktop. Your feedback is crucial in shaping the future of this feature. We want to hear from you!

See documentation here for a detailed overview.

The post Introducing Actions Pane for Power Pages Sites in VS Code Desktop appeared first on Microsoft Power Platform Blog.