skillboardUpdated every 6 hours
skillboardScaffold 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.
Copy a source-pinned command for your client. You run it yourself.
Destination: .claude/skills/power-apps-code-app-scaffold · pinned to the source commit
# Run from your project root
git clone https://github.com/github/awesome-copilot.git .skillboard-tmp
git -C .skillboard-tmp checkout f11a4e441c5ff061b4f8ae37952be8c602e4034e
mkdir -p ".claude/skills"
cp -r ".skillboard-tmp/skills/power-apps-code-app-scaffold" ".claude/skills/"
rm -rf .skillboard-tmpReview the source before running. This copies files into your project; it is not a one-click install and does not verify runtime safety.
sudo apt update && sudo apt install -y gitnpm install -g @anthropic-ai/claude-code# Run from your project root
git clone https://github.com/github/awesome-copilot.git .skillboard-tmp
git -C .skillboard-tmp checkout f11a4e441c5ff061b4f8ae37952be8c602e4034e
mkdir -p ".claude/skills"
cp -r ".skillboard-tmp/skills/power-apps-code-app-scaffold" ".claude/skills/"
rm -rf .skillboard-tmpDestination: .claude/skills/power-apps-code-app-scaffold
Scanner static-checks@0.1.0 · commit f11a4e441c5f. Static checks cannot prove runtime safety – review the source and the exact diff before installing. How checks work.
No static rules matched. This is not a safety guarantee.