Firebase Dev Day Bangkok: Keynote

Sittiphol PhanvilaiGDE AndroidCEO, Cheese Factory #FirebaseDevDay

KeynoteFirebase Dev Day

Sittiphol PhanvilaiAndroid GDECEO & Founder,The Cheese Factory Co., Ltd.

#FirebaseDevDay

“ Firebase Dev Day ,,Welcome to

#FirebaseDevDay

#FirebaseDevDay

What is Firebase?

#FirebaseDevDay

Let’s start withan user’s behavior

nowadays

#FirebaseDevDay

“Web-then-App ”

#FirebaseDevDay

#FirebaseDevDay

#FirebaseDevDay

Architecture

ServerAndroid iOS

#FirebaseDevDay

Setting up Server• Create Server Instances• Set up Scalable Server Stack• Set up Deployment Method• Set up an Auto-scaling• Set up an Automated Backups• Install Cert to enable HTTPS• etc.

#FirebaseDevDay

Implementing Server Side Code• Develop Web Site• Develop APIs to Interface with Mobile

App• Make them secure

#FirebaseDevDay

Architecture

ServerAndroid iOS

#FirebaseDevDay

Time to Market

#FirebaseDevDay

#FirebaseDevDay

Setting up Server• Create Server Instances• Set up Scalable Server Stack• Set up Deployment Method• Set up an Auto-scaling• Set up an Automated Backups• Install Cert to enable HTTPS• etc.

#FirebaseDevDay

Implementing Server Side Code• Develop Web Site• Develop APIs for Mobile App• Make them secure

#FirebaseDevDay

Architecture

ServerAndroid iOS

#FirebaseDevDay

Backend-as-a-Service

(BaaS)

#FirebaseDevDay

Architecture

Android iOS

Database

Hosting

Storage

Authentication

REST REST

#FirebaseDevDay

Architecture

Android iOS

Database

Hosting

Storage

Authentication

SDK forAndroid

SDK foriOS

#FirebaseDevDay

Firebase is hosted onGoogle Cloud Architecture.

#FirebaseDevDay

Setting up Server• Create Server Instances• Set up Scalable Server Stack• Set up Deployment Method• Set up an Auto-scaling• Set up an Automated Backups• Install Cert to enable HTTPS• etc.

#FirebaseDevDay

Implementing Server Side Code• Develop Web Site• Develop APIs to Interface with Mobile

App• Make them secure

#FirebaseDevDay

Architecture

Android iOS

Database

Hosting

Storage

Authentication

SDK forAndroid

SDK foriOS

#FirebaseDevDay

With Firebase• Compacted Size Development Team• Fast Product Delivering• Reduced Budget• Scalable

#FirebaseDevDay

Architecture

Android iOS

Database

Hosting

Storage

Authentication

SDK forAndroid

SDK foriOS

#FirebaseDevDay

IoT

#FirebaseDevDay

IoT

Database

Hosting

Storage

Authentication

#FirebaseDevDay

#FirebaseDevDay

“Developer’s Good Friend”

#FirebaseDevDay

DEVELOPGROW

EARN

Backend ServicesRealtime DatabaseAuthenticationHostingStorageCloud MessagingRemote Config

App Quality ServicesTest Lab for AndroidCrash Reporting

AcquisitionDynamic LinksInvitesAdWords

Re-EngagementNotificationsApp Indexing

In-app AdsAdMob

Analytics

#FirebaseDevDay

#FirebaseDevDay

Authentication• Register / Login with

• Email + Password• Google• Facebook• Twitter• GitHub

• Email address verification• Password reset

#FirebaseDevDay

Authentication

var auth = firebase.auth()

#FirebaseDevDay

Creating Userfirebase.auth() .createUserWithEmailAndPassword(email, password) .then((authData) => { }) .catch((error) => { // Handle Errors here. var errorCode = error.code; var errorMessage = error.message; // ... });

#FirebaseDevDay

Signing Infirebase.auth() .signInWithEmailAndPassword(email, password) .then((authData) => { }) .catch((error) => { // Handle Errors here. var errorCode = error.code; var errorMessage = error.message; // ... });

#FirebaseDevDay

Signing Outfirebase.auth() .signOut() .then(() => { // Sign-out successful. }, (error) => { // An error happened. });

#FirebaseDevDay

Facebook Loginvar provider = new firebase.auth.FacebookAuthProvider();provider.addScope(‘user_birthday’);provider.setCustomParameters({ ‘display’: ‘popup’ });

firebase.auth() .signInWithPopup(provider) .then((result) => { var token = result.credential.accessToken; var user = result.user; }, (error) => { // Handle Errors here. });

#FirebaseDevDay

Custom Auth Service• Easily integrate your custom authentication

service using JWT.firebase.auth() .signInWithCustomToken(jwtToken) .then((authData) => { }) .catch((error) => { // Handle Errors here. });

#FirebaseDevDay

Realtime Database• Cloud-hosted NoSQL database

• Synchronization & conflict resolution

• Access directly from your app

#FirebaseDevDay

Realtime Database

#FirebaseDevDay

Realtime Database

var database = firebase.database()

#FirebaseDevDay

Writing Datavar ref = firebase.database() .ref(‘lives/live-nuuneoi-com/name’);

ref.set(‘wahahahaha’);

#FirebaseDevDay

Writing Datavar ref = firebase.database() .ref(‘lives/live-nuuneoi-com/info’);

ref.set({ username: “nuuneoi”, gender: “male”});

#FirebaseDevDay

Child Events Listeningvar ref = firebase.database() .ref(‘lives/live-nuuneoi-com/info’);

ref.on(‘child_added’, (data) => {});

ref.on(‘child_changed’, (data) => {});

ref.on(‘child_removed’, (data) => {});

#FirebaseDevDay

Realtime means Realtime[Some Live Demo]

#FirebaseDevDay

Automated Backups

#FirebaseDevDay

Storage• Easy file storage

• Handles poor connectivity

• Backed by & accessible fromGoogle Cloud Storage

#FirebaseDevDay

Storage

var storageRef = firebase.database().ref();

#FirebaseDevDay

Uploading a File

var storageRef = firebase.database().ref();

var fileRef = storageRef.child(‘/files/hello.jpg’);

#FirebaseDevDay

Uploading a File

var storageRef = firebase.database().ref();

var fileRef = storageRef.child(‘/files/hello.jpg’);fileRef.put(file, metadata) .then((snapshot) => { // Upload successful. }) .catch((error) => { });

#FirebaseDevDay

Downloading a File

fileRef.getDownloadURL() .then((url) => { // Insert url into an <img> tag // or download directly from url // with XMLHttpRequest }) .catch((error) => { });

#FirebaseDevDay

Hosting• Serve static assets

• SSL by default

#FirebaseDevDay

DeploymentInstall the Firebase CLI

npm install –g firebase-tools

Initialize your app$ firebase init

Add a file

Deploy your website$ firebase deploy

#FirebaseDevDay

DEVELOPGROW

EARN

Backend ServicesRealtime DatabaseAuthenticationHostingStorageCloud Messaging

#FirebaseDevDay

#FirebaseDevDay

DEVELOPGROW

EARN

Backend ServicesRealtime DatabaseAuthenticationHostingStorageCloud MessagingRemote Config

#FirebaseDevDay

Remote ConfigMake changes to your app's default behavior and appearance by changing server-side parameter values.

#FirebaseDevDay

DEVELOPGROW

EARN

Backend ServicesRealtime DatabaseAuthenticationHostingStorageCloud MessagingRemote Config

App Quality ServicesTest Lab for Android

#FirebaseDevDay

#FirebaseDevDay

#FirebaseDevDay

#FirebaseDevDay

DEVELOPGROW

EARN

Backend ServicesRealtime DatabaseAuthenticationHostingStorageCloud MessagingRemote Config

App Quality ServicesTest Lab for AndroidCrash Reporting

#FirebaseDevDay

#FirebaseDevDay

DEVELOPGROW

EARN

Backend ServicesRealtime DatabaseAuthenticationHostingStorageCloud MessagingRemote Config

App Quality ServicesTest Lab for AndroidCrash Reporting

AcquisitionDynamic LinksInvitesAdWords

Re-EngagementNotificationsApp Indexing

In-app AdsAdMob

Analytics

#FirebaseDevDay

#FirebaseDevDay

#FirebaseDevDay

#FirebaseDevDay

“Developer’s Good Friend”

#FirebaseDevDay

Real Case Study

#FirebaseDevDay

#FirebaseDevDay

#FirebaseDevDay

10 hours codingon planew/o internet

#FirebaseDevDay

Hackathon

#FirebaseDevDay

Code Battle16:00 – 16:45

#FirebaseDevDay

#FirebaseDevDay

$0.17

#FirebaseDevDay

Will it last long?The Last Question

Thank You!

#FirebaseDevDay

Sittiphol PhanvilaiAndroid GDECEO & Founder, The Cheese Factory Co., Ltd.

Facebook Page: nuuneoi.comTwitter: @nuuneoi