Ionic 3 - Firebase Custom User Profiles 

Want to put this to use in your Ionic applications? Get Learn Ionic 3 From Scratch with our real-time chat application. paulhalliday.io/p/learn-ionic-3-from-scratch Course content is still being added with more projects coming soon!

I love those firebase integration videos, keep it up!

Just best tutorials for Ionic and firebase ! Great Job...

Thanks for this fantastic tutorials Paul!

Thanks a lot for your content Paul. Really apreciate it. I'm planning to buy your full content as soon as I can.

I like the way you tech, easy to understand thank you so much keep up the good work.

thank you very much Paul, you are the best!

Hi Paul, can you help me? What condition do you give to check whether profile has already been created?

thank you 💟

THANK YOU

Hi Paul, thanks for the video. My app seems to work right up until the end when the user information is displayed on the profile page. I think the problem may be related to the import of the 'FirebaseObjectObservable' on the home.ts page. Is this line outdated or have I done something wrong? Thanks for the help. Brian

Great. How to store image with custom profile into firebase db in Ionic 5.

hey, i watched a lot of your ionic video, its really help me and my friends a lot, thank you so much :D but, i can't implement this custom profile tutorial with the AngularFire2 v5 :(

Great video! However, I'm currently using ionic v4 and can't make the take operator from rxjs work. Any tips?

okay , the way you fix the invalid pipe error is in your userprofile.ts change : profileData : AngularFireObject to profileData : Observable and this.profileData = this.afDatabase.object(`user/${data.uid}`).valueChanges();

wanted a help .... I am capturing a length and length of firebasae and I want to put a marker in google maps but it does not leave me and when I put with static data if it puts marker

Hello Paul.. I have a question , If the user has not create iits profile then the Home page will show empty data .. so what should be done to enter data in Profile incoming New Users :)..

nice video! i have a question i was hoping you could help me with. Im making an app and using FirebaseListObservable (associated with the user) so each time i make a new message it is associated with the user who made it, and the app retrieves the users messages (each one has an id under the users id) is this a good way to do things, or should i be using FirebaseObjectObservable. Also a side question is it bad that each message has its own id? ty hoss

What if I had to display the information on multiple pages? Do I have to query the database everytime? Or is it possible to store the data somewhere?

Hi Paul, could you give us some advice on letting users to upload their profile picture? please Thanks in advance!

Profile creation page should come only one time after first login , how can i do that???

i have error Type 'FirebaseObjectObservable' is not assignable to type 'FirebaseListObservable'. this.profileData = this.afDatabase.object('profile/'+data.uid) . import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database-deprecated';

I am are trying to make an app in ionic 3. Profile page of the user is created and data is stored in the Firebase. But not able to display those information in the app. Can you help me with an example code?

when did he import the AngulatFireAuthModule and when ?

Hello Paul i need to display Username in my sideMenu using AppComponent.ts need some Help Here

how about new user login and existing ?

Hey Paul, may I know what plugin you are using to have that color scheme? It looks so pleasant! And that arrow thing when you type in "=>" is awesome too. Been a follower of your tutorials for quite a while now. Just started to learn Ionic 3 months ago and I think I'm getting the hang of it. Cheers from the Philippines!

hi how fix problem please Firebase Permission Denied firestore ionic 4

Additionally Paul, it would be nice if you had a github repository where the finished code exists so we can compare our code to yours should we run into mistakes.

Nice video for beginners. How can we make the app check if data is available in firebase and if the data is available, skip the page asking for firstname, lastname and username? Thanks

is this the same in ionic mobileApp??

I followed angularfire docs to setup firebase and its configuration in app.modulte.ts in my ionic 3 project and it works ! But since I have 2 firebase databases for the same app and therefore 2 different configurations, setting it up in app.module is not an option. I have 2 config files (frbaseconfig.ts and frbaseconfig2.ts). How can I make it happen?

how to make rbac with this tutorial ? thanks

thx hoss

How to create role-based login using ionic 3/ionic 4 and firebase ??

hi Paul I have personal question about ionic development is there a way I could contact you please it really important.... thanks.

Can't we just use the User interface created earlier instead of building a new Profile interface?

Good Video. Also can you make a tutorial for getting and manipulating data from firebase?(I mean like, get data and do some calculations and update again). Using callback functions over firebase data... etc. I have seen many uses asking that kind of questions on STACKOVERFLOW. So that would be really helpful.

Good tuto, one question plz, on this video u use multi emulator, so what is extension use for test multi emulator ??

I'm having this error : Error: Uncaught (in promise): Error: StaticInjectorError[AngularFireDatabase]: StaticInjectorError[AngularFireDatabase]: NullInjectorError: No provider for AngularFireDatabase! Error: StaticInjectorError[AngularFireDatabase]: StaticInjectorError[AngularFireDatabase]: NullInjectorError: No provider for AngularFireDatabase! How can I fix this? This is after all the code is done, when I run it at the final of the tutorial.

Hello Paul, thank you for the videos, I'm trying to log out, but I'm not trying to succeed, when I redirect to login screen, I get the following error: permission_denied at / profiles / : Client does not have permission to access the desired date. logout() { this.afAuth.auth.signOut().then(() => { this.app.getRootNav().setRoot("LoginPage"); // I'm using tabs }) }; could you help me please? thank you so much!

hi thank you so much i have this error ./src/main.ts Module not found: Error: Can't resolve 'rxjs/add/operator/take' in 'C:\Users\..

how i use data of database in loginpage to make only once redirect to profilepage??? for example: if(database.uid.username !=null) setroot(homepage) else setroot(profilepage). My problem is i dont know how to call data of database to use in conditional. Sorry for my english and thanks.

Just wondering: I read that angularFire2 does not support image uploads. How would we get around this issue?

Hey Paul, thanks for your incredibles videos ! Just fantastic But I'm in a bind : with the new version of AngularFire 5.0 the FireBaseObjectObservable must be replace by the AngularFireObject but when I do that I have the error : "InvalidPipeArgument: '[object Object]' for pipe 'AsyncPipe'"and when I try to remove the Async Pipe like this : Username : {{ profileData?.username }}, I have no more mistakes but nothing appears....

Hello, i get this problem can you help ?? > Type 'AngularFireObject' is not assignable to type 'FirebaseObjectObservable'.

Hi. I see yours tutorials and i have can developer app advances. now i have one problem, do you can pass your email?

Paul, there is a problem 10:19 InvalidPipeArgument: '[object Object]' for pipe 'AsyncPipe' Please help

How to check whether the user has logged in for the first time?

After following this, I get the error: "Typescript Error Module '"Documents/sites/Profile/node_modules/angularfire2/database/index"' has no exported member 'FirebaseObjectObservable'." The error is on this line in home.ts: import { AngularFireDatabase, FirebaseObjectObservable } from 'angularfire2/database';

alguien pudo solucionar este error? por favor ayuda

How do I make each user have a profile picture? thank

Data not showing in the final page though showimg in the console

Hi Paul, it seems like this function is not working for me. When I click on the create profile, it's doing nothing. It did not take me to the Homepage and did not create any entry in the firebase database. What am I missing here. Thanks a lot. createProfile() { this.afAuth.authState.take(1).subscribe(auth => { this.afDatabase.list('profile/${auth.uid}').push(this.profile).then(() => this.navCtrl.push(HomePage)); })

Wow

please update to angularfire2 v5 thanks!

hello paul, got and error at profile.ts ('profile/${auth.uid}')) while running App, Error: "Reference.child Failed: first argument was an invalid path..."

can you please put the code in github, thanks before

This is a problem with this line: Username: {{(profileData | async)?.username}} results in this: Error: InvalidPipeArgument: '[object Object]' for pipe 'AsyncPipe'

how can we do this with php and mysql instead of firebase?

Here's the first video in this section: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-aNW444SpFNs.html

InvalidPipeArgument: 'function observeOnOperatorFunction(source) { return source.lift(new ObserveOnOperator(scheduler, delay)); }' for pipe 'AsyncPipe'| Please fix this mr.hurrying train!

Did anybody work out why the account page returns Error: PERMISSION_DENIED: Permission denied when you use the back accent in this.afDatabase.list(`profile/${auth.uid}`).push(this.profile) i use ' ' around the auth.uid and it returns polyfills.js:3 Unhandled Promise rejection: Reference.child failed: First argument was an invalid path = "profile/${auth.uid}". Paths must be non-empty strings and can't contain ".", "#", "$", "[", or "]" ; Zone: ; good tutorial till the account part a git resource would be quite helpful for learning

This will solve the issue on 10:26 - stackoverflow.com/questions/48032291/property-query-is-missing-in-type-observable-ionic-firebase?rq=1

Hello! This is a great video but I'm having problems with the Profile page. My code is exactly like yours but when I try to create the profile i get: Runtime Error: Uncaught (in promise): Error: Reference.child failed: First argument was an invalid path = 'profile/${auth.uid}'/ Paths must be non-empty strings and can't contain ".", "#", "$", "[", or "]" validatePathString@localhost:8100/build/vendor.js:35668:31 ==== JUST FOR REFERENCE, HERE IS MY CODE FOR THE PROFILE.TS ==== import { Profile } from '../../models/profile'; import { AngularFireAuth } from 'angularfire2/auth'; import { AngularFireDatabase } from 'angularfire2/database'; import { Component } from '@angular/core'; import { IonicPage, NavController, NavParams } from 'ionic-angular'; @IonicPage() @Component({ selector: 'page-profile', templateUrl: 'profile.html', }) export class ProfilePage { profile = {} as Profile; constructor(private afAuth: AngularFireAuth, private afDatabase: AngularFireDatabase, public navCtrl: NavController, public navParams: NavParams) { } ionViewWillLoad() { this.afAuth.authState.subscribe(data => console.log(data.uid)); } createProfile() { this.afAuth.authState.take(1).subscribe(auth => { this.afDatabase.object("profile/${auth.uid}").set(this.profile) .then(() => this.navCtrl.setRoot('MainPage')); }) } } Help please!!!

This tutorial is doing well until you arrive at ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-uESqBwFVf1Q.html which is the most important thing in this tutorial, and that moment you'll know, You fucked up! LOL

Hi Paul, can you help me? What condition do you give to check whether profile has already been created?

What if I had to display the information on multiple pages? Do I have to query the database everytime? Or is it possible to store the data somewhere?