Tkinter and Firebase (and javascript) to get data

Tkinter to create a GUI for firebase

This little script let us look to the records into firebase. We need to add a way to add the records. Let’s see the code until now:

from firebase import firebase

# put the name of your database where the ***** are
address = "https://*******.firebaseio.com/"
fb = firebase.FirebaseApplication(address)

fb.put("books",
	"Pinocchio", {
		"author" : "Collodi",
		"Edition" : 1968}
	   )

import tkinter as tk

root = tk.Tk()

def entry(text):
	l = tk.Label(text=text)
	l.pack()
	e = tk.Entry(root)
	e.pack()

author = entry("Author")
edition = entry("Edition")

def seedata():
	data2 = data[lbx.get(lbx.curselection())]
	for k in data2:
		lbx2.insert(tk.END, k + ": " + str(data2[k]))

lbx = tk.Listbox(root)
lbx.pack()
data = fb.get(address, "books")
for k in data:
	lbx.insert(tk.END, k)
lbx2 = tk.Listbox(root)
lbx2.pack()
lbx.bind("<<ListboxSelect>>", lambda x: seedata())

root.mainloop()

The app..

Now we need the code to add the records.

How to get the data in javascript

To get the data in an html page you need some code like this (you nedd the confid data from your firebase project):

<div id="board"></div>
<script src="https://www.gstatic.com/firebasejs/4.10.1/firebase.js"></script>
<script>
var config = {
  apiKey: "AHfjhdjskhdlgòjkjgkòsjdklfgjlskdjfgkljdf",
  authDomain: "showrfjkjksdf-546.firebaseapp.com",
  databaseURL: "https://showrfjkjksdf-546.firebaseio.com/",
  projectId: "showrfjkjksdf-546",
  storageBucket: "showrfjkjksdf-546.appspot.com",
  messagingSenderId: "4546768786"
};
firebase.initializeApp(config);
let database = firebase.database();
let ref = database.ref().child("my_data_to_read"); // Scrivi da dove vuoi leggere i dati
ref.on("value", gotData, errData);

function gotData(data){
    board.innerHTML = "";
    x = data.val();
    for (n in x){
      board.innerHTML += n + ": " + x[n] + "<br>"
    }
}

function errData(err){
    console.log("Error");
    console.log(err);
}
</script>

You will get the var config data from your project. Then you will nedd to add the child you want to read the data from in:

let ref = database.ref().child("my_data_to_read"); // Scrivi da dove vuoi leggere i dati

my_data_to_read is the child.

The following code will read the data and show them in the div “board”:

ref.on("value", gotData, errData); // sends the values to the function got data

function gotData(data){
    board.innerHTML = "";
    x = data.val();
    for (n in x){
      // iterate all the data adding each one in board
      board.innerHTML += n + ": " + x[n] + "<br>"
    }
}

 

Firebase