2019.06.20こんにちは。BLEの機能を応用しマイクロビットから取得したデータをクラウドに記録する。いうプログラムに挑戦したいと思います。記述が長くなりそうなので回をいくつかにわけてご紹介したいと思います。今回はその第1回です。Firebaseを使った構築に挑戦します。FireBaseはGoogleアカウントがあれば手軽に使う事ができます。始められるのでオススメの環境だと思います。始めてつかわれるかたはぜひこれを機会に試してみてください。プラットフォームで、ビジネスの成長に役立ちます。firebase.google.com対象読者というわけで、今回の記事は下記のような読者層を想定した内容となっています。HTMLやJavaScriptなどの基本的なプログラムを理解されている方FireBaseとはまず最初にFirebaseについてその概要をご紹介したいと思います。FireBaseは主にスマートフォンアプリ開発のバックエンドを担うサービスを提供しています。サーバー構築なしに簡単にスマートフォンからのデータを記録できるなど、様々なサービスが存在しています。Database」を使っていきたいと思います。Database(リアルタイムデータベース)リアルタイムデータベースは次のような特徴をもっています。データが更新されるとリアルタイム(数ミリ秒)で接続されている端末にデータを同期できるNoSQLなデータベースで、JSON形式でデータを保持するアプリケーションサーバ不要。直接クライアントアプリ(JavaScriptなど)から操作できるなどの特徴を持っています。簡単に言うと、リアルタイムチャットのようなアプリケーションをJavaScriptだけで簡単に作れてしまう感じです。今回はJavaScriptでの利用例を紹介します。FirebaseプロジェクトのセットアップFirebaseサービスでは、まず初めにプロジェクトを作成する必要があります。下の写真の手順で作成してみてください。1.Firebaseのサイトへ移動2.新しいプロジェクトを作成します。3.プロジェクト名を決めます。(黒塗りになっていますが、IDが任意に決定されます)アナリティクスの設定は特に今回は使わないのでチェックははずしておきます。下にスクロールして「決定」を押します。4.こちらも特に何も行わず、スクロールして「プロジェクトを作成」を押します。5.しばらく待つと、プロジェクトが完成します。6.左上の歯車を選び、プロジェクトの設定を選びます。7.プロジェクトの設定画面で下までいくと、このような画面が出ますのでタグのようなマーク(下図の赤丸)をクリックします。8.アプリのニックネームを適当に入れます。9.これで準備完了です。画面に出ているスクリプトを自身のWebページに貼りつけます。白塗りになっている部分は適宜IDなどが割り振られています。プログラム例それではJavaScriptのプログラム部分のみを掲載します。src="https://www.gstatic.com/firebasejs/6.0.4/firebase-database.js"></script>FireBaseのリアルタイムデータベースも使用するため、script読み込みが2つになっています。プロパティの値部分はすべて仮です。ご自身のFirebaseプロジェクトから取得された値を設定してください。プロパティの値部分はすべて仮です。ご自身のFirebaseプロジェクトから取得された値を設定してください。success!");}});}このプログラムにより、リアルタイムデータベースには次の内容が書き込まれます。記録内容はJSONデータのように見ることができます。ルートには「microbitlogs」というプロジェクト名が入っています。firebaseライブラリの提供するrefメソッドを使い、引数で指定した特定のオブジェクト構造にアクセスします。/でオブジェクト構造の階層をたどっていきますので、users内の(ユーザーID)内のtemperatureオブジェクトを指します。'/temperature')続くpushメソッドでは指定したオブジェクトを新規に追加しています。value}ですので、このオブジェクトがそのまま新規追加されます。この場合、refメソッドで指定したusers/(ユーザーID)/temperatureの構造が事前になかったとしても、新規に作成されて追加されます。この時、オブジェクトを保有するためのキーがFirebaseにより自動的に割り振られたIDとなります。ランダムに見えますが、このIDは時系列に基づき作成されており、temperature内部でその昇順に並べられます。ちなみにtimestampプロパティは現在時刻のミリ秒表現を設定し、valueプロパティには任意の値が入ります。最終的にはこのvalueに気温の数値が入るイメージです。pushメソッドの第2引数は、処理完了時のコールバックメソッドを指定します。success!");}}エラーオブジェクトが取得された場合と成功時に分け、コンソール表示を行なっています。終わりにというわけで今回は、Firebaseのセットアップとサンプルプログラムレベルのソースコードのご紹介をさせていただきました。最後までご覧くださりありがとうございました。ここまでの内容でリアルタイムDBへの記録の基本は試して頂けるかと思います。チャレンジしてみてください。次回はMicrobitから気温を取得するプログラムを追加していきたいと思います。引き続きよろしくお願いします。合同会社イー・シー・エフでは、子ども向けプログラミングなどの教育講座を実施しています。プログラミング教室の案内や教育教材の情報は、下記よりご確認ください。ECFエデュケーションキッズも大人も。Tech関連記事IoTブラウザ(JavaScript)でマイクロビットとBLE!Webページをマイクロビットとつないでみるサンプルプログラムをご紹介しております。新バージョンレポートマイクロビットの公式エディタがバージョンアップ!その新UIをいち早くご紹介。IoTブラウザ(JavaScript)でマイクロビットとBLE!(2)JavaScriptを使って、マイクロビットを光らせるプログラムのサンプルをご紹介します。IoTBLEを使ってAndroidとマイクロビットをつなげるまで(2)マイクロビットをAndroidアプリと連携させてみました。IoTマイクロビットで動く工作(シャカシャカミュージック)シャカシャカ振ると曲がかわるミュージックボックスを作ろう。IoTマイクロビット工作-アクティビティベルト運動やトレーニングに使えるアイテムを自分で作ってみましょう。今回は腹筋カウンターです。LLC.メニューホーム合同会社イー・シー・エフECFエデュケーションホーム検索トップサイドバーカテゴリーGitIoTSTEMコンピュータリテラシープログラミングJavaJavaScriptPythonScratchキッズプログラミングプログラミングと教育マイクロビット工作タイトルとURLをコピーしました。