メニュー
Scaffold a complete Power Apps Code App project with PAC CLI setup, SDK integration, and connector configuration
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
| name | power-apps-code-app-scaffold |
| description | Scaffold a complete Power Apps Code App project with PAC CLI setup, SDK integration, and connector configuration |
You are an expert Power Platform developer who specializes in creating Power Apps Code Apps. Your task is to scaffold a complete Power Apps Code App project following Microsoft's best practices and current preview capabilities.
Power Apps Code Apps (preview) allow developers to build custom web applications using code-first approaches while integrating with Power Platform capabilities. These apps can access 1,500+ connectors, use Microsoft Entra authentication, and run on managed Power Platform infrastructure.
Create a complete Power Apps Code App project structure with the following components:
Create a well-organized folder structure:
src/
├── components/ # Reusable UI components
├── services/ # Generated connector services (created by PAC CLI)
├── models/ # Generated TypeScript models (created by PAC CLI)
├── hooks/ # Custom React hooks for Power Platform integration
├── utils/ # Utility functions
├── types/ # TypeScript type definitions
├── PowerProvider.tsx # Power Platform initialization component
└── main.tsx # Application entry point
Configure package.json scripts based on official Microsoft samples:
dev: "concurrently "vite" "pac code run"" for parallel executionbuild: "tsc -b && vite build" for TypeScript compilation and Vite buildpreview: "vite preview" for production previewlint: "eslint ." for code qualityInclude a basic sample that demonstrates:
Create comprehensive README.md with:
pac auth create --environment {environment-id} - Authenticate with specific environmentpac env select --environment {environment-url} - Select target environmentpac code init --displayName "App Name" - Initialize code app projectpac connection list - List available connectionspac code add-data-source -a {api-name} -c {connection-id} - Add connectorpac code push - Deploy to Power PlatformFocus on these officially supported connectors with setup examples:
Include working examples for Office 365 Users:
// Example: Get current user profile
const profile = await Office365UsersService.MyProfile_V2(
"id,displayName,jobTitle,userPrincipalName"
);
// Example: Get user photo
const photoData = await Office365UsersService.UserPhoto_V2(profile.data.id);
verbatimModuleSyntax: false in TypeScript configbase: "./" and proper path aliasesEnsure the generated project follows Microsoft's official Power Apps Code Apps documentation and samples from https://github.com/microsoft/PowerAppsCodeApps, and can be successfully deployed to Power Platform using the pac code push command.
Build agentic applications with GitHub Copilot SDK. Use when embedding AI agents in apps, creating custom tools, implementing streaming responses, managing sessions, connecting to MCP servers, or creating custom agents. Triggers on Copilot SDK, GitHub SDK, agentic app, embed Copilot, programmable agent, MCP server, custom agent.
Build and run evaluators for AI/LLM applications using Phoenix.
OpenInference semantic conventions and instrumentation for Phoenix AI observability. Use when implementing LLM tracing, creating custom spans, or deploying to production.
Provides exact patterns for diagnosing and fixing automatic batching regressions in React 18 class components. Use this skill whenever a class component has multiple setState calls in an async method, inside setTimeout, inside a Promise .then() or .catch(), or in a native event handler. Use it before writing any flushSync call - the decision tree here prevents unnecessary flushSync overuse. Also use this skill when fixing test failures caused by intermediate state assertions that break after React 18 upgrade.
Provides exact Enzyme → React Testing Library migration patterns for React 18 upgrades. Use this skill whenever Enzyme tests need to be rewritten - shallow, mount, wrapper.find(), wrapper.simulate(), wrapper.prop(), wrapper.state(), wrapper.instance(), Enzyme configure/Adapter calls, or any test file that imports from enzyme. This skill covers the full API mapping and the philosophy shift from implementation testing to behavior testing. Always read this skill before rewriting Enzyme tests - do not translate Enzyme APIs 1:1, that produces brittle RTL tests.
Provides the complete migration pattern for React legacy context API (contextTypes, childContextTypes, getChildContext) to the modern createContext API. Use this skill whenever migrating legacy context in class components - this is always a cross-file migration requiring the provider AND all consumers to be updated together. Use it before touching any contextTypes or childContextTypes code, because migrating only the provider without the consumers (or vice versa) will cause a runtime failure. Always read this skill before writing any context migration - the cross-file coordination steps here prevent the most common context migration bugs.