frontend-project-standardlisted
Install: claude install-skill VoldemortGin/AI-Coding-Skill-Bible
# Frontend Project Standard
This skill is the guiding standard for **any** TypeScript frontend work. Apply it by default; don't wait to be asked.
Its spine: **trust is placed not in the model, but in the machine-checkable code that constrains it.** TypeScript is strongly typed at authoring time, but — like Python and unlike Rust/Swift — **its types are erased at runtime.** A `User` that the compiler proved is a `User` is just an object once it's running; a `fetch` response typed `as Product[]` is whatever the server actually sent. So the frontend needs *two* layers, exactly mirroring the Python sibling's mypy + pydantic: **`tsc` strict gives the static guarantee, and Zod at the boundary gives the runtime guarantee** — neither alone is enough. On top of that: keep the escape hatches shut (`any` / `!` / `@ts-ignore` / unsafe `as`), push every external dependency behind a provider interface so the model is hot-swappable, organize deep and name-navigable as a pnpm + Turborepo monorepo, and mechanize the implicit knowledge a human would otherwise hold in their head — via a zero-warning gate, a per-package contract, and drift guards. The agent's output ceiling equals the tightness of that loop.
Unlike Python's beartype, there is **no runtime type-checking import hook** in the browser/Node — instrumenting every internal call site is not a thing here. So the runtime layer is concentrated *at the boundaries only* (rule 2): the static gate covers the interior, Zod covers everything