The fast_app brick will create a Flutter application with authentication, storage, analytics, AB testing, routing, and more. It includes a theme, constants, and utilities that are commonly used in Flutter apps.
mason make fast_app
The fast_app brick will generate the following files:
+-- lib
+-- app
+-- config.dart
+-- constants.dart
+-- get_it.dart
+-- router.dart
+-- services.dart
+-- theme.dart
+-- utils.dart
+-- features
+-- authentication
+-- models
+-- services
+-- ui
+-- feedback
+-- models
+-- services
+-- ui
+-- home
+-- models
+-- services
+-- ui
+-- onboarding
+-- models
+-- services
+-- ui
+-- settings
+-- models
+-- services
+-- ui
+-- shared
+-- services
+-- ab_test_service.dart
+-- analytics_service.dart
+-- authentication_service.dart
+-- analytics_service.dart
+-- crash_service.dart
+-- notifications_service.dart
+-- navigation_service.dart
+-- serialization_service.dart
+-- storage_service.dart
+-- ui
+-- app_logo.dart
+-- layout.dart
+-- loading_overlay.dart
+-- skeleton_box.dart
+-- main.dart (updated)
The authentication feature includes models, services, and UI components for sign in, sign up, reset password, and user management.
The analytics feature includes models, services, and UI components for event tracking, user behavior, and analytics.
The analytics_service.dart file includes code to setup the selected analytics provider in your app. The service will be registered as a Singleton in GetIt and can be accessed from anywhere in your app using the analyticsService getter.
The service provides a logEvent function to log events with an optional properties map.
The service can also be used to update the user properties with the setUserProperties function.
The ab_test feature includes models, services, and UI components for A/B testing and feature flagging.
The ab_test_service.dart file includes code to setup and run basic A/B tests. The service wil be registered as a Singleton in GetIt and can be accessed from anywhere in your app using the abTestService getter.
Included in the service is a ConfigValue enum where you can define your feature flags. These value are used in by the service functions to retrieve the associated values.
The service also provides a convenient way to turn features on and off in Flutter web using cookies.
The app includes crash reporting services for Firebase Crashlytics and Sentry. The CLI will setup all necessary configurations for the selected provider.
The feedback feature includes models, services, and UI components for collecting user feedback. This feature is powered by the backend provider you chose for authentication.
The home feature includes basic UI components for the home screen of your app. It includes a tabbed home page with a navigation drawer. The drawer includes links to the user’s profile, settings, and sign out. When new routes are added to the app, they will appear here.
The onboarding feature includes UI components for the onboarding flow of your app. The initial onboardin flow consists of three sreens that display a title and message. When the user views the last screen, they will be navigated to the home screen and the onboarded flag will be set to true in the shared preferences.
The settings feature includes models, services, and UI components for the settings screen of your app.
The ab_test_service.dart file includes code to setup and run basic A/B tests. The service wil be registered as a Singleton in GetIt and can be accessed from anywhere in your app using the abTestService getter.
Included in the service is a ConfigValue enum where you can define your feature flags. These value are used in by the service functions to retrieve the associated values.
The service also provides a convenient way to turn features on and off in Flutter web using cookies.
Select the firebase_remote_config option during creation to use Firebase Remote Config as your A/B testing provider.
Selecting this option will add the firebase_remote_config package to your pubspec.yaml file.
To use Firebase Remote Config, you will need to add your Firebase project configuration to your app. First, create a Firebase project in the Firebase Console. Then, add the Firebase configuration to your app by running the following command in your terminal:
flutterfire config
Select the posthog option during creation to use PostHog as your A/B testing provider.
The posthog_flutter package will be added to your pubspec.yaml file.
The following meta tags will be added to your AndroidManifest.xml and Info.plist files:
<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.example.posthog_flutter_example">
<application>
<activity>
[...]
</activity>
<meta-data android:name="com.posthog.posthog.API_KEY" android:value="YOUR_API_KEY_GOES_HERE" />
<meta-data android:name="com.posthog.posthog.POSTHOG_HOST" android:value="https://app.posthog.com" />
<meta-data android:name="com.posthog.posthog.TRACK_APPLICATION_LIFECYCLE_EVENTS" android:value="true" />
<meta-data android:name="com.posthog.posthog.DEBUG" android:value="true" />
</application>
</manifest>
The following keys will be added to your Info.plist file:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
[...]
<key>com.posthog.posthog.API_KEY</key>
<string>YOUR_API_KEY_GOES_HERE</string>
<key>com.posthog.posthog.POSTHOG_HOST</key>
<string>https://app.posthog.com</string>
<key>com.posthog.posthog.CAPTURE_APPLICATION_LIFECYCLE_EVENTS</key>
<true/>
<key>com.posthog.posthog.DEBUG</key>
<true/>
[...]
</dict>
</plist>
The following script will be added to the head tag in your index.html file:
<script>
!function(t,e){var o,n,p,r;e.__SV||(window.posthog=e,e._i=[],e.init=function(i,s,a){function g(t,e){var o=e.split(".");2==o.length&&(t=t[o[0]],e=o[1]),t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}}(p=t.createElement("script")).type="text/javascript",p.async=!0,p.src=s.api_host+"/static/array.js",(r=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,r);var u=e;for(void 0!==a?u=e[a]=[]:a="posthog",u.people=u.people||[],u.toString=function(t){var e="posthog";return"posthog"!==a&&(e+="."+a),t||(e+=" (stub)"),e},u.people.toString=function(){return u.toString(1)+".people (stub)"},o="capture identify alias people.set people.set_once set_config register register_once unregister opt_out_capturing has_opted_out_capturing opt_in_capturing reset isFeatureEnabled onFeatureFlags getFeatureFlag getFeatureFlagPayload reloadFeatureFlags group updateEarlyAccessFeatureEnrollment getEarlyAccessFeatures getActiveMatchingSurveys getSurveys".split(" "),n=0;n<o.length;n++)g(u,o[n]);e._i.push([i,s,a])},e.__SV=1)}(document,window.posthog||[]);
posthog.init('YOUR_WRITE_KEY_GOES_HERE', {api_host: 'https://app.posthog.com'})
</script>
To use PostHog, you will need to create a PostHog account and add your project configuration to your app. First, create a PostHog project in the PostHog Console. Then, add the PostHog API key to the config file in assets/config.json.