This page guides you through the initial setup process for the Flutter Mobile Project Template. It covers how to create a new project from the template, set up your development environment, customize basic project settings, and run the app for the first time. For more detailed information on the project structure and architecture, see Project Structure.
Before getting started, ensure you have the following tools installed on your system:
Sources: .vscode/settings.json1-39
The project uses Flutter 3.27.1-stable, which can be automatically installed and managed using mise.
# Install mise if you haven't already # Then install the required Flutter version mise use flutter@3.27.1-stable
The project is configured to work with this Flutter version through the mise configuration.
Sources: .vscode/settings.json3-4
VSCode is the recommended IDE with the following extensions:
| Extension ID | Purpose |
|---|---|
| dart-code.dart-code | Dart language support |
| dart-code.flutter | Flutter framework support |
| blaugold.melos-code | Melos monorepo support |
| djbkwon.flutter-dependency-docs | Flutter dependency documentation |
| esbenp.prettier-vscode | Code formatting |
| DavidAnson.vscode-markdownlint | Markdown linting |
| google.arb-editor | Localization file editing |
The repository includes pre-configured settings for VSCode:
You can launch the application using the provided launch configurations:
Dev: dev-debug
Staging: stg-debug
Production: prd-debug
UI Catalog: ui-catalog
Sources: .vscode/extensions.json1-12 .vscode/settings.json1-39 .vscode/launch.json1-52
IntelliJ IDEA is also supported with run configurations included in the project:
Sources: .idea/runConfigurations/ui_catalog.xml1-7 .idea/runConfigurations/samples_github_app.xml1-6
This diagram illustrates how the development environment is set up:
Sources: .vscode/launch.json1-52 .idea/runConfigurations/ui_catalog.xml1-7 .idea/runConfigurations/samples_github_app.xml1-6
To start a new project using this template:
When you create a new project from the template, a GitHub Actions workflow will run automatically to perform initial setup tasks:
Sources: .github/initialization/README.md1-7
After creating your project from the template, you'll need to perform several customization steps. The initialization workflow creates issues in your repository to guide you through these steps.
One of the first tasks is to rename the application ID:
/tools directorycd tools chmod +x rename-application-id.sh # if needed ./rename-application-id.sh "com.example.android.app" "com.example.ios.app"
This script updates:
build.gradleMainActivity.kt file with the new package nameSources: .github/initialization/RENAME_APPLICATION_ID.md1-33
The project includes a workflow to automatically assign reviewers to Pull Requests. You'll need to configure a GitHub Access Token for this feature. Details for setting up this feature are provided in a dedicated issue created during initialization.
Sources: .github/initialization/GITHUB_AUTO_ASSIGNMENT.md1-50
The template includes support for deploying the UI catalog to Firebase Hosting for PR previews. To enable this feature:
Sources: .github/initialization/FIREBASE_HOSTING_PREVIEW.md1-112
To set up a splash screen for your app:
flutter_native_splash dependency to your pubspec.yamlSources: .github/initialization/SPLASH_SCREEN.md1-88
You'll need to configure app icons for both Android and iOS:
Sources: .github/initialization/ABOUT_ICON.md1-33
The project follows a monorepo structure:
For more detailed information on the project structure, see Project Structure.
Sources: Architecture diagrams provided in prompt
The project supports three environment flavors:
dev)stg)prd)Each flavor has its own configuration in the flavor/ directory.
The easiest way to run the application is to use the provided launch configurations in your IDE:
| Configuration | Purpose |
|---|---|
| dev-debug | Run the main app with development flavor |
| stg-debug | Run the main app with staging flavor |
| prd-debug | Run the main app with production flavor |
| ui-catalog | Run the UI component catalog |
Sources: .vscode/launch.json1-52
You can also run the application from the command line:
# Navigate to the app directory cd apps/app # Run with development flavor flutter run --dart-define-from-file=flavor/dev.json # Run with staging flavor flutter run --dart-define-from-file=flavor/stg.json # Run with production flavor flutter run --dart-define-from-file=flavor/prd.json
To run the UI catalog:
cd apps/catalog flutter run
Sources: .vscode/launch.json8-43
After completing the initial setup and running the application, you may want to explore:
Refresh this wiki