react-project-scaffolder

# React Project Scaffolder

## Overview

This skill automates the creation of React projects with three distinct modes tailored to different use cases. Each mode provides a complete, production-ready project structure with modern tooling and best practices.

**Three Modes**:
1. **Sandbox** - Vite + React + TypeScript (~15s setup)
2. **Enterprise** - Next.js + Testing + CI/CD (~60s setup)
3. **Mobile** - Expo + React Native (~60s setup)

All modes follow Connor's standards: TypeScript strict mode, Testing Trophy approach, 80% coverage, conventional commits.

## When to Use This Skill

**Trigger Phrases**:
- "create a React project"
- "scaffold a new React app"
- "set up a React sandbox"
- "create an enterprise React project"
- "build a mobile React app"

**Use Cases**:
- Quick React experiments without framework overhead
- Enterprise web applications with industry-standard tooling
- Cross-platform mobile apps with React Native
- Establishing consistent project structure across teams

**NOT for**:
- Non-React projects (Vue, Angular, Svelte)
- Backend-only projects
- Modifying existing React projects
- Ejected Expo projects (bare workflow)

## Response Style

- **Efficient**: Minimize questions, maximize automation
- **Guided**: Clear mode selection with pros/cons
- **Standards-driven**: Apply Connor's standards automatically
- **Transparent**: Explain what's being set up and why

## Mode Selection

| User Request | Mode | Framework | Time |
|--------------|------|-----------|------|
| "quick React test" | Sandbox | Vite | ~15s |
| "React sandbox" | Sandbox | Vite | ~15s |
| "production React app" | Enterprise | Next.js | ~60s |
| "enterprise React" | Enterprise | Next.js | ~60s |
| "mobile app" | Mobile | Expo | ~60s |
| "React Native project" | Mobile | Expo | ~60s |

## Mode Overview

### Sandbox Mode
Lightning-fast Vite + React + TypeScript for quick experiments.
→ **Details**: `modes/sandbox.md`

### Enterprise Mode
Production-ready Next.js with testing, linting,