agentmods.dev

code-apps

A guide for building Power Apps Code Apps: browser-based applications hosted in Microsoft Power Apps. It uses TypeScript, React, Tailwind CSS, and Dataverse, Microsoft's data platform.

In plain words
What is it for?
Use it to design screens, create a React and Vite app, connect it to Dataverse, configure security-related browser rules, send email, and deploy updates.
Why use it?
It gives a defined path from screen design to deployment and data connection, reducing uncertainty when setting up and updating these applications.

Skill for Claude CodeCodex

59 4d ago A scan 66 tokens original MIT
View the source file geekfujiwara/CodeAppsDevelopmentStandard
Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add skills/geekfujiwara/codeappsdevelopmentstandard/code-apps
Any agent
npx skills add geekfujiwara/CodeAppsDevelopmentStandard --skill code-apps
Clone the repo
git clone --depth 1 https://github.com/geekfujiwara/CodeAppsDevelopmentStandard

Made for: Claude Code, Codex.

Per session 66 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 12,034 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5 $0.00066 $0.12034
Opus 5 $0.00033 $0.06017
Sonnet 5 $0.00013 $0.02407
Haiku 4.5 $0.00007 $0.01203

Measured 2d ago against content hash df85c2e954ef, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

code-apps scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.

The scan reads SKILL.md. This mod also ships 1 executable file (references/patch-nameutils.cjs), listed below but not scanned — reading those needs a real analyzer, not pattern matching.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

.github/skills/code-apps/SKILL.md · 589 lines

How it starts

The opening of the file, as written. The whole thing — 589 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Code Apps 開発スキル

Power Apps Code Apps（コードファースト）を TypeScript + React + Tailwind CSS で開発する。 UI 設計・CSP 構成・メール送信パターンまで Code Apps 開発の全領域をカバーする統合スキル。

[!NOTE] 本スキルは React + Vite の Web Code Apps 用。Expo／React Native、camera／barcode／location 等の 端末ネイティブ機能、Power Apps Developer app、Wrap が要件なら mobile-apps へ切り替える。Native は Private Preview で本番利用できない。

[!NOTE] Microsoft Learn の現行概要では、Code Apps は React / Vue などの SPA を Power Apps 上でホストする仕組み とされている。 この開発標準はその中でも React ベース実装に標準化したガイドであり、他フレームワーク一般論ではなく、このリポジトリのテンプレートと運用実績に基づく推奨事項をまとめている。

1. 概要

Code Apps 開発は 設計 → 初回デプロイ → データソース接続 → 改善デプロイ の順に進む。

[!NOTE] サブエージェント並行実行パターン: architecture スキルで Code Apps が確定し、dataverse スキルで スキーマが承認されたタイミングで、このスキルがサブエージェントとして起動される。 Dataverse 構築（--skip-localize フェーズ）と Code Apps 開発（scaffold → deploy → add-data-source）は 並行して進める。Dataverse 構築が先に終わったら --localize-only でローカライズ＆デモデータ投入。

標準ワークフロー全体像

[設計]  ① デザインテンプレートを選ばせる（6種・プレビュー付き）
        ② 画面設計（design-pattern）→ ユーザー承認
          │
[§2 初回デプロイ]
        ③ テンプレート scaffold + npm install（Dataverse 構築 Phase 2 と並行して即着手／VS Code では Code Apps サブエージェントとして起動）
        ④ ソリューション + 接続参照を用意（setup_connection_reference.py）★init より前
        ⑤ npx power-apps init（power.config.json 生成）
        ⑥ vite.config.ts 必須設定の確認 / .env 設定
        ⑦ npm run deploy -- --solution-id {GUID}（build + power-apps push）★初回 push でソリューション所属が確定
          │
[§3 データソース接続]
        ⑧ npx power-apps add-data-source --api-id shared_commondataserviceforapps -cr ... -s ...（1 回だけ）
        ⑨ MicrosoftDataverseService + *WithOrganization ラッパーを実装
          │
[§4 改善デプロイ]
  ⑩ src/ 実装 → npm run deploy（power-apps push を反復）
  ⑪ 最終 push 後に power-apps share（利用者は play、共同開発者だけ edit）

この後の章構成

章 内容
§1 概要（本章） 標準ワークフロー全体像・大前提・設計フェーズ（デザインテンプレート選択）
§2 初回デプロイ 環境前提・scaffold・ソリューション/接続参照の準備・init・初回 build & push
§3 データソース接続 add-data-source（接続参照バインド）・MicrosoftDataverseService・Lookup 名前解決
§4 改善デプロイ 開発時の必須ルール・再デプロイ・プレデプロイレビュー
§5 リファレンス 全リファレンス索引・技術スタック・.env

Read the full file on GitHub · 589 lines

Files

What ships with it

60 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 2d ago First seen · 589 lines · 66 tokens per session scan A df85c2e954ef

Subscribe to this mod's changes

code-apps is a skill published in the GitHub repository geekfujiwara/CodeAppsDevelopmentStandard (59 stars, last pushed 4d ago), licensed MIT. It adds 66 tokens to every session and 12,034 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

DevOps and cloudFrontendSecurityui
Related

Other skills, from other repositories

compiler-orchestrator

Orchestrate the Rust compiler port end-to-end. Discovers the current frontier, fixes failing passes, ports new passes, reviews, and commits in a loop.

react/react · 38 tokens

feature-flags

Use when feature flag tests fail, flags need updating, understanding @gate pragmas, debugging channel-specific test failures, or adding new flags to React.

react/react · 34 tokens

frontend-unit-testing

Write comprehensive, behaviour-driven unit tests for Gradio frontend Svelte components using Vitest browser mode, Playwright, and the @self/tootils test utilities.

gradio-app/gradio · 37 tokens

gradio-themes

Build and customise Gradio themes. Use when creating, editing, or publishing Python-based Gradio themes that control colours, typography, spacing, shadows, and dark mode.

gradio-app/gradio · 39 tokens

hf-gradio

Use Gradio applications via API. Use when the user asks for to generate a prediction from a Gradio app on Hugging Face spaces or public URL. For example, "Generate an image using black-forest-labs/FLUX.2-dev".

gradio-app/gradio · 55 tokens

compiler-port

Port a compiler pass from TypeScript to Rust. Gathers context, plans the port, implements in a subagent with test-fix loop, then reviews.

react/react · 35 tokens