Chat Application Starter Kit

This project contains everything you need to get started with your chat application:

• 📱 A Mobile App (for iOS and Android)
• 💻 An Admin Dashboard (web-based)

What's Included

chat-app/
├── packages/
│   ├── mobile/     # Your mobile app
│   └── admin/      # Your web-based admin dashboard
├── package.json    # Main configuration file
└── README.md      # This guide

Before You Start

You'll need to install a few things on your computer:

1. Install Node.js - Download and install the "LTS" version
2. Install Yarn - This helps manage your project
3. For the mobile app, you'll need:
   • For iPhone testing: A Mac with Xcode installed
   • For Android testing: Android Studio

Initial Setup

1. Copy .env.template to .env:

cp .env.template .env

2. Update the import user password in .env:

[email protected]
IMPORT_USER_PASSWORD=your_secure_password_here  # Change this to a secure password

Setting Up Your Project

1. Open your terminal and run this command to install everything:

yarn install

2. Set up your environment:

For the Mobile App:

• Create a file named .env in the packages/mobile folder
• Add this line (replace with your actual API URL):

API_URL=your_api_url

For the Admin Dashboard:

• Create a file named .env.local in the packages/admin folder
• Add this line (replace with your actual API URL):

NEXT_PUBLIC_API_URL=your_api_url

Running Your Applications

Mobile App

You have two ways to run the mobile app:

1. Using standard commands:

yarn start:mobile      # Start the mobile app development server
yarn start:mobile:ios  # Start the app on iPhone simulator
yarn start:mobile:android  # Start the app on Android emulator

2. Using Expo commands (recommended for better control):

yarn expo:start        # Start Expo development server
yarn expo:start:clear  # Start Expo with cleared cache (fixes many common issues)
yarn expo:ios         # Start on iPhone simulator
yarn expo:android     # Start on Android emulator
yarn expo:web         # Start in web browser
yarn expo:stop        # Stop all running Expo processes

💡 Tips:

• If you're new to mobile development, we recommend using the Expo commands as they provide clearer error messages and more options.
• If you encounter port conflicts or need to restart the server, use yarn expo:stop to stop all Expo processes before starting again.

Admin Dashboard

To work on the admin dashboard:

yarn start:admin  # Start the admin dashboard for development
# or
yarn dev:admin    # Same as above, alternative command

yarn build:admin  # Create a production version of the admin dashboard

Need Help?

• For mobile app development, check out the Expo documentation
• For admin dashboard development, visit the Next.js documentation

🚀 Deployment

This project includes a simple deployment script that will help you deploy all components to Firebase. Follow these steps:

1. Make sure you have the following prerequisites installed:

   • Node.js and npm (brew install node on macOS)
   • Firebase CLI (npm install -g firebase-tools)
   • Yarn package manager (npm install -g yarn)

2. Prepare your API keys:

   • Create a Firebase project at Firebase Console (or let the script create one for you)
   • Get an OpenAI API key at OpenAI Platform

3. Run the deployment script:

   ./deploy.sh

The script will:

• Check for required dependencies
• Guide you through Firebase login if needed
• Let you create a new Firebase project or use an existing one
• Prompt for your OpenAI API key
• Automatically set up all necessary environment variables
• Initialize Firebase services (Firestore, Functions, Hosting)
• Deploy all components

The script will automatically configure all necessary environment variables by:

• Fetching your Firebase project configuration
• Securely collecting your OpenAI API key
• Creating appropriate .env files for each package (mobile, admin, and functions)
• Setting up all required API keys and configuration values

After deployment, you can access:

• Your admin interface through the Firebase Hosting URL
• Manage your Firebase project through the Firebase Console

Troubleshooting

Troubleshooting steps for common issues with the monorepo.

Troubleshooting

If you encounter any issues:

1. Make sure you've run yarn install in the root directory
2. Try cleaning everything and reinstalling:

yarn cleanall    # Removes all generated files and caches
yarn install     # Reinstall everything fresh

This cleanup command will remove:

• All node_modules folders
• Next.js build cache (.next)
• Expo cache (.expo, .expo-shared)
• Build outputs (dist, build, web-build)
• Turbo cache (.turbo)
• Other cache folders (.cache)
• System files (.DS_Store)
• Log files (*.log)
• Local environment files (.env.local, .env.*.local)
• iOS build files (ios/Pods, ios/build)
• Android build files (.gradle, android/build, app/build)
• yarn.lock file
• Yarn cache

⚠️ Note: After running cleanall, you'll need to:

1. Run yarn install to reinstall dependencies
2. Set up your environment files again (.env, .env.local)
3. Rebuild any native iOS/Android dependencies if you're working on mobile