Data withdrawal with Firebase

[Jir_Cekdar]

I want to fetch data from Firebase and display it on the screen dynamically. The data I want to retrieve should be structured like this:

Book 1 (cover image, title, option to read as PDF and download)
Book 2 (cover image, title, option to read as PDF and download)

And it should continue infinitely in the same way. However, I couldn’t find a course in a language I understand. There are only a few people here who explain it with blocks or very basic examples.

Are there any friends who can provide a more detailed explanation or example?

Firebase structure

“books”: {
“book1”: {
“image”: “https://example.com/example.jpg”,
“title”: “Kurdish Culture and Language”,
“audio”: “https://yourdomain.com/audio/book1.mp3”,
“download”: “https://yourdomain.com/downloads/book1.zip”,
“pdf”: “https://yourdomain.com/pdfs/book1.pdf”
},
“book2”: {
“image”: “https://example.com/example.jpg”,
“title”: “History of Mesopotamia”,
“audio”: “https://yourdomain.com/audio/book2.mp3”,
“download”: “https://yourdomain.com/downloads/book2.zip”,
“pdf”: “https://yourdomain.com/pdfs/book2.pdf”
},
“book3”: {
“image”: “https://example.com/example.jpg”,
“title”: “Kurdish Poetry Anthology”,
“audio”: “https://yourdomain.com/audio/book3.mp3”,
“download”: “https://yourdomain.com/downloads/book3.zip”,
“pdf”: “https://yourdomain.com/pdfs/book3.pdf”
}
}

screen view;

---

| Kurdish Culture and Language |

---- Cover Photo —

[Listen Audio] [Download] [View PDF]

---

| History of Mesopotamia |

---- Cover Photo —

[Listen Audio] [Download] [View PDF]

---

| Kurdish Poetry Anthology |

---- Cover Photo —

[Listen Audio] [Download] [View PDF]

[Still-learning (1-2-3-4...)]

@Jir_Cekdar

Book 1 (cover image, title, option to read as PDF and download)
Book 2 (cover image, title, option to read as PDF and download)

this is the firebase data or like this you want to show it in the app? make clear your statement. What is your firebase structure?

[Jir_Cekdar]

@Jir_Cekdar

“books”: {
“book1”: {
“image”: “https://example.com/example.jpg”,
“title”: “Kurdish Culture and Language”,
“audio”: “https://yourdomain.com/audio/book1.mp3”,
“download”: “https://yourdomain.com/downloads/book1.zip”,
“pdf”: “https://yourdomain.com/pdfs/book1.pdf”
},

In this way, I mentioned the screen view example under the Firebase structure.

[Still-learning (1-2-3-4...)]

So either dynamic component or comp creator is the best

1. Main vire VSA
2. Inside this make one carview
3. Inside this create one label (header), image (cover photo) and a horizontal arrangement
4. Inside this ha make three buttons

Make it as one procedure with set lable text, set picture to image and buttons text as shown in your above image

Calk books fb value.

When fg got value

For each items in the list get value
Call procedure to set tit lable text to get key value of title dictionary to get item
Set image to get key value of image get dictionary get item

When any button clicked,
Get clicked dynamic button id which will have index of the global lust as well as button index

[Jir_Cekdar]

“I have no prior knowledge about the topic I’m working on, and the information you’ve provided so far hasn’t been sufficient for me. Could you please explain it using blocks and Yusuf Cihan’s Dynamic Components extension?”

[Still-learning (1-2-3-4...)]

@Jir_Cekdar

audio

Dyna.aia (42.2 KB)

check this

[Jir_Cekdar]

Firebase database I want to use it, but I think it was built as a different system here

[Still-learning (1-2-3-4...)]

I have used the obtained json from the firebase into the global variable.

So design the blicks there by the obtained data matches like what you gave us in the first post

[Jir_Cekdar]

So how can I connect here with firebase. I have no information about this

[Still-learning (1-2-3-4...)]

Show me your firebase structure as screenshot so that i can say your firebase project bucket

[Jir_Cekdar]

Here is the Firebase Database Structure

[Still-learning (1-2-3-4...)]

you mean this?

in such case set firebase bucket as Category
call firebase tag as Child

then, my example app will take card of the remaining

But remember you are not using the same tag given in the first post in the above picture. So make changes wherever it is required

[Jir_Cekdar]

I guess I don’t understand again. Because he did his aia without using the Firebase plugin. And I don’t even know any little information about this topic.

[Still-learning (1-2-3-4...)]

@Still-learning

Category

You need to do this change alone

then in the aia, what i used in the screen init, just moved to when fb got value, thats it

[Jir_Cekdar]

This was the solution thanks.