Mate, fellow aussie here. Thank you so much for this - my god there's so much here to setup and configure, I can see running this solo and learning it all would be a real time sink. Thank you!
I haven't actually used Firebase with Nx yet I don't think. I think the general idea would be the same but I would split up into the library approach with Nx, and I suppose I would modify the serve executor to boot up the emulators
I may be an idiot, but I followed this to the letter and my app is not using the emulators. So strange. Everything looks like it should logically work, yet when I fire up the app and do things like sign up a user, I'm hitting my live database. No compile errors and I am using the useEmulators flag from environment variables in app.module ... not sure what else I could be missing. So puzzling. Is there some special way I am suppose to get the auth instance in my service? Update: I had to use the providers for all of the emulators. The connectoXXXEmulator just did not work using the provide methods in the imports section. I am using Angular 15 and am using the compat versions of angular-fire. Maybe that is why? Very odd as it all looked like you would think "how could it not work" :) ... Interesting video nonetheless!
If anyone else getting an error in the CLI around the 4:42 mark, you might need to set your Default GCP resource location again in the Project Settings. It was not saved for me after creating the database, afterwards the CLI was able to continue.
Hey I get the following error: Firebase: There is no user record corresponding to this identifier. The user may have been deleted. Do you maybe know how can I resolve this? I also cloned your repo and just adjusted the firebase config and implemented a simple signIn with email and password.
Likely either the connect emulator methods in the root module aren't implemented correctly, or the useEmulators property isn't configured in the environment files, or potentially you're running a --prod build.
@@JoshuaMorony Same here. Double checked. Implemented correctly, useEmulators is actually true, and i'm running the ng serve command. Emulators are up and running and the ports are all correct. I think the injector callback function in the provideAuth module isn't being called and it's always connected to the online firebase rather than the emulators. Tried to set a breakpoint inside of the callback on this line (const auth = getAuth();) , but it seems to never run.
With this approach I am getting a "NullInjectorError: NullInjectorError: No provider for InjectionToken angularfire2.app.options!". Not sure why. Also, what is the difference between "provideFirebaseApp(() => initializeApp(environment.firebase.config))" and "AngularFireModule.initializeApp(environment.firebase.config)"??
@@darylclarke4953 Haven´t worked on that project for a while, but I believe what I did is I imported this module "import { AngularFireModule } from "@angular/fire/compat";" and then initialized app like this "AngularFireModule.initializeApp(environment.firebase.config)". Please consider this a workaround, not a solution (if it works).
Join my mailing list for more exclusive content and access to the archive of my private tips of the week: mobirony.ck.page/4a331b9076
Real good simple and most important "end-to-end" example. Loved it Joshua!
Mate, fellow aussie here. Thank you so much for this - my god there's so much here to setup and configure, I can see running this solo and learning it all would be a real time sink. Thank you!
Great content!
This video is a 10. Thanks!!
This is a very good and informative video. What is your prefered way to setup Firebase and angular in a NX project?
I haven't actually used Firebase with Nx yet I don't think. I think the general idea would be the same but I would split up into the library approach with Nx, and I suppose I would modify the serve executor to boot up the emulators
I may be an idiot, but I followed this to the letter and my app is not using the emulators. So strange. Everything looks like it should logically work, yet when I fire up the app and do things like sign up a user, I'm hitting my live database. No compile errors and I am using the useEmulators flag from environment variables in app.module ... not sure what else I could be missing. So puzzling. Is there some special way I am suppose to get the auth instance in my service?
Update: I had to use the providers for all of the emulators. The connectoXXXEmulator just did not work using the provide methods in the imports section. I am using Angular 15 and am using the compat versions of angular-fire. Maybe that is why? Very odd as it all looked like you would think "how could it not work" :) ... Interesting video nonetheless!
gem of angular development!
If anyone else getting an error in the CLI around the 4:42 mark, you might need to set your Default GCP resource location again in the Project Settings. It was not saved for me after creating the database, afterwards the CLI was able to continue.
Hey I get the following error: Firebase: There is no user record corresponding to this identifier. The user may have been deleted.
Do you maybe know how can I resolve this?
I also cloned your repo and just adjusted the firebase config and implemented a simple signIn with email and password.
what is this terminal you are using, I want to setup the terminal like this
I'm using zsh/OhMyZsh/PowerLevel10k
any link from where I can setup it
it's not working for me, my emulators are up running but if I update a document, it is reflected in the firebase console, but not in my emulator
Likely either the connect emulator methods in the root module aren't implemented correctly, or the useEmulators property isn't configured in the environment files, or potentially you're running a --prod build.
@@JoshuaMorony Same here. Double checked. Implemented correctly, useEmulators is actually true, and i'm running the ng serve command. Emulators are up and running and the ports are all correct. I think the injector callback function in the provideAuth module isn't being called and it's always connected to the online firebase rather than the emulators. Tried to set a breakpoint inside of the callback on this line (const auth = getAuth();) , but it seems to never run.
With this approach I am getting a "NullInjectorError: NullInjectorError: No provider for InjectionToken angularfire2.app.options!". Not sure why. Also, what is the difference between "provideFirebaseApp(() => initializeApp(environment.firebase.config))" and "AngularFireModule.initializeApp(environment.firebase.config)"??
Did you resolve this? I have the same issue
@@darylclarke4953 Haven´t worked on that project for a while, but I believe what I did is I imported this module "import { AngularFireModule } from "@angular/fire/compat";" and then initialized app like this "AngularFireModule.initializeApp(environment.firebase.config)". Please consider this a workaround, not a solution (if it works).