Firebaseって便利
Androidのアプリを作成するときに、Googleから提供されているFirebaseというサービスを使用しています。広告や利用分析、データベースやホスティングを簡単に導入できます。今までは、広告(admob)や利用分析を使ってみていたんですが、データベースも触りたいと思っていました。
とりあえずTodo作ろう
ユーザー認証（Authentication）とデータベース(Realtime Database)を導入しました。ユーザー認証は、Firebaseのマニュアル読んでもよく判らない。ネットを探して、サンプルを見つけてほぼコピペで導入しました。実際に配信するまでには、ちゃんと理解しないといけないでしょう。
データベースに関しては、それほど難解な部分は無いようです。スマホ２台から、同じメールアドレスでログインすると、同じ情報が見れるようになります。当たり前と言えば当たり前ですが、チャットサービスを作ろうとする際には、必須な機能ですね。
WEBでも見たいよね。
複数のスマホで見れるなら、WEBでも確認できれば、もうちゃんとしたサービス。どうせなら、新技術を覚えちゃいましょうということで、Node.js、Vue.jsをインストール。
自動で作られるHelloWorld.vueを修正することで、動作確認をします。以下は、ネットを見ながら修正したもの。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<template> <div class="hello"> <h1>{{ msg }}</h1> <button v-on:click="kick">kick me!</button> </div> </template> <script> export default { name: 'HelloWorld', props: { msg: String }, methods: { kick: function (event) { this.msg += " kick!"; } } } </script> |
すると、
|
1 |
kick: function (event) { |
の行で、エラーが発生。
(parameter) event: any
‘event’ is defined but never used.eslintno-unused-vars
eventって定義されているけど、使用されていないじゃん。というエラーですが、ううむ。ネットを見ても、普通に使われているんだけど。無視して実行しようとしたけれども、Failed to compile.が出てやっぱり動かない。
eslintという文法チェッカーの設定漏れからなと思い、
|
1 2 |
// eslint-disable-next-line no-unused-vars kick: function (event) { |
を記述したところ、動作するようになりました。次の行はチェックしなくていいですからという指示ですけどね。
次の目標は、vue.js上で、ユーザー認証とデータベースの使用です。