Flutter Architecture Blueprints
Flutter Architecture Blueprints is a project that introduces MVVM architecture and project structure approaches to developing Flutter apps.
Installation
- asdf
- Dart 2.14.4
- Flutter 2.5.3
- npm (for git hooks)
Environment
iOS
- iOS 13+
Android
- Android 5.1+
- minSdkVersion 22
- targetSdkVersion 30
App architecture
- Base on MVVM + Repository
Code Style
Assets, Fonts
If added some assets or fonts
- Use FlutterGen
Models
If added some models for api results
- Use Freezed
Localizations
If added some localizations (i.g. edited *.arb)
Git Commit message style
Code collections
Project settings
| Working status | Category | Description | Codes |
|---|---|---|---|
| ✅ | Dart | Dart version | pubspec.yaml |
| ✅ | asdf | asdf | .tool-versions |
| ✅ | Dart | Switching between Development and Production environment | constants.dart, runConfigurations, Makefile |
| ✅ | Dart | Lint / Analyze | analysis_options.yaml |
| ✅ | Android | Kotlin version | build.gradle |
| ✅ | Android | Apk attributes | build.gradle (compileSdkVersion, applicationId, minSdkVersion, targetSdkVersion) |
| ✅ | Android | Switching between Development and Production environment | build.gradle, Flavor dirs, signingConfigs |
| ✅ | iOS | Xcode version | compatibilityVersion |
| ✅ | iOS | Podfile | Podfile |
| ✅ | iOS | Switching between Development and Production environment | xcconfig, Podfile |
| ✅ | Firebase | [Android] Switching between Development and Production google-service.json using flavors | development and production |
| ✅ | Firebase | [iOS] Switching between Development and Production GoogleService-Info.plist using run script | copy_google_service.sh, development and production |
| ✅ | Firebase Auth | SignIn, SignOut | auth_data_source_impl.dart |
| ✅ | Firebase Crashlytics | Crash Reports | main.dart |
| ✅ | Firebase Performance | Network monitoring with dio_firebase_performance | app_dio.dart |
Architecture
| Working status | Category | Description | Codes |
|---|---|---|---|
| ✅ | Base | Using Riverpod + Hooks + ChangeNotifier + MVVM | news_page.dart, news_view_model.dart, news_repository.dart, news_data_source.dart |
| ✅ | Networking | Using dio and Retofit | app_dio.dart, news_data_source.dart |
| ✅ | Data | Using Freezed | model classes |
| ✅ | Constants | Define constants and route names | constants.dart |
| ✅ | Localization | Switching between two languages with Intl package | *.arb |
| ✅ | Error handling | Using Result pattern – A value that represents either a success or a failure, including an associated value in each case. | result.dart, news_repository_impl.dart, home_page.dart |
UI
| Working status | Category | Description | Codes |
|---|---|---|---|
| ✅ | Theme | Staticly Switch between light and dark themes | app_theme.dart |
| ✅ | Font | Using Google font | app_theme.dart |
| ✅ | Transition | Simple animation between screens using Hero | article_item.dart, detail_page.dart |
Testing
| Working status | Category | Description | Codes |
|---|---|---|---|
| ✅ | API(Repositories) | Using mocktail | view_mode_test.dart |
| ✅️ | UI | Using mocktail | widget_test.dart |
| ✅ | Coverage reports | Send the report to Codecov on CI | codecov.yml, codecov.sh, flutte-ci.yml |
CI
| Working status | Category | Description | Codes |
|---|---|---|---|
| ✅ | Git | Git hooks for format and analyze | package.json, Makefile |
| ✅ | Git | .gitignore settings | .gitignore |
| ✅ | Build | Using Codemagic | codemagic.yaml |
| ✅ | Build | Using Bitrise | bitrise.yml |
| ✅ | Build | Using Github Actions | .github/workflows/flutter-ci.yml |
Getting Started
Setup
$ make setup
$ export PATH="$PATH":"$HOME/.pub-cache/bin" # Add your run-commands (.zshrc, .bashrc, etc)
$ make dependencies
$ make build-runner
How to add assets(images..)
- Add assets
- Run FlutterGen
How to add localizations
- Edit *.arb files.
- Run generate the
flutter pub get
Make .apk and .ipa file
Android
$ make build-android-dev
$ make build-android-prd
iOS
$ make build-ios-dev
$ make build-ios-prd
Run app
$ make run-dev
$ make run-prd
Special Thanks.
Contributors
