Quick Firebase adoption

Soojeong Lee

Jul 30, 2025

Soojeong Lee

Jul 30, 2025

Soojeong Lee

Jul 30, 2025

Apply the necessary Firebase features.

What was added?

Functionally necessary parts were added.

Authentication is required (Firebase Auth)
Video/photo uploads are needed (Firebase Storage)

Maybe because it's Google, integrating Firebase and Flutter is incredibly easy. After installing the CLI, it's almost spoon-fed.

Tton. Addition complete.

Added in-app login

I personally like OAuth, but for the purpose of passing review or beta testing, it seems like implementing just regular login would suffice. Covering costs for server hosting already feels... a bit much, so for now, using Firebase Auth is enough at the MVP level.

import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

final firebaseAuthProvider = Provider<FirebaseAuth>((ref) {
  return FirebaseAuth.instance;
});

final authStateChangesProvider = StreamProvider<User?>((ref) {
  final auth = ref.watch(firebaseAuthProvider);
  return auth.authStateChanges();
});

I added the service and guarded the initial screen route.

final goRouterProvider = Provider<GoRouter>((ref) {
  final authState = ref.watch(authStateChangesProvider);

  return GoRouter(
    initialLocation: '/memories',
    redirect: (context, state) {
      final isLoggedIn = authState.asData?.value != null;
      final isGoingToSignIn = state.matchedLocation == '/login';

      if (!isLoggedIn && !isGoingToSignIn) {
        return '/login';
      }
      if (isLoggedIn && isGoingToSignIn) {
        return '/memories';
      }
      return null;
    },
...

I haven't implemented login complicatedly yet; I've just arbitrarily registered a test account and verified if authentication works. (In any case, I’ll have to implement validation later on.)

class LoginScreen extends ConsumerWidget {
  const LoginScreen({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final auth = ref.read(firebaseAuthProvider);

    return Scaffold(
      body: Center(
        child: ElevatedButton(
          onPressed: () async {
            await auth.signInWithEmailAndPassword(
              email: 'test@test.com',
              password: 'testpassword',
            );
          },
          child: const Text('Sign In'),
        ),
      ),
    );
  }
}

(Since it's disabled, please don't go ahead and click login like crazy after reading this... it won't work anyway.)

Photo/Video Upload

This is completed using the most commonly used image_picker package, and the selected file is uploaded to Firebase Storage, returning the URL.

  Future<void> _handleMediaUpload() async {
    final ImagePicker picker = ImagePicker();
    final List<XFile> medias = await picker.pickMultipleMedia();

    if (medias.isEmpty) {
      return;
    }

    final storageRef = FirebaseStorage.instance.ref();
    final userId = FirebaseAuth.instance.currentUser?.uid;

    for (final media in medias) {
      final file = File(media.path);
      final fileName = media.name;
      final uploadRef = storageRef.child('memories/$userId/$fileName');

      try {
        final uploadTask = await uploadRef.putFile(file);
        final downloadUrl = await uploadTask.ref.getDownloadURL();
        debugPrint('Uploaded: $downloadUrl');
      } catch (e) {
        debugPrint('Upload failed: $e');
      }
    }
  }

(I blocked all CRUD actions for this too, so please don't go ahead and upload like crazy after reading this... it won't work anyway.)

In the distant future, migrating to AWS S3 Bucket won't be that complicated.

What's left?

Now I have almost finished the important features. The remaining parts are

Membership registration
Translation
CRUD operations and state management
iOS App Store upload
Android APK packaging (the review is strict, so I’m considering beta testing methods)

The remaining work will probably require a lot of effort, but if I work hard on the weekend, I should be able to wrap it up.

Backend with Rust axum?

Comments