🚀 EmirApp CLI

A powerful command-line tool to quickly scaffold modern Expo React Native applications with authentication, tab navigation, TypeScript, and React Query pre-configured.

✨ Features

• 🎯 Expo React Native - Modern React Native framework with Expo Router
• 🔐 Authentication Flow - Complete phone number + OTP authentication
• 📱 Tab Navigation - Beautiful tab navigation with Expo icons
• 🔷 TypeScript First - Full TypeScript support out of the box
• 🎨 Modern UI - Clean, professional design with proper styling
• 🔄 React Query - Data fetching and caching with TanStack React Query
• 📦 Complete Structure - Well-organized folder structure and components
• 🔧 Ready to Use - All dependencies installed and configured
• 🌈 Beautiful CLI - Colorful interface with spinners and progress indicators
• ⚡ Fast Setup - Optimized for speed with parallel operations
• 🎨 ASCII Art Banner - Eye-catching welcome screen

📋 Table of Contents

• Quick Start
• Installation
• Usage
• Project Structure
• How It Works
• Development
• Contributing
• License

🚀 Quick Start

Get started in seconds with no global installation required:

npx emirapp-cli

Follow the interactive prompts and you'll have a fully configured Next.js application ready to go!

📦 Installation

Option 1: Use with npx (Recommended)

No installation needed - just run when you need it:

npx emirapp-cli

Option 2: Global Installation

Install globally for repeated use:

npm install -g emirapp-cli
# Then run anywhere
emirapp

🎯 Usage

Interactive Setup

Run the CLI and follow the guided setup:

npx emirapp-cli

Step-by-Step Process

1. Choose Framework

   • Currently supports Next.js with App Router
   • More frameworks coming soon!

2. Select Project Structure

   • Simple: Perfect for most projects
   • Enterprise: Coming soon with advanced patterns

3. Enter App Name

   • Accepts letters, numbers, spaces, dashes, and underscores
   • Automatically sanitized to kebab-case

What Happens Next

The CLI will automatically:

1. ✅ Create a new Next.js app with TypeScript and Tailwind CSS
2. ✅ Set up the enterprise folder structure
3. ✅ Generate barrel export files for clean imports
4. ✅ Install additional dependencies (Zod, React Query)
5. ✅ Provide next steps instructions

📁 Project Structure

Your generated project will have this clean, scalable structure:

my-next-app/
├── 📁 src/
│   ├── 📁 app/                    # Next.js App Router
│   │   ├── 📁 (auth)/            # Authentication routes
│   │   ├── 📁 (protected)/       # Protected routes
│   │   └── 📁 (unprotected)/     # Public routes
│   ├── 📁 api/                    # API layer
│   │   ├── 📁 hooks/             # Custom React hooks
│   │   └── 📁 services/          # API service functions
│   ├── 📁 components/             # React components
│   │   ├── 📁 common/            # Shared components
│   │   ├── 📁 features/          # Feature-specific components
│   │   ├── 📁 icons/             # Icon components
│   │   ├── 📁 layout/            # Layout components
│   │   ├── 📁 modals/            # Modal components
│   │   └── 📁 ui/                # UI/Design system components
│   ├── 📁 context/               # React Context providers
│   ├── 📁 data/                  # Data management
│   │   └── 📁 stores/            # State stores
│   ├── 📁 lib/                   # Utility libraries
│   └── 📁 types/                 # TypeScript type definitions
├── 📁 public/                     # Static assets
├── 📄 package.json
├── 📄 tsconfig.json
├── 📄 tailwind.config.js
└── 📄 next.config.js

🔄 Barrel Exports

Each major folder includes an index.ts file for clean imports:

// src/components/ui/index.ts
export { default as Button } from "./Button";
export { default as Input } from "./Input";
export { default as Modal } from "./Modal";

This enables clean imports throughout your app:

import { Button, Input, Modal } from "@/components/ui";

⚙️ How It Works

Technologies Used

• prompts - Interactive CLI prompts
• execa - Process execution
• fs-extra - Enhanced file system operations
• chalk - Terminal string styling and colors
• ora - Elegant terminal spinners
• gradient-string - Beautiful color gradients
• figlet - ASCII art text generation

Process Flow

1. 🎯 Interactive prompts collect user preferences
2. 🏗️ Executes create-next-app with optimal configuration
3. 📁 Creates enterprise-grade folder structure
4. 📝 Generates barrel export files for clean imports
5. 📦 Installs additional dependencies via Yarn
6. ✅ Provides success feedback and next steps

🛠️ Development

Prerequisites

• Node.js 16+
• Yarn or npm

Local Development Setup

1. Clone the repository

   git clone <repository-url>
   cd emirapp-cli

2. Install dependencies

   yarn install

3. Build the CLI

   yarn build

4. Link for local testing

   npm link

5. Test your changes

   emirapp

6. Unlink when done

   npm unlink -g emirapp-cli

Available Scripts

• yarn build - Compile TypeScript to JavaScript
• yarn start - Run the compiled CLI
• yarn prepare - Pre-publish build step

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.

Development Guidelines

1. Follow the existing code style
2. Add tests for new features
3. Update documentation as needed
4. Ensure all tests pass before submitting

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Next.js team for the amazing framework
• All the open-source libraries that make this tool possible
• The developer community for feedback and contributions

Made with ❤️ for the developer community

Happy coding! 🚀