ElectronでFirebaseを使ってみた（仮）

Slide 1

Slide 1 text

ElectronͰFirebaseΛ࢖ͬͯ ΈΔʢԾʣ Gotanda.js #4 in Retty

Slide 2

Slide 2 text

ࣗݾ঺հ • Github @nasum • twitter @tomato360

Slide 3

Slide 3 text

Electron • ݴΘͣͱ஌ΕͨGithub੡ͷϑϨʔϜϫʔΫ • ࠷ۙ1.0͕ϦϦʔε͞Ε·ͨ͠ • ΋͏1.2.1ʹͳͬͯΔɻૣ͕͞ා͍ • ηΩϡϦςΟେมͳΠϝʔδ  ElectronΞϓϦͷXSSͰrm -fr /Λ࣮ߦ͢Δ  http://qiita.com/akameco/items/cc6fc949e7c9f0d1a42a 

Slide 4

Slide 4 text

Firebase • Google͕ങऩͨ͠BaaS • ϦΞϧλΠϜʹσʔλΛಉظ͢ΔͷʹڧΈͷ ͋ΔαʔϏε • Google IO Ͱϩάղੳ΍ϓογϡ௨஌ͷػೳ ͕௥Ճ͞Εͯ࿩୊

Slide 5

Slide 5 text

૊Έ߹Θͤͨಈػ • Electron΋1ܥʹͳֶͬͨ͠ͼ௚͢ࠒ߹͍ • EvernoteͷΑ͏ͳ΋ͷΛ࡞Γ͔ͨͬͨ • σʔλΛͲ͏ཷΊΔ͔ʹ೰Μͩ • nedb   https://github.com/louischatriot/nedb • electron-json-storage   https://github.com/jviotti/electron-json-storage • etc…etc… • Firebaseͷrealtime databaseΛ༻͍Ε͹͍͚ͦ͏

Slide 6

Slide 6 text

FirebaseͷWeb൛ͰͰ͖Δ͜ͱ • Authentication • Realtime Database • Storage • Hosting • Cloud Messaging ElectronͰ࢖͑ͦ͏

Slide 7

Slide 7 text

஫ҙɿͣͬͱܯࠂ͕Ͱ·͢

Slide 8

Slide 8 text

ElectronͰAuth • ElectronͰ͸Google΍TwitterɺFacebookͷೝূ͸࢖͑ͳ͍ • origin͕file://͔ͩΒઃఆͰ͖ͳ͍ • CordovaͰࣅͨΑ͏ͳ͜ͱͰ೰ΜͰ͍Δਓ͕͍ͨ  https://groups.google.com/forum/#!topic/firebase-talk/ eUzTjj8mVa4 • signInWithEmailAndPasswordΛ࢖͑͹ೝূ͸ग़དྷΔ  https://firebase.google.com/docs/auth/web/password- auth#before_you_begin

Slide 9

Slide 9 text

Ϣʔβ࡞੒ var auth = firebase.auth(); auth.createUserWithEmailAndPassword(email, password).then(function(){ console.log('ok') var uid = auth.currentUser.uid; console.log(uid) writeUserData(uid, "hoge", email); }).catch(function(error) { // Handle Errors here. var errorCode = error.code; var errorMessage = error.message; // ... });

Slide 10

Slide 10 text

Ϣʔβೝূ var auth = firebase.auth(); auth.signInWithEmailAndPassword(email, password).then(function(){ console.log('ok') var uid = auth.currentUser.uid; console.log(uid) }).catch(function(error) { // Handle Errors here. var errorCode = error.code; var errorMessage = error.message; console.log(errorCode); console.log(errorMessage); });

Slide 11

Slide 11 text

ೝূ݁Ռ

Slide 12

Slide 12 text

ೝূ৘ใ͸LocalStorageʹೖΔ

Slide 13

Slide 13 text

ೝূ͸͏·͍ͬͨͧ͘ʂ  ʢͰ΋ݸਓ༻్Ͱೝূ͸࢖Θͳ͍͔΋Ͷʂʣ

Slide 14

Slide 14 text

Realtime Database • ίϯιʔϧͰϧʔϧΛܾΊΔඞཁ͕͋Δ • ݁ߏෳࡶͰ׳ΕΔ·Ͱେม • FirebaseͷRulesΛཧղ͢Δ  http://qiita.com/laco0416/items/ b068ab0cf19a26f0992d

Slide 15

Slide 15 text

ࢼ͠ʹ࡞ͬͨϧʔϧ

Slide 16

Slide 16 text

ϧʔϧ͸ςετ΋Ͱ͖Δ

Slide 17

Slide 17 text

realtime databaseʹอଘ͢Δ ίʔυ var auth = firebase.auth(); var uid = auth.currentUser.uid; var obj = { "title": "test", "description": "description" }; //σʔλΛηοτ͢Δ firebase.database().ref('documents/' + uid).push(obj); //σʔλͷҰཡΛऔಘ͢Δ firebase.database().ref('documents/' + uid).once('value').then(function(snapshot) { console.log(snapshot.val()); }); //σʔλͷมߋΛݕ஌͠දࣔ͢Δ firebase.database().ref('documents/' + uid).on('value', function(snapshot) { console.log(snapshot.val()); });

Slide 18

Slide 18 text

ಈ͔ͯ͠ΈΔ

Slide 19

Slide 19 text

realtime database΋͏·͘ ͍͖ͦ͏ʂ

Slide 20

Slide 20 text

Ͱ΋͜͜Ͱ࣌ؒ੾Ε storageͱ͔΋ࢼ͔ͨͬͨ͠

Slide 21

Slide 21 text

·ͱΊ • ೝূ͸ଞͷαʔϏεͷOAuth࢖͑ͳ͍͚Ͳemail͔ͭͬͨೝূ͸ग़ དྷΔ • realtime database͸บ͕͋Δ • ϦΞϧλΠϜͰߋ৽͞ΕΔ͔Βຊ౰͸νϟοτ޲͚ͩΑͶ • ࣮͸ೝূͳ͠Ͱ࢖͑Δ • ܯࠂ͕ग़ଓ͚Δ͔Βݸਓ༻్Ͱ࢖͓͏ʂ • ࠷ऴతʹElectron͋Μ·Γؔ܎ͳ͘ͳͬͪΌͬͨ