Ultimate Development Framework

A Claude Code skill providing a comprehensive development environment setup and workflow framework. Covers project scaffolding, development toolchain configuration, CI/CD pipelines, testing strategies, and developer experience optimization for modern web and backend applications.

When to Use This Skill

Choose Ultimate Development Framework when:

• You're starting a new project and need a complete development setup
• You want to standardize your development workflow and toolchain
• You need to set up linting, formatting, testing, and CI/CD from scratch
• You're improving developer experience for an existing project
• You want to establish coding standards and contribution guidelines

Consider alternatives when:

• You need specific framework setup (Next.js, Remix, etc.) (use a framework-specific skill)
• You want deployment and infrastructure guidance (use a DevOps skill)
• You need algorithm or data structure help (use an algorithmic workspace skill)

Quick Start

Copy
# Install the skill
claude install ultimate-develop-framework

# Bootstrap a new project
claude "Set up a complete TypeScript monorepo with ESLint, Prettier, Vitest, and GitHub Actions CI"

# Improve existing DX
claude "Audit our project's developer experience. Here's our package.json: [paste]. What's missing?"

# Set up testing infrastructure
claude "Configure a testing strategy for our Next.js app: unit tests with Vitest, integration tests with Playwright, and coverage reporting"

Core Concepts

Modern Development Stack

Layer	Tool	Purpose
Language	TypeScript	Type safety, IDE support
Package Manager	pnpm / Bun	Fast, disk-efficient dependencies
Bundler	Vite / Turbopack	Fast dev server, optimized builds
Linting	ESLint + typescript-eslint	Code quality enforcement
Formatting	Prettier / Biome	Consistent code style
Testing	Vitest / Jest	Unit and integration testing
E2E Testing	Playwright	Browser automation testing
CI/CD	GitHub Actions	Automated build, test, deploy
Git Hooks	Husky + lint-staged	Pre-commit quality gates

Project Structure

project-root/
├── .github/
│   └── workflows/       # CI/CD pipeline definitions
├── src/
│   ├── lib/             # Shared utilities and helpers
│   ├── services/        # Business logic and external integrations
│   ├── types/           # TypeScript type definitions
│   └── index.ts         # Entry point
├── tests/
│   ├── unit/            # Unit tests mirroring src/ structure
│   ├── integration/     # Integration tests
│   └── e2e/             # End-to-end tests
├── scripts/             # Build and automation scripts
├── .eslintrc.js         # ESLint configuration
├── .prettierrc          # Prettier configuration
├── tsconfig.json        # TypeScript configuration
├── vitest.config.ts     # Test configuration
└── package.json         # Dependencies and scripts

Testing Pyramid

Level	Scope	Speed	Quantity
Unit	Single function/module	Fast (ms)	Many (70%)
Integration	Multiple modules working together	Medium (seconds)	Some (20%)
E2E	Full user flows in browser	Slow (seconds-minutes)	Few (10%)

Configuration

Parameter	Type	Default	Description
language	string	"typescript"	Primary language: typescript, javascript, python, go
framework	string	"nextjs"	Application framework
package_manager	string	"pnpm"	Package manager: npm, pnpm, yarn, bun
testing_framework	string	"vitest"	Test framework: vitest, jest, mocha
ci_platform	string	"github_actions"	CI: github_actions, gitlab_ci, circleci

Best Practices

1. Automate everything from day one — Set up linting, formatting, testing, and CI before writing business logic. The cost of adding these later grows exponentially. A 30-minute setup saves hundreds of hours over the project's lifetime.

2. Use strict TypeScript settings — Enable strict: true, noUncheckedIndexedAccess, and exactOptionalPropertyTypes. Strict settings catch bugs at compile time that would otherwise be runtime errors. The initial type-fixing effort pays for itself immediately.

3. Keep CI fast — If CI takes longer than 10 minutes, developers will stop waiting for it and merge without checking. Parallelize test suites, cache dependencies, and only run affected tests on PRs.

4. Lint and format on pre-commit — Use Husky and lint-staged to run ESLint and Prettier only on staged files. This keeps the codebase consistent without slowing down development.

5. Document your development setup — Write a README that gets a new developer from zero to running the project in under 15 minutes. Include prerequisites, setup commands, and common troubleshooting.

Common Issues

CI passes locally but fails on CI — Usually caused by OS differences, missing environment variables, or different Node.js versions. Use a .node-version or .nvmrc file and ensure CI uses the same version. Pin dependency versions to avoid surprise updates.

Tests are slow and flaky — Isolate unit tests from external dependencies using mocks. Don't use real databases or APIs in unit tests. For integration tests, use testcontainers or in-memory databases. Retry flaky E2E tests once before failing.

Too many linting rules cause friction — Start with a popular preset (eslint:recommended + typescript-eslint/recommended) and customize gradually. Disable rules that generate noise without catching real bugs. Every rule should justify its existence.