gear_ai_v1

Gear AI CoPilot - Build & Deployment Guide

Build Instructions

Prerequisites

Development Environment Setup

  1. Install Dependencies

    npm install
    
  2. Set Up Environment Variables

    Copy .env.example to .env.local and configure your API keys:

    cp .env.example .env.local
    

    Edit .env.local with your actual credentials (Firebase, Supabase, etc.)

  3. Start Development Server

    npm start
    # or
    npx expo start
    

    This will start the Metro bundler. You can then:

    • Press i for iOS simulator
    • Press a for Android emulator
    • Scan QR code with Expo Go app for physical device testing
    • Press w for web browser

Building for Production

Web Build

npm run build

This creates a static export in the dist/ directory that can be deployed to:

Deployment Example (Vercel):

npm install -g vercel
vercel --prod

Mobile Builds (iOS & Android)

For production mobile builds, use Expo Application Services (EAS):

  1. Install EAS CLI

    npm install -g eas-cli
    
  2. Configure EAS

    eas build:configure
    
  3. Build for iOS

    eas build --platform ios --profile production
    
  4. Build for Android

    eas build --platform android --profile production
    
  5. Submit to App Stores

    # iOS App Store
    eas submit --platform ios
       
    # Google Play Store
    eas submit --platform android
    

Database Setup (Supabase)

1. Create Supabase Project

  1. Go to supabase.com
  2. Create a new project
  3. Note your project URL and anon key

2. Run Migrations

Navigate to the Supabase dashboard:

Alternatively, use the Supabase CLI:

npm install -g supabase
supabase link --project-ref your-project-ref
supabase db push

3. Configure Storage Buckets

Create the following storage buckets in Supabase Dashboard:

Set appropriate RLS policies for each bucket.

Firebase Setup (Authentication)

1. Create Firebase Project

  1. Go to Firebase Console
  2. Create a new project
  3. Enable Authentication
  4. Enable Email/Password, Google, and Apple sign-in methods

2. Get Configuration

From Project Settings → General, get:

Add these to .env.local

3. Sync with Supabase

Create a Firebase Cloud Function to sync authenticated users to Supabase:

// functions/index.js
const functions = require('firebase-functions');
const { createClient } = require('@supabase/supabase-js');

const supabase = createClient(
  process.env.SUPABASE_URL,
  process.env.SUPABASE_SERVICE_KEY
);

exports.syncUserToSupabase = functions.auth.user().onCreate(async (user) => {
  await supabase.from('users').insert({
    firebase_uid: user.uid,
    email: user.email,
    display_name: user.displayName,
    avatar_url: user.photoURL,
  });
});

Code Quality Checks

TypeScript Type Checking

npx tsc --noEmit

Linting

npm run lint

To auto-fix linting issues:

npm run lint -- --fix

Testing (To be implemented)

npm test

Performance Optimization

Web Optimization

  1. Code Splitting: Automatically handled by Expo Router
  2. Image Optimization: Use expo-image component
  3. Bundle Size Analysis:

    npx expo export --platform web --source-maps
    # Analyze bundle with source-map-explorer
    npm install -g source-map-explorer
    source-map-explorer dist/_expo/static/js/web/*.js
    

Mobile Optimization

  1. Use Hermes Engine (enabled by default in Expo SDK 53)
  2. Optimize Images: Use appropriate image formats (WebP)
  3. Lazy Loading: Defer loading of heavy components
  4. Profile Performance:

    npx expo start --profile
    

Monitoring & Analytics

Error Tracking (Sentry)

  1. Install Sentry:

    npm install @sentry/react-native
    
  2. Configure in app/_layout.tsx:

    import * as Sentry from '@sentry/react-native';
       
    Sentry.init({
      dsn: process.env.SENTRY_DSN,
      enableInExpoDevelopment: false,
    });
    

Analytics (Mixpanel)

  1. Install Mixpanel:

    npm install mixpanel-react-native
    
  2. Initialize in app entry point

Continuous Integration / Continuous Deployment (CI/CD)

GitHub Actions Example

Create .github/workflows/build.yml:

name: Build and Test

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main, develop]

jobs:
  build:
    runs-on: ubuntu-latest
    
    steps:
      - uses: actions/checkout@v3
      
      - name: Setup Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '18'
          cache: 'npm'
      
      - name: Install dependencies
        run: npm ci
      
      - name: Type check
        run: npx tsc --noEmit
      
      - name: Lint
        run: npm run lint
      
      - name: Build web
        run: npm run build
      
      - name: Run tests
        run: npm test

Environment-Specific Configuration

Development

NODE_ENV=development

Staging

NODE_ENV=staging

Production

NODE_ENV=production

Troubleshooting

Common Issues

Metro bundler cache issues:

npx expo start -c

iOS simulator not found:

xcode-select --install
sudo xcode-select -s /Applications/Xcode.app/Contents/Developer

Android build errors:

cd android
./gradlew clean
cd ..
npx expo run:android

Dependencies out of sync:

rm -rf node_modules package-lock.json
npm install

Pre-Deployment Checklist

Code Quality

Testing

Environment Configuration

Database

Third-Party Services

Firebase

Supabase

Stripe

Security Checklist

Monitoring & Analytics

Performance Benchmarks

Target Metrics

Monitoring

Use these tools to track performance:

Support & Documentation

Contributing

See Contributing Guidelines for code standards and pull request process.


Last Updated: December 30, 2024
Maintainer: @mmanthe37