Tweet
Tweet

Slide 1

Slide 1 text

What is Firebase? Alvin Woon Plurk & TMI Saturday, 12 January, 13

Slide 2

Slide 2 text

- Real time database and synchronization - Data accessible via JS or REST - Build real time app with just html/js Saturday, 12 January, 13

Slide 3

Slide 3 text

Data structure Every piece of data inside your Firebase is also accessible by a unique URL REST, tree-based design. Design your app with this in mind. This is non-relational, no-join data structure Nested children allow you to structure your data Saturday, 12 January, 13

Slide 4

Slide 4 text

http://chat.firebaseio.com/users http://chat.firebaseio.com/users/alvin http://chat.firebaseio.com/users/alvin/messages http://chat.firebaseio.com/users/alvin/messages/latest Let’s say you created an app called ‘chat’ Saturday, 12 January, 13

Slide 5

Slide 5 text

Saturday, 12 January, 13

Slide 6

Slide 6 text

//Initialize Firebase var db = new Firebase('https://chat.firebaseIO- demo.com'); //Add ‘nodejs’ channel to chatroom db.set('nodejs'); Write data to Firebase Saturday, 12 January, 13

Slide 7

Slide 7 text

//Initialize Firebase var db = new Firebase('https://chat.firebaseIO- demo.com/nodejs/users'); //‘listen’ to the users ‘column’ for ‘nodejs’ channel db.on('child_added', function(snapshot) { //alert is run every time someone join the channel alert(snapshot.val()+’ has joined the channel’); }); Read data from Firebase Saturday, 12 January, 13

Slide 8

Slide 8 text

Transaction //Initialize Firebase var count = new Firebase('https://chat.firebaseIO- demo.com/total_messages'); count.transaction(function(current_value) { return current_value + 1; }); Saturday, 12 January, 13

Slide 9

Slide 9 text

Query limits //Initialize Firebase var messageListRef = new Firebase('https:// chat.firebaseIO-demo.com/message_list/'); var messageListQuery = messageListRef.limit(100); messageListQuery.on('child_added', function(snapshot) { bla }); Saturday, 12 January, 13

Slide 10

Slide 10 text

var dataRef = new Firebase('https://chat.firebaseio- demo.com/'); $('#messageInput').keypress(function (e) { if (e.keyCode == 13) { var name = $('#nameInput').val(); var text = $('#messageInput').val(); dataRef.push({name: name, text: text}); $('#messageInput').val(''); } }); function printChatMessage(name, text) { $('
').text(text).prepend($('').text(name+': ')).appendTo($('#messagesDiv')); $('#messagesDiv')[0].scrollTop = $('#messagesDiv') [0].scrollHeight; }; dataRef.on('child_added', function(snapshot) { var message = snapshot.val(); printChatMessage(message.name, message.text); }); Saturday, 12 January, 13

Slide 11

Slide 11 text

MAPCHATS .com Social network on Google Maps Saturday, 12 January, 13

Slide 12

Slide 12 text

Wat? To create a real time, highly addictive and immersive social networking experience where every photos, videos and markers on the map is an interactive chatroom. All activities are bubbled up for everyone to see to create a lively conversation environment. Saturday, 12 January, 13

Slide 13

Slide 13 text

Step 1: Find the songs you like Step 2: Search for songs on youtube Saturday, 12 January, 13

Slide 14

Slide 14 text

Taiwan’s playbook Taiwan’s entertainment media consumption is increasing at ridiculous rate. Taiwan is also the centre hub for the world’s mandarin pop music and culture About half of Taiwan’s online users say they trust recommendations and reviews. Attictv is good with analyzing Latin-centric music data. They need more Chinese videos as data source. Saturday, 12 January, 13

Slide 15

Slide 15 text

I dont wanna think! Saturday, 12 January, 13

Slide 16

Slide 16 text

[email protected] Saturday, 12 January, 13