Installation - Trello App

System Requirements

Minimum Requirements

Flutter SDK: 3.5.0 or higher
Dart SDK: ^3.5.0 (included with Flutter)
Operating System:
- Windows 10 or higher
- macOS 10.14 or higher
- Linux (64-bit)

Platform-Specific Requirements

Android

Android SDK 21 (Lollipop) or higher
Android Studio 2022.1 or higher
Java Development Kit (JDK) 11 or higher
Minimum 8GB RAM recommended

iOS

macOS operating system
Xcode 12.0 or higher
iOS 11.0 or higher target
CocoaPods 1.10 or higher
Valid Apple Developer account (for device testing)

Web

Modern web browser (Chrome, Firefox, Safari, Edge)
Web server for hosting (optional)

Desktop (Windows/macOS/Linux)

Platform-specific build tools
Windows: Visual Studio 2022 or higher
macOS: Xcode command-line tools
Linux: GTK 3.0+ development libraries

iOS development requires a Mac. You cannot build iOS apps on Windows or Linux.

Flutter SDK Installation

If you haven’t installed Flutter yet, follow these steps:

Download Flutter

Visit flutter.dev and download the Flutter SDK for your operating system.

Extract and Add to PATH

Windows:

# Extract to C:\src\flutter
# Add to PATH environment variable
C:\src\flutter\bin

macOS/Linux:

cd ~/development
unzip flutter_sdk.zip
export PATH="$PATH:`pwd`/flutter/bin"
# Add to ~/.bashrc or ~/.zshrc for persistence

Verify Installation

Run Flutter Doctor to check for any missing dependencies:

flutter doctor -v

Address any issues identified by Flutter Doctor before proceeding.

Project Dependencies

The Trello App uses the following dependencies defined in pubspec.yaml:

dependencies:
  flutter:
    sdk: flutter

  # UI Components
  cupertino_icons: any
  
  # Firebase Services
  firebase_core: any        # Firebase initialization
  firebase_auth: any        # Authentication
  cloud_firestore: any      # NoSQL database
  firebase_storage: any     # File storage
  
  # Third-party Authentication
  google_sign_in: any       # Google OAuth
  
  # Utilities
  logger: any               # Logging and debugging
  image_picker: any         # Image selection
  intl: any                 # Date formatting
  flutter_local_notifications: any  # Notifications

dev_dependencies:
  flutter_test:
    sdk: flutter
  flutter_lints: any        # Code analysis

Install Dependencies

After cloning the repository:

cd app_tareas
flutter pub get

The any version constraint means the latest compatible version will be installed. For production, consider pinning specific versions.

Firebase Configuration

Step 1: Create Firebase Project

Navigate to Firebase Console
Click “Add Project” or select existing project
Enter project name (e.g., “trello-app-production”)
Enable Google Analytics (optional but recommended)
Complete project creation

Step 2: Enable Firebase Services

Authentication

In Firebase Console, go to Authentication → Sign-in method
Enable Email/Password:
- Toggle “Email/Password” to enabled
- Save changes
Enable Google:
- Toggle “Google” to enabled
- Enter support email
- Save changes

Cloud Firestore

Go to Firestore Database → Create database
Choose starting mode:
- Test mode: Open access (development only)
- Production mode: Secure with rules (recommended)
Select database location (closest to your users)
Click “Enable”

Storage

Go to Storage → Get started
Review security rules
Choose storage location
Click “Done”

Default Firebase Security Rules allow open access. Update them before deploying to production:

// Firestore Security Rules
rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /users/{userId} {
      allow read: if request.auth != null;
      allow write: if request.auth.uid == userId;
    }
    match /teams/{teamId} {
      allow read, write: if request.auth != null;
    }
    match /tasks/{taskId} {
      allow read, write: if request.auth != null;
    }
  }
}

// Storage Security Rules
rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    match /profileImages/{userId}/{fileName} {
      allow read: if request.auth != null;
      allow write: if request.auth.uid == userId;
    }
  }
}

Step 3: Register Your App

Android App

In Firebase Console, click the Android icon to add Android app
Enter Android package name: com.example.app_tareas (check android/app/build.gradle for actual package)
Optional: Add app nickname and SHA-1 certificate
Download google-services.json
Place file in android/app/google-services.json
Follow the setup instructions to modify Gradle files (usually auto-configured)

Get SHA-1 certificate for Google Sign-In:

cd android
./gradlew signingReport
# Copy the SHA-1 from the debug or release variant

iOS App

Click the iOS icon to add iOS app
Enter iOS bundle ID: Check ios/Runner.xcodeproj or ios/Runner/Info.plist
Optional: Add app nickname
Download GoogleService-Info.plist
Open ios/Runner.xcworkspace in Xcode
Drag GoogleService-Info.plist into the Runner folder
Ensure “Copy items if needed” is checked

Update Info.plist for Google Sign-In:

<!-- Add to ios/Runner/Info.plist -->
<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleTypeRole</key>
    <string>Editor</string>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>com.googleusercontent.apps.YOUR-REVERSED-CLIENT-ID</string>
    </array>
  </dict>
</array>

Web App

Click the Web icon to add Web app
Enter app nickname
Copy the Firebase configuration object
Update lib/firebase_options.dart with your configuration:

class DefaultFirebaseOptions {
  static FirebaseOptions get currentPlatform {
    if (kIsWeb) {
      return web;
    }
    switch (defaultTargetPlatform) {
      case TargetPlatform.android:
        return android;
      case TargetPlatform.iOS:
        return ios;
      default:
        throw UnsupportedError('Unsupported platform');
    }
  }

  static const FirebaseOptions web = FirebaseOptions(
    apiKey: 'YOUR-WEB-API-KEY',
    appId: 'YOUR-WEB-APP-ID',
    messagingSenderId: 'YOUR-SENDER-ID',
    projectId: 'YOUR-PROJECT-ID',
    authDomain: 'YOUR-PROJECT-ID.firebaseapp.com',
    storageBucket: 'YOUR-PROJECT-ID.appspot.com',
  );

  // Android and iOS configurations...
}

Android Configuration

Ensure google-services.json is properly placed
SHA-1 certificate is registered in Firebase Console
Google Sign-In is enabled in Firebase Authentication

iOS Configuration

Add GoogleService-Info.plist to Xcode project
Update Info.plist with reversed client ID (found in GoogleService-Info.plist):

<key>CFBundleURLSchemes</key>
<array>
  <string>com.googleusercontent.apps.123456789-abcdefg</string>
</array>

Run pod install in the ios directory:

cd ios
pod install
cd ..

Web Configuration

Add authorized domains in Firebase Console:
- Go to Authentication → Settings → Authorized domains
- Add your domain (e.g., localhost for development)
Create OAuth 2.0 Client ID in Google Cloud Console:
- Visit Google Cloud Console
- Navigate to APIs & Services → Credentials
- Create OAuth 2.0 Client ID for Web application
- Add authorized JavaScript origins (e.g., http://localhost)

For local development on web, use http://localhost:5000 or your preferred port. Make sure it’s added to authorized origins.

Platform-Specific Setup

Android

Update Gradle Files

Ensure android/app/build.gradle has minimum SDK version:

android {
    defaultConfig {
        minSdkVersion 21
        targetSdkVersion 33
    }
}

Permissions

The app requires these permissions (already in AndroidManifest.xml):

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.CAMERA" />

iOS

Update Podfile

Ensure ios/Podfile has minimum version:

platform :ios, '11.0'

Run Pod Install

cd ios
pod install
cd ..

Permissions

Update Info.plist with required permissions:

<key>NSPhotoLibraryUsageDescription</key>
<string>We need access to your photo library to select profile pictures</string>
<key>NSCameraUsageDescription</key>
<string>We need camera access to take profile pictures</string>

Web

Update index.html

Ensure Firebase is initialized in web/index.html:

<script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-firestore.js"></script>

Build and Run

Development Mode

# Android/iOS with connected device
flutter run

# Web (Chrome)
flutter run -d chrome

# Specific device
flutter run -d <device-id>

Release Build

Android APK:

flutter build apk --release
# Output: build/app/outputs/flutter-apk/app-release.apk

Android App Bundle:

flutter build appbundle --release
# Output: build/app/outputs/bundle/release/app-release.aab

iOS:

flutter build ios --release
# Then archive in Xcode

Web:

flutter build web --release
# Output: build/web/

Troubleshooting Common Issues

Firebase Initialization Failed

Problem: [core/no-app] No Firebase App '[DEFAULT]' has been created Solution:

Ensure Firebase.initializeApp() is called in main() before runApp()
Verify google-services.json (Android) or GoogleService-Info.plist (iOS) is in correct location
Check that Firebase configuration matches your project

Problem: Google Sign-In returns null or fails Solution:

Android: Verify SHA-1 certificate is registered in Firebase Console
iOS: Check reversed client ID in Info.plist
Web: Ensure domain is in authorized origins
Verify Google Sign-In is enabled in Firebase Authentication

Image Picker Crashes

Problem: App crashes when selecting images Solution:

Android: Check permissions in AndroidManifest.xml
iOS: Add camera/photo library usage descriptions to Info.plist
Test on physical device (some emulators don’t support camera)

Firestore Permission Denied

Problem: Permission denied when reading/writing Firestore Solution:

Review Firestore Security Rules
Ensure user is authenticated before accessing data
Update rules to match your data structure:

match /users/{userId} {
  allow read, write: if request.auth.uid == userId;
}

Build Errors on iOS

Problem: CocoaPods or Xcode build failures Solution:

cd ios
rm -rf Pods Podfile.lock
pod install --repo-update
cd ..
flutter clean
flutter pub get
flutter build ios

Gradle Build Failures (Android)

Problem: Gradle sync or build errors Solution:

cd android
./gradlew clean
cd ..
flutter clean
flutter pub get
flutter build apk

If you continue to experience issues, check the Flutter and Firebase documentation for platform-specific troubleshooting steps.

Next Steps

Once installation is complete:

Review the Quickstart Guide for first-time setup
Explore the source code in lib/ to understand the architecture
Customize the app for your needs
Configure production Firebase Security Rules
Set up CI/CD for automated builds

For production deployment, remember to:

Update Firebase Security Rules
Use environment-specific Firebase projects (dev, staging, production)
Enable Firebase Analytics and Crashlytics
Configure app signing for release builds

Get Started

Core Features

User Guides

Configuration

​System Requirements

​Minimum Requirements

​Platform-Specific Requirements

​Android

​iOS

​Web

​Desktop (Windows/macOS/Linux)

​Flutter SDK Installation

​Project Dependencies

​Install Dependencies

​Firebase Configuration

​Step 1: Create Firebase Project

​Step 2: Enable Firebase Services

​Authentication

​Cloud Firestore

​Storage

​Step 3: Register Your App

​Android App

​iOS App

​Web App

​Google Sign-In Setup

​Android Configuration

​iOS Configuration

​Web Configuration

​Platform-Specific Setup

​Android

​Update Gradle Files

​Permissions

​iOS

​Update Podfile

​Run Pod Install

​Permissions

​Web

​Update index.html

​Build and Run

​Development Mode

​Release Build

​Troubleshooting Common Issues

​Firebase Initialization Failed

​Google Sign-In Not Working

​Image Picker Crashes

​Firestore Permission Denied

​Build Errors on iOS

​Gradle Build Failures (Android)

​Next Steps

Build docs developers (and LLMs) love

System Requirements

Minimum Requirements

Platform-Specific Requirements

Android

iOS

Web

Desktop (Windows/macOS/Linux)

Flutter SDK Installation

Project Dependencies

Install Dependencies

Firebase Configuration

Step 1: Create Firebase Project

Step 2: Enable Firebase Services

Authentication

Cloud Firestore

Storage

Step 3: Register Your App

Android App

iOS App

Web App

Google Sign-In Setup

Android Configuration

iOS Configuration

Web Configuration

Platform-Specific Setup

Android

Update Gradle Files

Permissions

iOS

Update Podfile

Run Pod Install

Permissions

Web

Update index.html

Build and Run

Development Mode

Release Build

Troubleshooting Common Issues

Firebase Initialization Failed

Google Sign-In Not Working

Image Picker Crashes

Firestore Permission Denied

Build Errors on iOS

Gradle Build Failures (Android)

Next Steps