create-gufran-expo-app 2.0.4 → 2.0.6

package/README.md

@@ -1,21 +1,16 @@
-# 🚀 @gufran/expo-boilerplate
+# create-gufran-expo-app
 
-![npm version](https://img.shields.io/npm/v/@gufran/expo-boilerplate.svg)
-![downloads](https://img.shields.io/npm/dt/@gufran/expo-boilerplate.svg)
-![license](https://img.shields.io/npm/l/@gufran/expo-boilerplate.svg)
+[![npm version](https://img.shields.io/npm/v/create-gufran-expo-app.svg)](https://www.npmjs.com/package/create-gufran-expo-app)
+[![npm downloads](https://img.shields.io/npm/dt/create-gufran-expo-app.svg)](https://www.npmjs.com/package/create-gufran-expo-app)
+[![license](https://img.shields.io/npm/l/create-gufran-expo-app.svg)](https://github.com/GufranGaury1887/Boiler_Plat_Expo_-Gufran/blob/main/LICENSE)
 
-**Ultimate Expo React Native Boilerplate** - A professionally configured Expo environment designed for production-ready applications. Skip the tedious setup and dive straight into building amazing features!
+A CLI tool to create production-ready Expo React Native apps with Firebase, Navigation, TypeScript, and more. Works offline - no git clone needed!
 
----
-
-## ✨ Why Choose This Boilerplate?
-
-This boilerplate provides a complete, production-ready setup with enterprise-grade features:
+## Features
 
 - 🔥 **Firebase Integration** - Authentication, Push Notifications, Analytics
-- 🎨 **Professional UI** - Pre-built components and screens
 - 🗂️ **Clean Architecture** - Organized folder structure that scales
-- ☁️ **Cloud Storage** - Azure Blob Storage for file uploads
+- ☁️ **Azure Blob Storage** - File uploads with progress tracking
 - 🔐 **Authentication Flow** - Complete auth screens and navigation
 - 📱 **Native Features** - Camera, Image Picker, Permissions
 - 🔔 **Push Notifications** - Notifee and Firebase Messaging
@@ -23,390 +18,134 @@ This boilerplate provides a complete, production-ready setup with enterprise-gra
 - 📊 **State Management** - Zustand for efficient state handling
 - 🎯 **TypeScript** - Full type safety
 
----
-
-## 🚀 Quick Start
-
-Create a new project with a single command:
+## Quick Start
 
 ```bash
-npx @gufran/expo-boilerplate my-awesome-app
+npx create-gufran-expo-app my-app
 ```
 
-Or use npm directly:
+## Installation
+
+You don't need to install anything globally. Just use `npx`:
 
 ```bash
-npm create @gufran/expo-boilerplate my-awesome-app
+npx create-gufran-expo-app my-app
 ```
 
-With yarn:
+Or install globally:
 
 ```bash
-yarn create @gufran/expo-boilerplate my-awesome-app
+npm install -g create-gufran-expo-app
+create-gufran-expo-app my-app
 ```
 
-### Interactive Mode
+## Usage
 
-Simply run without a project name to enter interactive mode (will prompt for project name and bundle ID):
+### Basic Usage
 
 ```bash
-npx @gufran/expo-boilerplate
+npx create-gufran-expo-app my-app
 ```
 
----
+### With Bundle ID
 
-## 📋 Command Options
+```bash
+npx create-gufran-expo-app my-app --bundle-id com.mycompany.myapp
+```
+
+### Interactive Mode
 
 ```bash
-npx @gufran/expo-boilerplate [project-name] [options]
+npx create-gufran-expo-app
+# Will prompt for project name and bundle ID
 ```
 
-### Options:
+### Options
 
 | Option | Description |
 |--------|-------------|
-| `-b, --bundle-id <bundleId>` | Bundle identifier (e.g., com.myapp) |
+| `-b, --bundle-id <id>` | Bundle identifier (e.g., com.myapp) |
 | `--skip-install` | Skip automatic dependency installation |
 | `--skip-git` | Skip git initialization |
 | `--npm` | Use npm instead of yarn |
 | `-h, --help` | Display help information |
 | `-V, --version` | Display version number |
 
-### Examples:
-
-```bash
-# Create project with custom bundle ID
-npx @gufran/expo-boilerplate my-app -b com.myapp
-
-# Create project with npm
-npx @gufran/expo-boilerplate my-app --npm
-
-# Skip installation and git init
-npx @gufran/expo-boilerplate my-app --skip-install --skip-git
-
-# Full command with all options
-npx @gufran/expo-boilerplate my-app -b com.myapp --npm
-
-# Interactive mode (prompts for name and bundle ID)
-npx @gufran/expo-boilerplate
-```
-
----
-
-## 📦 What's Included?
-
-### 🎯 Core Technologies
-
-- **Expo SDK 54** - Latest Expo framework
-- **React Native 0.81** - Latest stable RN version
-- **TypeScript** - Full type safety
-- **React Navigation 7** - Native stack navigation
-
-### 🔥 Firebase Services
-
-- Firebase App & Messaging
-- Push Notifications with Notifee
-- Cloud Messaging
-- Analytics ready
-
-### 💾 State & Data Management
-
-- **Zustand** - Lightweight state management
-- **TanStack Query** - Server state management
-- **MMKV** - Fast local storage
-- **React Native Gesture Handler** - Smooth gestures
-
-### 🎨 UI & Media
-
-- Image Picker & Camera
-- Image Zoom capabilities
-- SVG support
-- Reanimated animations
-- Keyboard-aware scrolling
-
-
-### ☁️ Cloud Services
-
-- Azure Blob Storage integration
-- Background file upload
-- Progress tracking
-
-### 🔐 Authentication
-
-- Complete auth flow
-- Context-based auth management
-- Secure storage
-
----
-
-## 📁 Project Structure
+## Project Structure
 
 ```
 my-app/
 ├── src/
 │   ├── assets/          # Images, fonts, icons
 │   ├── components/      # Reusable UI components
-│   │   └── common/      # Common components
 │   ├── config/          # App configuration
 │   ├── constants/       # Constants, themes, strings
-│   ├── contexts/        # React contexts (Auth, etc.)
+│   ├── contexts/        # React contexts
 │   ├── hooks/           # Custom React hooks
 │   ├── navigation/      # Navigation setup
-│   │   ├── AuthStack.tsx
-│   │   ├── MainStack.tsx
-│   │   └── RootNavigator.tsx
 │   ├── screens/         # App screens
-│   │   ├── auth/        # Authentication screens
-│   │   ├── chat/        # Chat features
-│   │   ├── clubs/       # Club management
-│   │   ├── events/      # Events
-│   │   └── ...
 │   ├── services/        # API services
 │   ├── stores/          # Zustand stores
 │   ├── types/           # TypeScript types
 │   └── utils/           # Utility functions
 ├── android/             # Android native code
 ├── ios/                 # iOS native code
-├── FirebaseFiles/       # Firebase configuration files
+├── FirebaseFiles/       # Firebase config samples
 └── assets/              # Root assets
 ```
 
----
-
-## 🛠️ Setup Steps
+## After Project Creation
 
-### 1. Create Your Project
+### 1. Navigate to your project
 
 ```bash
-# Interactive mode (recommended)
-npx @gufran/expo-boilerplate
-
-# Or specify project name and bundle ID
-npx @gufran/expo-boilerplate my-app -b com.myapp
-
 cd my-app
 ```
 
-The CLI will automatically:
-- Create project directory
-- Copy all template files (no git clone needed!)
-- Update `package.json` with your project name
-- Update `app.json` with your project name and bundle IDs
-- Install dependencies (unless --skip-install)
-- Initialize git repository (unless --skip-git)
-
 ### 2. Configure Firebase
 
 Add your Firebase configuration files:
 
-**For Android:**
-```bash
-# Add google-services.json to:
-android/app/google-services.json
-```
-
-**For iOS:**
-```bash
-# Add GoogleService-Info.plist to:
-ios/ClubYakka/GoogleService-Info.plist
-```
+- **Android**: Copy `google-services.json` to `android/app/`
+- **iOS**: Copy `GoogleService-Info.plist` to `ios/YourApp/`
 
-### 3. Install iOS Dependencies
+### 3. Install iOS dependencies
 
 ```bash
 cd ios && pod install && cd ..
 ```
 
-### 4. Verify Configuration
-
-The CLI automatically updates `app.json` with your bundle IDs, but you can verify:
-
-```json
-{
-  "expo": {
-    "name": "my-app",
-    "slug": "my-app",
-    "version": "1.0.0",
-    "ios": {
-      "bundleIdentifier": "com.myapp"
-    },
-    "android": {
-      "package": "com.myapp"
-    }
-  }
-}
-```
-
-### 5. Start Development
+### 4. Start development
 
 ```bash
-# Start Metro bundler
-npm start
-
-# Run on Android
-npm run android
-
-# Run on iOS
-npm run ios
+npm start        # Start Metro bundler
+npm run android  # Run on Android
+npm run ios      # Run on iOS
 ```
 
----
-
-## 🔧 Available Scripts
-
-| Script | Description |
-|--------|-------------|
-| `npm start` | Start Metro bundler |
-| `npm run android` | Run on Android device/emulator |
-| `npm run ios` | Run on iOS device/simulator |
-| `npm run web` | Run on web browser |
-| `npm run pod` | Install iOS pods |
-| `npm run clear` | Clear Metro cache |
-| `npm run clean` | Clean Android build |
-
----
-
-## 🎨 Key Features Explained
-
-### Authentication Flow
-
-Complete authentication system with:
-- Login/Register screens
-- OTP verification
-- Password reset
-- Protected routes
-- Auth context management
-
-### Navigation Structure
-
-Three-level navigation:
-1. **RootNavigator** - Entry point
-2. **AuthStack** - Unauthenticated screens
-3. **MainStack** - Authenticated screens
-
-### API Integration
-
-Pre-configured with:
-- Axios for HTTP requests
-- TanStack Query for caching
-- Error handling
-- Request/response interceptors
-
-### File Upload
-
-Background upload with:
-- Azure Blob Storage integration
-- Progress tracking
-- Multiple file support
-- Error handling
-
-### Push Notifications
-
-Complete notification system:
-- Firebase Cloud Messaging
-- Notifee for local notifications
-- Permission handling
-- Deep linking support
-
----
-
-## 🔐 Environment Setup
-
-Create `.env` file in root:
-
-```env
-API_BASE_URL=https://api.yourapp.com
-AZURE_STORAGE_URL=your-azure-url
-```
-
----
-
-## 📱 Platform-Specific Notes
-
-### iOS
-
-- Requires Xcode 14+
-- Run `pod install` after installing dependencies
-- Configure signing in Xcode
-- Update `Info.plist` with required permissions
-
-### Android
-
-- Requires Android Studio
-- Update `google-services.json`
-- Configure signing in `android/app/build.gradle`
-- Set up keystore for release builds
-
----
-
-## 🧪 Testing
-
-```bash
-# Run tests (when configured)
-npm test
-
-# Type checking
-npx tsc --noEmit
-```
-
----
-
-## 📚 Documentation
-
-For detailed documentation on specific features:
-
-- [Firebase Setup](./docs/firebase.md)
-- [Azure Storage](./docs/azure-storage.md)
-- [Navigation Guide](./docs/navigation.md)
-- [API Services](./docs/api-services.md)
-
----
-
-## 🤝 Contributing
-
-Contributions are welcome! Please feel free to submit a Pull Request.
-
-1. Fork the repository
-2. Create your feature branch (`git checkout -b feature/amazing-feature`)
-3. Commit your changes (`git commit -m 'Add some amazing feature'`)
-4. Push to the branch (`git push origin feature/amazing-feature`)
-5. Open a Pull Request
-
----
-
-## 🐛 Issues
-
-Found a bug? Please [open an issue](https://github.com/GufranGaury1887/Boiler_Plat_Expo_-Gufran/issues) with a detailed description.
-
----
-
-## 📄 License
-
-This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
-
----
-
-## 👤 Author
-
-**Gufran Gaury**
-
-- GitHub: [@GufranGaury1887](https://github.com/GufranGaury1887)
-- Repository: [Boiler_Plat_Expo_-Gufran](https://github.com/GufranGaury1887/Boiler_Plat_Expo_-Gufran)
-
----
-
-## 🌟 Show Your Support
+## Tech Stack
 
-Give a ⭐️ if this project helped you!
+| Category | Technologies |
+|----------|-------------|
+| Framework | Expo SDK 54, React Native 0.81 |
+| Language | TypeScript |
+| Navigation | React Navigation 7 |
+| State | Zustand, TanStack Query |
+| Storage | MMKV |
+| Backend | Firebase, Azure Blob Storage |
+| Notifications | Notifee, FCM |
 
----
+## Requirements
 
-## 📮 Support
+- Node.js >= 18.0.0
+- For iOS: Xcode 14+, CocoaPods
+- For Android: Android Studio, JDK 17
 
-For support, email gufrangaury@gmail.com or open an issue on GitHub.
+## License
 
----
+MIT © [Gufran Gaury](https://github.com/GufranGaury1887)
 
-**Built with ❤️ by Gufran Gaury**
+## Links
 
-*Happy Coding! 🚀*
+- [GitHub Repository](https://github.com/GufranGaury1887/Boiler_Plat_Expo_-Gufran)
+- [Report Issues](https://github.com/GufranGaury1887/Boiler_Plat_Expo_-Gufran/issues)

package/bin/cli.js

@@ -20,7 +20,6 @@ program
   .description('Create a new Expo app using Gufran\'s professional boilerplate')
   .argument('[project-name]', 'Name of your new project')
   .option('-b, --bundle-id <bundleId>', 'Bundle identifier (e.g., com.company.appname)')
-  .option('-t, --template <template>', 'Template variant to use', 'default')
   .option('--skip-install', 'Skip dependency installation')
   .option('--skip-git', 'Skip git initialization')
   .option('--npm', 'Use npm instead of yarn')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-gufran-expo-app",
-  "version": "2.0.4",
+  "version": "2.0.6",
   "description": "🚀 Ultimate Expo React Native Boilerplate - Create production-ready Expo apps instantly with Firebase, Navigation, TypeScript, and more. No git clone needed, works offline!",
   "main": "index.js",
   "bin": {
@@ -22,7 +22,7 @@
     "starter-kit",
     "gufran"
   ],
-  "author": "Gufran Gaury <your-email@example.com>",
+  "author": "Gufran Gaury <gufran.gaury@gmail.com>",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -46,7 +46,8 @@
     "bin",
     "lib",
     "template",
+    "index.js",
     "README.md",
     "LICENSE"
   ]
-}
+}

package/template/src/navigation/AuthStack.tsx

@@ -1,17 +1,16 @@
 import React from 'react';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { AuthStackParamList } from '../types';
-import { LoginScreen, RegisterScreen, ForgotPasswordScreen, OTPVerifyScreen, WelcomeScreen } from '../screens/auth';
-import { theme } from '../constants';
-import { StorageService } from '../utils/storage';
-import SuccessScreen from '../screens/auth/SuccessScreen';
+import { LoginScreen, WelcomeScreen } from '../screens/auth';
+import { theme } from '@constants';
+import { StorageService } from '@utils/storage';
 
 const Stack = createNativeStackNavigator<AuthStackParamList>();
 
 export const AuthStack: React.FC = () => {
   // Check if welcome screen has been shown before
   const hasWelcomeScreenBeenShown = StorageService.preferences.getWelcomeScreenShown();
-  
+
   // Set initial route based on whether welcome screen has been shown
   const initialRouteName = hasWelcomeScreenBeenShown ? 'Login' : 'Welcome';
 
@@ -37,30 +36,12 @@ export const AuthStack: React.FC = () => {
       <Stack.Screen
         name="Welcome"
         component={WelcomeScreen}
-       
+
       />
       <Stack.Screen
         name="Login"
         component={LoginScreen}
-       
-      />
-      <Stack.Screen
-        name="Register"
-        component={RegisterScreen}
-       
-      />
-      <Stack.Screen
-        name="ForgotPassword"
-        component={ForgotPasswordScreen}
-       
-      />
-      <Stack.Screen
-        name="OTPVerify"
-        component={OTPVerifyScreen}
-      />
-      <Stack.Screen
-        name="Success"
-        component={SuccessScreen}
+
       />
     </Stack.Navigator>
   );