Slide 1

Slide 1 text

Firebase Real Time JSON Storage ABECON 15.07.2016 Leszek Rybicki

Slide 2

Slide 2 text

What is Firebase?

Slide 3

Slide 3 text

How much?

Slide 4

Slide 4 text

Initialize // Initialize Firebase var config = { apiKey: "AIzaSyAxMx5ZJpxyS1Va4A-A1xhOwpiOZZzbopM", authDomain: "abecon-3c221.firebaseapp.com", databaseURL: "https://abecon-3c221.firebaseio.com", storageBucket: "abecon-3c221.appspot.com", }; firebase.initializeApp(config);

Slide 5

Slide 5 text

Reference let db = new firebase.database() var usersRef = db.ref('users') usersRef.child(‘tetsuri’) usersRef.key() // users A reference identifies an address in the database.

Slide 6

Slide 6 text

Listing nodes let query = usersRef .orderByKey() .limitToLast(5) query.once('value', function(snapshot){}) query.off(‘value’) query.on(‘child_added’, function(child){}) query.on(‘child_removed’, function(child){}) query.on(‘child_moved’, function(child){}) query.on(‘child_changed’, function(child){}) A query sends events when its results change. We can listen to child CRUD events and an even on any value change.

Slide 7

Slide 7 text

Snapshot // Test for the existence of certain keys within a DataSnapshot var ref = firebase.database().ref("users/ada"); ref.once("value").then(function(snapshot) { var name = snapshot.child("name").val(); // { first: "Ada", last: "Lovelace"} var firstName = snapshot.child("name/first").val(); // "Ada" var lastName = snapshot.child("name").child("last").val(); // "Lovelace" var age = snapshot.child("age").val(); // null });

Slide 8

Slide 8 text

Snapshot’s children // Iterating over children in a snapshot var ref = firebase.database().ref("users"); ref.once("value").then(function(snapshot) { snapshot.forEach(function(childSnapshot) { var key = childSnapshot.key; // childData will be the actual contents of the child var childData = childSnapshot.val(); }); });

Slide 9

Slide 9 text

Creating nodes // create a child with key “ada” and set its value users.child(‘ada’).set({ first: 'Ada', last: 'Lovelace' })

Slide 10

Slide 10 text

Changing node values // change the value of “ada” child node. users.child(‘ada’).set({ first: 'Ada', last: 'Lovelace' }) // same as create!

Slide 11

Slide 11 text

Removing nodes // remove ada var removed = users.child(‘ada’).remove() // returns Promise removed.then(function() { console.log(‘remove succeeded’) }).catch(function() { console.log(‘problem removing’) })

Slide 12

Slide 12 text

Example let db = new firebase.database() var usersRef = db.ref('users') usersRef.set({ taro: “Taro Yoshida”, tetsuri: “Tetsuri Moriya” }) usersRef.on(‘child_removed’, child => alert(“Delete user” + child.val()) ) usersRef.child(“tetsuri”).remove() Trigger an event when a child node is removed from the referenced node.

Slide 13

Slide 13 text

Hosting [leszek:~/Documents/megakanban]$ firebase deploy === Deploying to 'megakanban'... i deploying database, hosting ✔ database: rules ready to deploy. i hosting: preparing public directory for upload... ✔ hosting: 2 files uploaded successfully i starting release process (may take several minutes)... ✔ Deploy complete! Hosting Site: https://megakanban.firebaseapp.com Dashboard: https://console.firebase.google.com/project/megakanban/overview Visit the URL above or run firebase open

Slide 14

Slide 14 text

DEMO