Waterman1 Waterman1 - 1 month ago 11
HTML Question

How to put firebase data on the screen

What is the best way to display data I have pulled from firebase on the screen?
and by best way I want the best way to do it using JavaScript and no hacks or JSON.strinifying (unless that is the best way).

The reason I have not included any code or attempts is because I want to know WHAT to do rather than HOW to do. any tips welcomed


Depending on how much data you want to bind to the screen I would suggest using some kind of framework.

Binding a JSON response to your view and splitting it up to bind it to different elements can become quite tedious if done with vanilla JS.

For an easy implementation something like jQuery should be enough.

Generally it depends a bit on what of your Firebase reply you want to display.

If it is the whole response notation JSON.stringify is probably the way to go. But usually you will want to display the information that is saved on the properties of your JSON response.

So assume this is your response data:

  property: 'Example sting I want to display'

So you get your firebase response (let's assume you have saved the response object onto a data variable) select the property value you want to display and pass it to jQuery's .text() function.


This assumes you have an example DOM including a div with id 'exampleDiv' that contains a p tag.

This p tag will now contain the string 'Example sting I want to display'.

This way is easily scalable to several properties and different html tags giving you freedom over where you bind what part if your JSOn response.