frontend-typescript-rules SKILL.md skillA
frontend-typescript-rules from shinpr/ai-coding-project-boilerplate is an agent skill: a SKILL.md folder an AI agent loads when a task calls for it.
mdr add shinpr/ai-coding-project-boilerplate/frontend-typescript-rules@git:20260912.c0d4362Pins git:20260912.c0d4362 in mdr.lock. Pin the fingerprint instead.
- Audit grade
- A, 17 of 17 checks passed
- Kind
- SKILL.md skill
- Repository
- shinpr/ai-coding-project-boilerplate
- Path
.claude/skills-ja/frontend-typescript-rules/SKILL.md- Versions recorded
- 5
- Latest version
- git:20260912.c0d4362, committed Sep 12, 2026
- First version recorded
- Jun 18, 2026
- Size
- 8,385 bytes
- Repository stars
- 234
- License
- MIT
React/TypeScriptの型安全性、コンポーネント設計、状態管理ルールを適用。Reactコンポーネント実装時に使用。.
Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.
What the file says
# TypeScript 開発ルール（フロントエンド）
実装向けの frontend 固有 React/TypeScript ルール: しきい値、境界での型安全性、コンポーネント/状態の設計、エラーハンドリング、プロジェクト規約。
## 前提条件の検出
プロジェクト規約を適用する前に、TypeScript、bundler/framework、lint・format、path alias、React Compiler、代表的なコンポーネントの設定を確認する。設定またはリポジトリで確立済みのパターンに裏付けられた規約を確認済みとして扱い、限られた例から導いた結論には推測であることを明記する。競合するパターンによって公開される振る舞い、互換性、コンポーネント境界が変わる場合は作業を止め、必要な情報源または判断を具体的に示す。
## アンチパターンとしきい値
設計変更を促すシグナル:
- prop drilling が 3 階層以上 → Context または状態管理へ持ち上げる
- コンポーネントが 300 行超 → 分割する
- Props が 10 個超 → コンポーネントを分割（3〜7 個が適正範囲）
- optional Props が 50% 超 → デフォルト値または Context を導入する
- Props のネストが 2 階層超 → フラット化する
## 境界での型安全性
信頼できない型または取得できない型は`unknown`で受け、型ガードで絞り込む。`as`は、runtime/frameworkの不変条件によって対象の型が保証される場合にのみ使用し、その不変条件を近くのコメントに記録する。既存の生成コードまたはサードパーティの型宣言に含まれる`any`は、ラップすべき境界入力であり、アプリケーションの契約へ`any`を広げる根拠にはならない。
アプリ内部では React の Props/State は型保証されており `unknown` は不要。外部境界では必ず `unknown` で受け、使用前に型ガードで絞り込む: API レスポンス、`localStorage`/`sessionStorage`、URL パラメータ、パースした JSON。制御コンポーネントのフォーム入力は React 合成イベントを通じて型安全に保たれる。
```typescript
const raw: unknown = await (await fetch(url)).json()
if (!isUser(raw)) throw new ValidationError('invalid user')
const user = raw // User に絞り込み済み
```
## コンポーネントと状態の設計
…Read the whole file at its exact version.
How to install
mdr add shinpr/ai-coding-project-boilerplate/frontend-typescript-rules@sha256:12acd83c405a3623The line at the top of this page pins the label git:20260912.c0d4362, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.
[](https://markdownregistry.com/a/art_4ogbzdmy47ghzy3m)
2 badge image fetches in 30 days. What the badge shows.
Versions
The registry has recorded 5 versions of this file, between Jun 18, 2026 and Sep 12, 2026, about one every 22 days.
| version | committed | commit | size | audit | |
|---|---|---|---|---|---|
| git:20260912.c0d4362 latest | 2026-09-12 | c0d4362 | 8,385 B | A | view · diff |
| git:20260901.fbc397a | 2026-09-01 | fbc397a | 8,468 B | A | view · diff |
| git:20260901.dd3607b | 2026-09-01 | dd3607b | 8,525 B | A | view · diff |
| git:20260719.3140886 | 2026-07-19 | 3140886 | 8,537 B | A | view · diff |
| git:20260618.8b7b354 | 2026-06-18 | 8b7b354 | 7,172 B | A | view |
Audit of the latest version
- pass: Frontmatter block present
- pass: Frontmatter declares a name
- pass: Frontmatter declares a description
- pass: Size between 200 bytes and 200 KB (8385 bytes)
- pass: No zero-width or bidi control characters
- pass: No instruction hidden inside an HTML comment
- pass: No link to an exfiltration or paste host
- pass: No credential-shaped string
- pass: No instruction to send local credentials anywhere
- pass: No text hidden with inline styles
- pass: No prompt-injection phrasing
- pass: No curl or wget piped into a shell
- pass: No recursive delete of root, home or parent
- pass: No instruction to read or print local credentials
- pass: No base64 blob over 200 characters
- pass: No link to a raw IP address
- pass: No script tag
Source
shinpr/ai-coding-project-boilerplate · 234 stars · license MIT · pushed 2026-10-14 · branch main
API
GET https://markdownregistry.com/api/v1/artifacts/art_4ogbzdmy47ghzy3m GET https://markdownregistry.com/api/v1/resolve?ref=shinpr/ai-coding-project-boilerplate/frontend-typescript-rules GET https://markdownregistry.com/api/v1/blob/12acd83c405a3623e9b0dc1765bcd0863bdf39aa61d7a6b67d9d53acf9da3932
Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.
Guides: the SKILL.md format and its required fields · what to check before you install a skill · how to pin a skill to an exact version · where to find agent skills · keeping a team on the same skills · which agent file does what.
More from shinpr/ai-coding-project-boilerplate
Every file in shinpr/ai-coding-project-boilerplate