[GCPUG India] Firebase - Build Extraordinary Apps

[GCPUG India] Firebase - Build Extraordinary Apps

91aeb42c5d9548918d1459f64240e503?s=128

Kazunori Sato

July 04, 2015
Tweet

Transcript

  1. Firebase: Build Extraordinary Apps

  2. +Kazunori Sato @kazunori_279 Kaz Sato Developer Advocate, Cloud Platform, Google

    Inc. Cloud community advocacy Cloud product launch support
  3. Mobile App for Millions of People Authentication. Storing Data. Interactions.

  4. “Make it work in the Cloud”

  5. In the Cloud, you need… Front End. Business Logic. Database.

    Multiple Servers, Load Balancers, Replicas, Backups...
  6. For Clients, you need to support… Smart Phones. Tablets. Desktops.

    Android, iOS and Browsers
  7. Talking to a Backend Large Scale M-to-N Connections with Realtime

    messaging … It’s not easy
  8. = Expensive Engineering Time

  9. Is there a better way?

  10. Firebase is a powerful platform for mobile and web applications.

  11. Firebase User Authentication Realtime Database Static Hosting

  12. Firebase User Authentication Realtime Database Static Hosting

  13. Firebase User Authentication Realtime Database Static Hosting

  14. Location Collaboration Gaming Realtime is…

  15. Location Collaboration Gaming Realtime is…

  16. Location Collaboration Gaming Realtime is…

  17. Unreliable networks Multi Platform Realtime is hard! Complex Transport Stateful

    2-way connection How to implement it?
  18. Unreliable networks Multi Platform Realtime is hard! Complex Transport 4G/WiFi

    switching. Subways. Tunnels. Basements.
  19. Unreliable networks Multi Platform Realtime is hard! Complex Transport Different

    Capabilities, Behaviors and Languages
  20. Firebase in the Real World

  21. CBS 50,000 Concurrent Users 27,000,000 chat messages

  22. $40,000 Kickstarter 100,000 Users

  23. 200,000+ Developers

  24. How to Develop?

  25. Demo: mmoasteroids

  26. Firebase Dashboard Database. Security. Analytics. Debugging. Deployment.

  27. Setup // Firebase connection Stuff var firebaseRef = new Firebase("https://mmoasteroids.firebaseio.com");

    var firebaseRefGame = firebaseRef.child('game');
  28. Start up the user’s ship // Add player's ship to

    Firebase var myship = firebaseRefGame.child('players').push(); // Schedule player removal on disconnect at the backend myship.onDisconnect().remove();
  29. // Write new ship location to Firebase on any update

    myship.set({ ship: { acc: this.acc, vel: this.vel, x: this.x, y: this.y, rot: this.rot, accb: KEY_STATUS.up }, user: currentUser }); Write our ship to firebase on updates
  30. // Sync new enemy ships from Firebase to local game

    state firebaseRefGame.child('players').on('child_added', function (snapshot) { if (snapshot.key() !== myship.key()) { var enemy = new EnemyShip(); enemy.acc = snapshot.val().ship.acc; enemy.vel = snapshot.val().ship.vel; enemy.x = snapshot.val().ship.x; enemy.y = snapshot.val().ship.y; enemy.rot = snapshot.val().ship.rot; enemy.accb = snapshot.val().ship.accb; enemy.user = snapshot.val().user; enemy.visible = true; enemy.fref = firebaseRefGame.child('players').child(snapshot.key()); }}); We read enemy ships too...
  31. firebaseRefGame.child('players').on('child_removed', function (snapshot) { if (snapshot.key() !== myship.key()) { var

    enemy = Game.sprites[snapshot.key()]; enemy.visible = false; delete Game.sprites[snapshot.key()]; Game.explosionAt(snapshot.val().ship.x, snapshot.val().ship.y); } else { Game.ship.collision(null); } }) We handle enemy ship “removal”
  32. bullet.fref = firebaseRefGame.child('bullets').push({ s: myship.key(), x: bullet.x, y: bullet.y, vel:

    bullet.vel }); bullet.fref.onDisconnect().remove(); Bullets
  33. // Sync enemy bullets from Firebase to local game state

    firebaseRefGame.child('bullets').on('child_added', function (snapshot) { var bullet = snapshot.val(); if (bullet.s !== myship.key()) { var enemybullet = new EnemyBullet(); enemybullet.x = bullet.x; enemybullet.y = bullet.y; enemybullet.vel = bullet.vel; enemybullet.visible = true; enemybullet.fref = firebaseRefGame.child('bullets').child(snapshot.key()); Game.sprites['bullet:' + snapshot.key()] = enemybullet; }}); Enemy bullets
  34. firebaseRefGame.child('bullets').on('child_removed', function (snapshot) { var bullet = snapshot.val(); if (bullet.s

    !== myship.key()) { var enemybullet = Game.sprites['bullet:' + snapshot.key()]; if (enemybullet != null) { enemybullet.visible = false; } delete Game.sprites['bullet:' + snapshot.key()]; } }); Enemy bullet removal
  35. Conclusions

  36. Mobile Is Important!

  37. Traditionally Complex!

  38. None
  39. None
  40. https://firebase.com

  41. Thank you! This work is licensed under a Creative Commons

    Attribution 2.0 Generic License.