Joel Ross
Autumn 2025

<info 340/>

Firebase Authentification

View of the Day

  • Q&A

  • Firebase Authentication

    • FirebaseUI
    • Managing Auth State

  • Firebase Image Uploading

Questions on React, Firebase, etc?

# switch to starter branch to get new starter code
git checkout starter

# download new starter code
git pull

# switch back to main branch for coding
git checkout main

# merge in new starter code (use default msg)
git merge starter --no-edit

# code and enjoy!

Get the starter code from the starter branch, but do all of your work on main.

Updating Lecture Code

See textbook

https://info340.github.io/firebase.html

Firebase

Email Enum Protection

On Sep 15 2023 Google added additional security features to avoid login information being leaked from sign-in forms. This can potentially cause issues when doing frequent log-ins for Firebase.

As a workaround, when doing development, you can turn off this feature (just remember to turn it back on for deployment!)

https://cloud.google.com/identity-platform/docs/admin/email-enumeration-protection

FirebaseUI

A library (provided by Firebase) that created a sign-in form for your page.

React 19 workarounds

The React bindings for FirebaseUI (firebaseui-web-react) was not updated for React 18, and appears to have been abandoned. See the open pull request from Gabriel Villenave.

# Install library (on command line)
npm install https://github.com/joelwross/firebaseui-web-react

The (increasingly debt-ridden) workaround is to install an updated fork instead of the usual package. Prof Ross has created a fork that can be used with React 19:

There are other alternatives (e.g., another firebaseui-react library), but I'm still figuring those out.

//import the component
import StyledFirebaseAuth from 'react-firebaseui/dist/StyledFirebaseAuth';

Firebase Storage

Firebase Storage is used to storing "large" files (e.g., images) that are not JSON compatible.

 

As of October 30 2024, Firebase only offers Storage on a "pay-as-you-go" plan. But you DO NOT need to provide credit card information for any service in this class. For workarounds, see the announcement on Ed Discussion.

Action Items!

  • Finish the course!

  • Review everything

  • All late problem sets due by Friday 12/05

  • Project due Monday 12/08!!!

 

Lab: Quiz 5

Next time: "Quiz Retake", conclusions, work time