create-ignite-kit/readme.md

A CLI tool for generating production-ready React applications.

# 🔥 Create Ignite Kit

[![npm version](https://img.shields.io/npm/v/create-ignite-kit.svg)](https://www.npmjs.com/package/create-ignite-kit)
[![npm downloads](https://img.shields.io/npm/dm/create-ignite-kit.svg)](https://www.npmjs.com/package/create-ignite-kit)
[![license](https://img.shields.io/npm/l/create-ignite-kit.svg)](https://github.com/Sagar585/create-ignite-kit/blob/master/LICENSE)

`create-ignite-kit` is a powerful, interactive Command Line Interface (CLI) tool designed to bootstrap production-ready React applications in seconds. It goes beyond basic templates by setting up a robust, scalable architecture with your choice of configurations, allowing you to start developing features immediately.

This tool is built upon a production-grade template that already includes:
- ⚡ **Vite** for lightning-fast tooling and development
- 🔧 **Git, Husky, commitlint, and lint-staged** for a professional Git workflow
- ✨ **ESLint, Prettier, and Stylelint** for code quality and consistency
- 🏗️ **Screaming Architecture** for maintainable project structure
- 📁 **Absolute Paths** for clean imports
- 🧪 **Unit Testing** with Vitest and React Testing Library
- 🚀 **CI/CD Pipeline** setup with GitHub Actions
- 🐛 **Error Tracking** with Sentry integration
- 🎨 **Tailwind CSS** pre-configured for styling

## 🚀 Quick Start

The fastest way to create a new React project:

```bash
npm create ignite-kit@latest
```

Or with a specific project name:

```bash
npm create ignite-kit@latest my-awesome-app
```

### Alternative Methods

You can also use:

```bash
# Using npx
npx create-ignite-kit@latest

# Using yarn
yarn create ignite-kit@latest

# Using pnpm
pnpm create ignite-kit@latest
```

## 🛠️ Interactive Setup

The CLI will guide you through a series of questions to tailor the project to your specific needs:

### Current Options

You will be prompted to select your preferred tools for:

1.  **🏪 State Management:**
    - `Redux Toolkit` - Industry-standard predictable state container
    - `Zustand` - Lightweight and flexible state management
    - `None` - Use React's built-in state management

2.  **🎨 UI Library:**
    - `Material UI` - React components implementing Google's Material Design
    - `Tailwind CSS` - Utility-first CSS framework (already pre-configured)
    - `None` - Use custom styling

3.  **🔄 Data Fetching:**
    - **TanStack Query (React Query):** Powerful server-state management with caching, synchronization, and background updates

4.  **🐳 Containerization:**
    - **Docker:** Multi-stage production-ready Dockerfile with optimized build process

5.  **📦 Dependency Installation:**
    - Choose whether to automatically install npm dependencies after project creation
    - Skip installation if you prefer to install manually or use a different package manager

## 📋 What You Get

After running the CLI, you'll have a fully configured project with:

### 📁 **Project Structure**
```
your-project/
├── src/
│   ├── features/           # Feature-based architecture
│   ├── shared/            # Shared components and utilities
│   ├── store/             # State management (if selected)
│   └── main.tsx           # Application entry point
├── public/                # Static assets
├── .github/workflows/     # CI/CD pipeline
├── Dockerfile             # Docker configuration (if selected)
└── Configuration files    # ESLint, Prettier, Vite, etc.
```

### 🔧 **Development Tools**
- **Hot Module Replacement** with Vite
- **Type Safety** with TypeScript
- **Code Quality** with ESLint and Prettier
- **Git Hooks** with Husky for automated checks
- **Commit Linting** for consistent commit messages
- **Pre-commit Hooks** with lint-staged

### 🧪 **Testing Setup**
- **Unit Testing** with Vitest
- **Component Testing** with React Testing Library
- **Coverage Reports** included

### 🚀 **Production Ready**
- **Optimized Build** with Vite
- **Docker Support** for containerized deployments
- **CI/CD Pipeline** with GitHub Actions
- **Error Tracking** with Sentry integration
- **Environment Configuration** with example .env files

## 🎯 Getting Started

After creating your project:

```bash
cd your-project-name

# If you chose not to install dependencies automatically:
npm install

# Copy environment variables
cp .env.example .env

# Start development server
npm run dev
```

### Available Scripts

```bash
npm run dev          # Start development server
npm run build        # Build for production
npm run preview      # Preview production build
npm run test         # Run tests
npm run test:watch   # Run tests in watch mode
npm run lint         # Run ESLint
npm run format       # Format code with Prettier
```

## 🐳 Docker Support

If you selected Docker support, you can containerize your application:

```bash
# Build Docker image
docker build -t your-app-name .

# Run container
docker run -p 3000:3000 your-app-name
```

## 🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

## 📄 License

This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.

## 🔗 Links

- **NPM Package:** [npmjs.com/package/create-ignite-kit](https://www.npmjs.com/package/create-ignite-kit)
- **GitHub Repository:** [github.com/Sagar585/create-ignite-kit](https://github.com/Sagar585/create-ignite-kit)
- **Issues & Support:** [github.com/Sagar585/create-ignite-kit/issues](https://github.com/Sagar585/create-ignite-kit/issues)

## 🌟 Show Your Support

If this project helped you, please consider giving it a ⭐ on [GitHub](https://github.com/Sagar585/create-ignite-kit)!

---

**Built with ❤️ by [Sagar Bhanushali](https://github.com/Sagar585)**

*This project is actively maintained and continuously improved with new features and integrations.*