DEV Community

Micah Lindley
Micah Lindley

Posted on

Help with Firebase Realtime Database

Hi guys,

I’ve been working on my Checkmark project lately. Dabbling with Google’s Firebase, I added Google authentication to let users sync their to-do lists across devices. However, I can’t seem to figure out how to transfer the list items (li) to my Realtime Database, specified by the user’s Google username. I’m using pure Javascript and HTML currently, but if this can be accomplished with JQuery, I’m open to suggestions.

Can anyone help with this? I’m not exactly a Javascript programmer, so I’m making this up as I go. You can check out my current source at https://github.com/micahlt/checkmark.

Top comments (12)

Collapse
 
mongopark profile image
Ola' John Ajiboye

Hey, I can help with this. How have you tried to get this to the Firestore?. I can't really see the code that connects to your Firestore. You need to first create a database in Firestore database then sync then store the list in the database. Syncing to real-time is a breeze from there.

Collapse
 
micahlt profile image
Micah Lindley

Thanks! I’ve created a Firebase Realtime database. Should I use Firestore instead?

Collapse
 
mongopark profile image
Ola' John Ajiboye

No, it's just fine. Now if you got to your database. You will need to get the collection by name in your app.js. You would do that like so if your collection name is "projects":

// this will return all document in this collection
const allProjects = db.collection("projects").get()

//if you need to store something in the collection first store them in a variable in your code and then store them like below.
 allProjects.set({// your data in here})

firebase.google.com/docs/firestore...
firebase.google.com/docs/firestore...

Thread Thread
 
mongopark profile image
Ola' John Ajiboye

You know what, I'll just probably make a pull request to show how you can do it.

Thread Thread
 
micahlt profile image
Micah Lindley • Edited

Thanks a lot!!! I’m currently working with all my Javascript in my HTML, but it is getting a little crowded. So should I move it to an app.js file? (I’ve also just followed you on GitHub)

Thread Thread
 
mongopark profile image
Ola' John Ajiboye

Yea, that's what I will suggest. I had some examples with VanillaJS/Jquery -Firebase on my Github but I deleted them, I will try to create an example for you tomorrow.

Thread Thread
 
micahlt profile image
Micah Lindley

Thanks so much! I’m going to add your name to the about page meanwhile. I really appreciate the help! 😇

Thread Thread
 
micahlt profile image
Micah Lindley

Please let me know when you publish the example! I’d love to see it!

Thread Thread
 
mongopark profile image
Ola' John Ajiboye

Yea, I will let you know. I have been a little bit ill.

Thread Thread
 
micahlt profile image
Micah Lindley

Oh no! 😟 I’m so sorry! Hope you get well soon.

Thread Thread
 
mongopark profile image
Ola' John Ajiboye

So I found this great walk-through that should help.But you can reach out if you get stuck or have additional questions. Basically at the moment you are just storing the todo and retrieving from LocalStorage. You need to store in Real-time database instead.
softauthor.com/learn-to-build-fire...

Thread Thread
 
micahlt profile image
Micah Lindley

Thanks for the link! I’ll check it out. 😀