Skill v1.0.1
currentAutomated scan100/1009 files
version: "1.0.1" name: project-scaffolding description: > IDE-grade project scaffolding wizard for creating new projects with comprehensive configuration. Supports 70+ project types: HTML/CSS websites, React, Next.js, Vue, Astro, Remix, React Native, Flutter, Expo, FastAPI, Django, Express, NestJS, Go/Gin, Rust/Axum, Spring Boot, Hono, Elysia, Chrome Extensions, VS Code Extensions, Tauri desktop apps, serverless functions, and more. Provides WebStorm/PyCharm-level project creation with interactive SDK selection, framework configuration, database setup, and DevOps tooling. Use when: creating a new project, setting up a framework application, initializing a codebase, scaffolding boilerplate, building extensions, creating mobile/desktop/web apps, setting up monorepos, or making static websites/landing pages.
Project Scaffolding Wizard
Professional-grade project scaffolding comparable to WebStorm/PyCharm project wizards. Creates fully configured projects with SDK setup, framework options, database configuration, linting, and CI/CD.
Version Freshness
All dependency versions live in assets/versions.json — never hardcode a version in generated output or in scripts/scaffold.py. Treat that manifest as the only source of truth.
Before recommending frameworks in Step 3, check how stale it is:
python3 scripts/scaffold.py --version-status
- Under 30 days — proceed without comment.
- 30–90 days — proceed, and mention the manifest's age once when presenting version-sensitive
choices.
- Over 90 days — say so before recommending, and offer to refresh:
python3 scripts/refresh_versions.py (dry run; add --apply to write).
Never guess at current versions or "update" the manifest from memory. Registry facts come only from refresh_versions.py, which queries npm and PyPI directly. If the refresh cannot run (no network), state that the versions may be stale rather than substituting recalled numbers.
Wizard Workflow
When a user requests a new project, follow this interactive workflow:
Step 1: Project Type Selection
Present the project type menu. Ask the user to select a category and type:
| Category | Types | |
|---|---|---|
| Static Websites | HTML5 (no CSS), HTML/CSS, HTML+Sass, HTML+Tailwind, Landing Page, Multi-page Site | |
| Frontend Web | React, Next.js, Vue, Nuxt, Svelte, Angular, Astro, Remix, Solid, Qwik, Preact | |
| Mobile/Desktop | React Native, Expo, Flutter, Tauri, Electron, Ionic | |
| Backend (JS/TS) | Express, NestJS, Fastify, Hono, Elysia, tRPC, Koa | |
| Backend (Python) | FastAPI, Django, Django REST, Flask, Litestar | |
| Backend (Go) | Gin, Fiber, Echo, Chi | |
| Backend (Rust) | Axum, Actix, Rocket | |
| Backend (Java) | Spring Boot, Quarkus, Ktor, Micronaut | |
| Backend (Other) | Laravel, Rails, .NET Web API | |
| Libraries | TypeScript NPM, Python PyPI, Go Module, Rust Crate | |
| CLI Tools | Node CLI, Python CLI (Typer/Click), Go CLI (Cobra), Rust CLI (Clap) | |
| Extensions | Chrome Extension, Firefox Extension, VS Code Extension, Figma Plugin, Obsidian Plugin | |
| Serverless | AWS Lambda, Cloudflare Workers, Vercel Functions, Supabase Functions | |
| Full-Stack | T3 Stack, MERN, PERN, MEAN | |
| Monorepos | Turborepo, Nx Workspace, pnpm Workspace |
Step 2: Basic Configuration
Gather for ALL projects:
- Project name (required)
- Location/directory
- Description
- Author name
- License (MIT, Apache-2.0, GPL-3.0, ISC, Unlicense)
Step 3: Framework-Specific Options
Load references/wizard-options.md for detailed configuration options based on the selected project type. Key decisions include:
- Language/SDK version - Node.js, Python, Go, Rust, Java versions
- Package manager - npm, pnpm, yarn, bun, poetry, uv
- CSS framework - Tailwind, CSS Modules, Styled Components
- State management - Zustand, Redux, Jotai, TanStack Query
- Database/ORM - PostgreSQL, SQLite, Prisma, SQLAlchemy, sqlc
- Authentication - NextAuth, JWT, OAuth2
- Testing - Vitest, Jest, pytest, Playwright
Step 4: Code Quality & DevOps
- Linting - ESLint, Ruff, golangci-lint, clippy
- Formatting - Prettier, Ruff, gofmt, rustfmt
- Pre-commit hooks - husky + lint-staged, pre-commit framework
- CI/CD - GitHub Actions, GitLab CI
- Docker - Dockerfile (multi-stage), docker-compose
- Deployment - Vercel, Railway, Fly.io, AWS, self-hosted
Step 5: Generate Project
Use scripts/scaffold.py or native CLI tools to create the project structure.
CLI Integration
Prefer native CLI tools when available:
| Framework | CLI Command | |
|---|---|---|
| Next.js | npx create-next-app@latest | |
| React (Vite) | npm create vite@latest -- --template react-ts | |
| Vue | npm create vue@latest | |
| Nuxt | npx nuxi@latest init | |
| Astro | npm create astro@latest | |
| Remix | npx create-remix@latest | |
| SvelteKit | npm create svelte@latest | |
| Solid | npm create solid@latest | |
| Expo | npx create-expo-app@latest | |
| React Native | npx @react-native-community/cli init | |
| Flutter | flutter create | |
| Tauri | npm create tauri-app@latest | |
| NestJS | npx @nestjs/cli new | |
| Spring Boot | spring init or start.spring.io | |
| Go | go mod init | |
| Rust | cargo new | |
| Chrome Ext | npm create plasmo@latest | |
| T3 Stack | npx create-t3-app@latest |
Quick Start Examples
HTML/CSS Website
mkdir my-website && cd my-websitetouch index.html style.css# Or use boilerplate:npx degit h5bp/html5-boilerplate my-website
HTML + Tailwind (CDN)
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>My Website</title><script src="https://cdn.tailwindcss.com"></script></head><body class="bg-gray-100"><h1 class="text-3xl font-bold">Hello World</h1></body></html>
T3 Stack (Next.js + tRPC + Prisma)
npx create-t3-app@latest my-app
Expo (React Native)
npx create-expo-app@latest my-app --template tabs
Tauri Desktop App
npm create tauri-app@latest my-app -- --template react-ts
Chrome Extension
npm create plasmo@latest my-extension
Example Conversations
Simple HTML/CSS Website
User: Create a simple website with HTML and CSSClaude: I'll create a static HTML/CSS website:- Multi-page (Home, About, Contact)- Mobile-first responsive CSS- BEM naming convention- Live Server for developmentStructure:my-website/├── index.html├── about.html├── contact.html├── css/style.css├── js/main.js└── images/Shall I create this?
Mobile App
User: Create a mobile app for iOS and AndroidClaude: I recommend Expo for the easiest setup:- TypeScript- Expo Router (file-based navigation)- NativeWind (Tailwind for RN)- Tab navigation templateReady to scaffold?
Full-Stack with Type Safety
User: Create a full-stack app with type-safe APIClaude: I recommend the T3 Stack:- Next.js 16 (App Router)- tRPC (type-safe API)- Prisma (type-safe ORM)- Tailwind CSS- NextAuth.js- PostgreSQL with docker-composeThis gives you full type safety from database to frontend!
Chrome Extension
User: Build a Chrome extensionClaude: What features do you need?- Popup UI- Content script (modifies pages)- Background service worker- Side panelTech stack: React + Vite + TypeScript + Manifest V3I recommend using Plasmo framework for easier development.
Recording Observations
This skill improves from real usage. Append a line to assets/observations.md when — and only when — one of these happens during a scaffolding session:
| Trigger | Example line | ||||
|---|---|---|---|---|---|
| User rejects a recommended default | `2026-09-12 | default-rejected | react | user chose Jest over Vitest, wanted existing-team familiarity` | |
| Requested framework or option is missing | `2026-09-12 | missing-option | backend | user asked for Encore.ts, not in wizard` | |
| Generated project fails to install or start | `2026-09-12 | broken-output | nextjs | npm install failed, eslint-config-next peer conflict` | |
| A template is wrong for the pinned major | `2026-09-12 | template-drift | react | template used legacy API removed in current major` |
Format: DATE | TAG | project-type | one-line factual description. Record only what actually happened — never speculation about what users might want. Do not log successful, unremarkable scaffolds; a log of routine successes carries no signal and buries the real findings.
Use the scaffolding-maintainer skill to act on the accumulated log.
Available Resources
Load reference files based on what you need:
| Resource | When to Load | Purpose | |
|---|---|---|---|
assets/versions.json | Always, via v()/req() in scaffold.py | Single source of truth for every dependency version | |
references/wizard-options.md | During Step 3 (gathering user preferences) | Configuration choices and defaults for each framework | |
references/frameworks.md | When generating code | Project structures, code examples, configuration files | |
references/best-practices.md | For architecture decisions | Directory organization, naming conventions, patterns | |
scripts/scaffold.py | For custom scaffolding | Python engine when CLI tools aren't suitable | |
scripts/refresh_versions.py | When the manifest is stale | Queries npm/PyPI for current versions |
Workflow:
- Present options from
wizard-options.mdto gather user preferences - Use
frameworks.mdfor code patterns and project structure when generating - Consult
best-practices.mdfor architecture decisions
Default Recommendations
Runtime and SDK versions are not listed here — they live in assets/versions.json under runtimes and are reported by python3 scripts/scaffold.py --version-status. Read them from there so this table cannot drift out of sync with what the scaffolder actually generates.
| Category | Recommendation | |
|---|---|---|
| Package Manager | pnpm | |
| CSS Framework | Tailwind CSS | |
| State (React) | Zustand + TanStack Query | |
| ORM (Node) | Prisma | |
| ORM (Python) | SQLAlchemy 2.0 | |
| ORM (Go) | sqlc | |
| Testing (JS) | Vitest | |
| Testing (Python) | pytest | |
| E2E Testing | Playwright | |
| Linting (JS) | ESLint + Prettier | |
| Linting (Python) | Ruff | |
| CI/CD | GitHub Actions | |
| Containerization | Multi-stage Dockerfile |