How to get the data from firebase realtime database in react js?

Question

I am trying to get the the data from firebase(realtime database). I refered various videos but I didn't get the proper solution. I don't know where I made a mistake. I share my code and firebase screenshot.

I want to show this firebase data in table form on frontend.

here as screenshot of firebase realtime database.

My Code is:

import React,{useEffect} from 'react'
function TableDataGet() {
 useEffect(() => {
    return () => {
//firebase get table datacode
}})
 return (
<div>
      <div>
        <table>
            <thead>
                <tr>
                    <th>id</th>
                    <th>name</th>
                    <th>nameMarathi</th>
                    <th>srno</th>
                    <th>mobile</th>
                </tr>
            </thead>

            <tbody>
                {
                   DataUser.map((item,id)=>{
                       <div>
                           {item.name}
                       </div>
                   })
                }
            </tbody>
        </table>
        </div>
</div>


 )
}
export default TableDataGet

I mean, if you Google it there's like 1,000 tutorials on Firebase+React real time data UIs, what specifically do you need help with? — Jayce444
– Jayce444, Commented Jun 3, 2022 at 5:40
Assuming that you didn't take out any code, you've got a ways to go... I'd recommend what Jayce444 said and try to follow a tutorial... and while it doesn't exacly address the issue, if you're trying to decide between the realtime database and firestore, Firestore is newer and recommended (and realtime as well) Best of luck! — Michael Martell
– Michael Martell, Commented Jun 3, 2022 at 5:43
inside useEffect hook i am writing following code. but its not working, i get only id of data but not get name. — Komal k
– Komal k, Commented Jun 3, 2022 at 5:57
useEffect(() => { return () => { const dbRef=ref(db) get(child(dbRef,"userdataRecord")).then((snapshot)=>{ var DataUser=[]; snapshot.forEach(childSnapshot=>{ DataUser.push(childSnapshot.val()) }) TableDataGet(DataUser) }) } }, []) — Komal k
– Komal k, Commented Jun 3, 2022 at 5:57

unsama · Accepted Answer · 2022-06-03 06:22:06Z

1

here is the query of get data from Firebase Realtime Database.

      let ref = database.ref("/buyers");
      ref.on("value", snapshot => {
      const data = snapshot.val()
      console.log(data)
      })

answered Jun 3, 2022 at 6:22

unsama

618 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to get the data from firebase realtime database in react js?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related