Works with the AI tools you already use

    Claude CodeClaude CodeCursorCursorCodex CLICodex CLIMuseMuseOpenClawOpenClaw+21 more

    TypeScript App Blueprint

    1

    Scaffold any TypeScript product - web app, API, package, or CLI - with strict types, pnpm tooling, validated env vars, and a single verify gate.

    Free

    1 installSecurity scanned
    TypeScript App Blueprint

    TypeScript App Blueprint

    Example session with this skill installed

    I'm bootstrapping a new TypeScript monorepo at ~/repos/ledgerline. It needs a Fastify HTTP backend (users + transactions endpoints, JSON input validation) and a React + Vite admin dashboard that talks to it. Node 22, pnpm workspaces, strict mode - we had a production outage last month because someone read process.env.DATABASE_URL without a default. Set up the whole scaffold: tsconfigs, eslint flat config, prettier, vitest with coverage for both packages, validated env schemas with .env.example files, standard scripts including a single verify gate, and a /health route on the API. Tell me exactly what to run to confirm it's green.

    • Read your context and instructions
    • Compiled the typescript app blueprint

    Summary

    Scaffolded ledgerline as a pnpm workspace with a strict-typed Fastify API and a React + Vite dashboard. Environment variables are now Zod-validated at the edge - no raw process.env reads anywhere in business code.

    MetricBeforeAfter
    tsconfig strict flags1 of 9all 9, shared base config
    pnpm verify gatenone (ad-hoc)lint + typecheck + test + build
    env vars read unvalidated60 (typed env.ts + .env.example)
    test coverage reportingnonev8, text + lcov, both packages

    Bootstrap commands

    pnpm init && git init
    pnpm add -D typescript vitest @vitest/coverage-v8 \
      eslint @eslint/js typescript-eslint prettier @types/node
    pnpm add fastify zod && pnpm add -D tsx
    pnpm verify
    

    verify currently exits 0: 14 tests green, including two env tests - safe defaults applied when optional values are absent, and PORT=999999 rejected at boot.

    Next steps

    • Fill real secrets in .env, keep .env.example as the only committed template
    • Add src/repositories/ data layer under the existing routes/services split
    • Wire a CI job that runs pnpm verify on every pull request
    • Delete the demo /api/v1/users echo handler once the DB is connected

    Connects securely to your tools. The creator never sees your data.

    About this skill

    Stop wasting time fixing broken ESM imports, missing types, and conflicting lockfiles. Starting a new TypeScript project usually involves a tedious ritual of configuring tsconfig.json, setting up a test runner, and manually creating .env.example files. This skill automates the boring parts of project initialization, delivering a production-ready structure that actually builds.

    What it does

    • Standardizes architecture by scaffolding Next.js web apps, Fastify services, CLI tools, or reusable libraries.
    • Enforces strict typing with a pre-configured, high-integrity tsconfig.json for Node or browser environments.
    • Secures configuration by generating Zod-validated environment variable schemas and mock .env files.
    • Bootstraps quality gates including ESLint, Prettier, and Vitest configurations that work together.
    • Orchestrates monorepos using pnpm workspaces for managing multiple related packages and apps.

    How it works

    1. Define the target, such as an API service, a frontend app, or a CLI utility.
    2. Review the blueprint which provides the directory structure and specific configuration files.
    3. Execute the commands provided to install dependencies, initialize git, and set up the pnpm environment.
    4. Run the verify gate using pnpm verify to ensure linting, types, and tests are green from minute one.

    Frameworks & tools

    Uses TypeScript, pnpm, Vitest, ESLint, Prettier, and Zod. Support for Next.js, Vite, Fastify, and Commander.

    Why this beats prompting it yourself

    Most LLMs generate fragmented code snippets that fail at the integration layer, like missing .js extensions in ESM or incompatible Vitest environments. This skill provides a cohesive, tested boilerplate that follows current best practices for the pnpm and TypeScript ecosystem.

    Use cases

    • Scaffold a new Fastify backend with request validation and structured logging.
    • Initialize a publishable npm library with CJS/ESM exports and type declarations.
    • Set up a Next.js App Router project with a clean test suite and strict type checking.
    • Convert an ambiguous project idea into a runnable pnpm workspace.

    Known limitations

    Requires pnpm to be installed on the local machine. Does not include CI/CD YAML files for specific cloud providers like AWS or GCP.

    How to install

    Works the same in every agent - Claude, Cursor, Codex, Copilot and 20+ more.

    ~30 seconds
    1. 1

      Download the ZIP

      Free skills download straight away. Paid skills unlock right after purchase.

    2. 2

      Unzip into your skills folder

      Every agent reads skills from one folder on your machine. Drop the unzipped folder in there.

    3. 3

      Ask your agent to use it

      Restart the agent if it was already running. It picks the skill up automatically - no config needed.

    Skills folder by agent

    Click the path to copy it. Create the folder if it does not exist yet.

    Reviews

    No reviews yet

    Be one of the first to try it. Every listed skill passes our trust checks below.

    Security scanned

    Passed our 8-point scan before listing

    1 install

    Downloaded by developers to date

    Free forever

    No account required to browse

    Trust & safety

    Security scanned

    Verified clean today

    • Free to download with an account

    Listedtoday

    What's inside

    Frequently Asked Questions