Flutter Firebase Complete App | Study App

Created At: 2022-08-11 00:44:49 Updated At: 2024-01-14 08:35:29

Flutter Study App Part 1

Flutter Study App Part 2

This is a flutter firebase complete app using firebase, firebase firestore, firebase storage, google sign in, with two themes from scratch for study app or quiz app. This app covers both android and ios part.

Topics(advanced) covered

1. Firebase app creation with CLI

2. Firebase upload data programmatically

3. Work with firebase collections, documents and fields

4. Firebase storage for uploading image

5. Read data from firebase

6. Firebase data upload batch operation

7. Firebase google sign in

8. Google auth before accessing data

9. Upload user data to firebase

10. Upload app study score data to firebase

11. Store data per user in firebase

12. LeaderBoard data display in the app

13. Take quiz for specific subject

14. Save individual user information indiviusally in the firebase data store

15. Send local notification and remote notification

16. Light mode and dark mode

17. Check answer and retake the quiz

18. See the correct result and wrong result

19. The quiz is time bound

20. Personal dashboard

This is a dynamic app and it contains 14 UI screen.

Complete code for early access 

Firebase Master Class App

Assets for following video tutorial

assets

Facebook group for discussing this app issue

facebook group

Get the apk from here

AppLogger Class

This class helps you log information which is helpful for debugging. You need a plugig to do it.

logger: ^1.0.0
class AppLogger {
  static final logger = Logger(
    printer: PrettyPrinter(
        methodCount: 2, // number of method calls to be displayed
        errorMethodCount: 8, // number of method calls if stacktrace is provided
        lineLength: 200, // width of the output
        colors: true, // Colorful log messages
        printEmojis: true, // Print an emoji for each log message
        printTime: false // Should each log print contain a timestamp
    ),
  );

  static void i(dynamic message){
    logger.i(message);
  }
  static void d(dynamic message){
    logger.d(message);
  }
  static void w(dynamic message){
    logger.w(message);
  }
  static void e(dynamic message){
    logger.e(message);
  }
  static void wtf(dynamic message){
    logger.wtf(message);
  }

}

Integration with Firebase and Google

Errors and Solutions

1. Firebase database rules

You may set up some rules to work with Firebase Collections. These rules you need to upload the questions from the app json files to firebase firestore database. Once you apply these rules, you will be to upload the all the json to the firebase at the first attemp of your app launch.

rules_version = '2'; service cloud.firestore {
match /databases/{database}/documents { 
    match /questionPapers/{ppr}/questions/{q}{ 
      allow read, write: if request.auth != null 
      }
      
	match /leaderboard/{document=**} { 
  	allow read, write: if true;
	}
    match /questionPapers/{document=**} { 
      allow read, write: if true;
    }
    match /users/{document=**} { 
      allow read, write: if true;
    }
} 
}

The above rules should help you create collections and work on them.

 

2. Controller Injection Error or FirebaseStorageService not Found

You may see the below error 

FirebaseStorageService" not found. You need to call "Get.put(FirebaseStorageService())" or "Get.lazyPut(()=>FirebaseStorageService())"

That happened because we missed to inject the controller. To get rid of the problem do this, just below line in initial_bindings.dart

Get.put(FirebaseStorageService());

Now it should look like this

class InitialBinding implements Bindings {
  @override
  void dependencies() {
    Get.put(ThemeController());
    //Get.put(PapersDataUploader());
    Get.put(AuthController(), permanent: true);
    Get.put(NotificationService());
    Get.lazyPut(() =>  FireBaseStorageService());
  }
}

3. Navigation to home screen

Make sure you have the home route in your app_routes.dart

class AppRoutes {
  static List<GetPage> routes() => [
        GetPage(name: "/", page: () => const SplashScreen()),
        GetPage(
          name: "/introduction",
          page: () => const AppIntroductionScreen(),
        ),
        GetPage(
            name: "/home",
            page: () => const HomeScreen(),
            binding: BindingsBuilder(() {
              Get.put(QuestionPaperController());
            })),
      ];
}

And from introduction.dart file add the code inside the Column widget

AppCircleButton(
                      onTap: () => Get.offAndToNamed("/home"),
                      child: const Icon(Icons.arrow_forward, size: 35))

4. Bad state: field does not exist within the DocumentSnapshotPlatform

Now this error happens because, we have wrong key and value pair for our database. Remember we get the data from firebase and convert them in object. 

The problem is in the question_paper_model.dart, we have a typo for "Description", it should be "description", and "question_count" should be "questions_count"

5. App Crashes Google Signin

When you click on the google sign in button, the app crashes. We need to add SHA1 key in firebase console.

Use the below command

keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android

6. iOS Error 

For those who gets an error at 07:06:00 just add the line before the array <key>CFBundleURLTypes</key>

7. Flutterfire command error

If you get an error: "command not found: flutterfire" then make sure you run "dart pub global activate flutterfire_cli".

E-commerce App

Flutter Bloc App

Flutter Firebase Chatting App

Comment

  • r
    ra2886380@gmail.com

    2024-11-07 12:04:06

    thank you for such a wonderful content! im grasping so much from your videos!

    Author response:

    You are welcome

  • r
    ra2886380@gmail.com

    2024-08-28 06:01:26

    me rewrite code update file pubspec.yaml

    Author response:

    What did you update here?

  • r
    ra2886380@gmail.com

    2024-08-28 06:01:24

    me rewrite code update file pubspec.yaml

  • r
    ra2886380@gmail.com

    2024-08-28 06:00:23

    please sayfullayevabdulazizbek@gmail.com send massage correct the mistake

    Author response:

    What do you mean? I don't understand.

Add Reviews