Skip to main content

​
Prerequisites

Before you begin, ensure you have the following installed and configured:
  • Flutter SDK (3.5.0 or higher)
  • Firebase Account with a new or existing project
  • Git for cloning the repository
  • IDE (VS Code, Android Studio, or IntelliJ IDEA)
  • Platform-specific requirements:
    • Android: Android SDK and Android Studio
    • iOS: Xcode 12+ (macOS only)
    • Web: Chrome browser
Make sure your Flutter installation is up to date by running flutter doctor to check for any issues.

​
Setup Instructions

1
Clone the Repository
2
Clone the Trello App repository to your local machine:
3
git clone <repository-url>
cd app_tareas
4
Configure Firebase
5
The project requires Firebase configuration for authentication and database services.
6
1. Create a Firebase Project
7
  • Go to the Firebase Console
  • Create a new project or select an existing one
  • Enable the following services:
    • Authentication (Email/Password and Google Sign-In)
    • Cloud Firestore
    • Storage
    • 8
    2. Add Firebase to Your App
    9
    For Android:
    10
  • In Firebase Console, add an Android app
  • Download google-services.json
  • Place it in android/app/google-services.json
    • 11
    For Web:
    12
  • In Firebase Console, add a Web app
  • Copy the configuration
  • Update lib/firebase_options.dart with your credentials
    • 13
    The project uses FlutterFire CLI configuration. Your firebase.json should look like:
    14
    {
  "flutter": {
    "platforms": {
      "android": {
        "default": {
          "projectId": "your-project-id",
          "appId": "your-app-id",
          "fileOutput": "android/app/google-services.json"
        }
      },
      "dart": {
        "lib/firebase_options.dart": {
          "projectId": "your-project-id",
          "configurations": {
            "android": "your-android-app-id",
            "web": "your-web-app-id"
          }
        }
      }
    }
  }
}
    15
    Replace your-project-id, your-app-id, etc. with your actual Firebase project values.
    16
    Install Dependencies
    17
    Install all required Flutter packages:
    18
    flutter pub get
    19
    This will install the following key dependencies:
    20
  • firebase_core - Firebase initialization
  • firebase_auth - Authentication
  • cloud_firestore - Database
  • firebase_storage - File storage
  • google_sign_in - Google authentication
  • image_picker - Image selection
  • logger - Logging
  • intl - Date formatting
    • 21
    Configure Google Sign-In
    22
    For Google Sign-In to work, you need to configure OAuth:
    23
    Android:
    24
  • The SHA-1 fingerprint is automatically configured through google-services.json
    • 25
    iOS:
    26
  • Add the GoogleService-Info.plist to ios/Runner/
  • Update ios/Runner/Info.plist with the reversed client ID
    • 27
    Web:
    28
  • Configure authorized domains in Firebase Console
    • 29
    Run the Application
    30
    Start the app on your preferred platform:
    31
    # For Android/iOS (with device connected or emulator running)
flutter run

# For Web
flutter run -d chrome

# For specific device
flutter devices
flutter run -d <device-id>
    32
    The app will initialize Firebase on startup:
    33
    void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(const MyApp());
}
    34
    Create Your First Account
    35
    Once the app launches, you’ll see the login screen.
    36
  • Click “¿No tienes una cuenta? Regístrate” to register
  • Fill in your details:
    • Email address
    • Password
    • Name and surname
    • Profile picture (optional)
  • Accept the Terms and Conditions
  • Click “Registrar”
    • 37
    Alternatively, use “Iniciar sesión con Google” for quick Google Sign-In.
    38
    The app includes built-in authentication validation. Make sure to use a valid email format and a secure password.
    39
    Create Your First Team
    40
    After logging in, you’ll be on the home screen (TaskScreen).
    41
  • Click the ”+” button to add a new team
  • Enter team details:
    • Team Name: Give your team a descriptive name
    • Project Description: Describe the team’s purpose
    • Add Members: Search for users by name to add to the team
    • Choose Color: Select a color to identify the team
  • Click “Agregar” to create the team
    • 42
    // Team creation example from the code
final teamId = await _teamService.createTeam(
  _teamName,
  _projectDescription,
  _selectedColor,
  allMembers,
);
    43
    Add Your First Task
    44
    With a team created, you can now add tasks:
    45
  • Click on your team to open the team view
  • Click the ”+” floating action button (black circle with plus icon)
  • Fill in task details:
    • Task Name: Brief title for the task
    • Description: Detailed description of what needs to be done
    • Start Date: When the task should begin
    • End Date: Task deadline
    • Assign Member: Choose who’s responsible for the task
    • Status: Set initial status (Not Started, In Development, Completed)
  • Click “Agregar” to create the task
    • 46
    Tasks are stored in Firestore and sync in real-time:
    47
    await _firestore.collection('tasks').add({
  'name': taskName,
  'description': description,
  'teamId': teamId,
  'responsibleId': userId,
  'startDate': startDate,
  'endDate': endDate,
  'status': 'No Iniciado',
  'createdAt': FieldValue.serverTimestamp(),
});

    ​
    What’s Next?

    Congratulations! You’ve successfully set up Trello App and created your first team and task.

    ​
    Explore More Features

    • Edit Profile: Update your profile information and picture
    • Manage Tasks: Update task status, edit details, or delete completed tasks
    • Add Team Members: Grow your teams by inviting more collaborators
    • Notifications: Stay updated with task changes and assignments

    ​
    Troubleshooting

    If you encounter issues during setup, check out our Installation Guide for detailed troubleshooting steps.
    All data is stored securely in Firebase. Make sure your Firebase Security Rules are properly configured for production use.

    Build docs developers (and LLMs) love

    Get started for freeTalk to us