How to use Firebase Auth with Astro

Join the early preview for my course! learnastro.dev
Use FIREBASE_AUTH for $20 off.
SAAS products like Firebase make authentication easy to implement. You need three items:
1. A POST api endpoint
2. Firebase auth
3. Middleware to protect the routes
🔗 Key Links 🔗
- Github: github.com/coding-in-public/f...
---------------------------------------
🔗 Additional Links 🔗
- Firebase auth docs: firebase.google.com/docs/auth...
- Astro actions docs: docs.astro.build/en/reference...
- Astro middleware docs: docs.astro.build/en/guides/mi...
---------------------------------------
⏲️ Timestamps ⏲️
0:00 Introduction
1:43 New account form
4:43 Add Firebase
6:55 Setup Astro Actions
9:20 New account POST
18:00 Basic Middleware
21:14 Login form/POST
23:16 Logout form/POST
23:35 Middleware route protection
---------------------------------------
🌐 Connect With Me 🌐
- Website: codinginpublic.dev
- Blog: chrispennington.blog
- Twitter: / cpenned
- Patreon: / coding_in_public
- Buy Me a Coffee: www.buymeacoffee.com/chrispen...

[@friendly__drone9352]

I"m loving these Astro videos!

[@CodinginPublic]

Glad you like them! Go Astro!

[@oktubr3]

You rock man! Thank you!!!

[@CodinginPublic]

Glad it was a help!

[@Ryujin_001]

Bro after deploy to vercel auth.currentUser is null. Login signup and logout works well but never load the profile page because of the null currentUser

[@SabahRahal-m2q]

Excellent video, I followed the steps and I have a problem, when I log in and enter from another session (any other device), the application understands as if I were logged in, any recommendations?

[@andersonmarquesbsb]

The best! ⬆⬆

[@CodinginPublic]

Glad you found it helpful!

[@lostinthenarrativve]

Hey man, can you do supabase+Astro next? or lucia.

[@emireles]

In case you or someone else tries this. I encountered an issue when trying this with Supabase where the error would not pass down from the action since it comes wrapped in a AuthError class. To handle it just use the function isAuthApiError() to check if there is an error returned from the call and then you can throw an ActionError() to actually pass it down the action response when using the .safe() method in the action call.
Hope this helps someone :)

[@palockocz]

Only output server can be used or also output hybrid?

[@CodinginPublic]

Also hybrid. Just make sure you mark routes you need SSR with prerender = false