スマホアプリ開発を加速する,Firebaseを使ってみよう

第2回 Firebase最初の一歩 ─簡単なデータの保存と読み出し

この記事を読むのに必要な時間:およそ 4 分

Firebaseのデータ構造

Firebaseに実際にデータを保存したり読み出したりする前に,Firebaseのデータ構造について理解しておくことはとても重要です。

JSONオブジェクト

Firebaseのデータはアプリケーションごとに1つのJSONオブジェクトとして保存されます。つまり,リレーショナルデータベースにあるテーブルやスキーマ,それに対応するレコードといったものは存在しません。

いわゆるドキュメント志向なNoSQLとして,JSONで表現できる任意の柔軟なデータ構造を取ることができます。

冒頭で申し上げたユーザ一覧の例は,Firebaseでは以下のように表現することができます。

{
  "users" : {
    "shiroyama" : {
      "name" : "Fumihiko Shiroyama",
      "address" : "Tokyo, JP"
    },
    "satou" : { ... },
    "suzuki" : { ... },
    "tanaka" : { ... }
  }
}

スキーマレスなので,後からユーザの属性に"gender" : "male"を追加するといったことも容易にできます。

{
  "users" : {
    "shiroyama" : {
      "name" : "Fumihiko Shiroyama",
      "address" : "Tokyo, JP",
      "gender" : "male"
    },
    ...
  }
}

データをURIで一意に特定

JSONオブジェクトということは,データがツリー状に階層化されているということなので,あるアプリケーションのあるデータをURIで簡単に特定することができます。先ほどの例で言うと,https://<YOUR-FIREBASE-APP>.firebaseio.com/users/shiroyama/nameにアクセスするとFumihiko Shiroyamaというデータを取り出すことができます。

これは,リレーショナルデータベース等よりもデータの構造が直感的にわかりやすく,また,特定の階層にだけアクセス制御を掛けるといったことも容易なので,Firebaseの利点のひとつと言えるでしょう。

Webコンソールでデータを保存

Firebaseのデータの構造について理解したところで,さっそくWebコンソールを使ってデータを保存してみましょう。

ダッシュボードにアクセスし,サインアップ時に自動生成されたアプリケーションの「Manage App」をクリックすると,初回アクセス時にはデータの読み書きのチュートリアルを体験することができます。

図6 Firebase Tour

図6 Firebase Tour

「Take the tour」をクリックすると,⁠+」アイコンを押してnamevalueに何か書き込んでみるように促されます。

ユーザ一覧を作成する前に,Webコンソールに慣れるために,ここではnamemessagevalueHello Firebaseとシンプルな文字列を保存してみましょう。

図7 Add Data

図7 Add Data

「Add」を押してデータが保存されるのを確認してみてください。

図8 Data Added

図8 Data Added

Webコンソールの使い方がわかったところで,ユーザ一覧を作成してみたいと思います。

先ほどデータを保存する際に指定したvalueには,文字列や整数といったシンプルな値のみならず,直接JSONオブジェクトを記述することもできます。今回はnameusersvalue{"shiroyama":{"name":""}}を保存してみてください。

Webコンソールにいきなり複雑なJSONオブジェクトを記述するのは大変なので,あえて{"name":""}と空欄にしてあります。

図9 Add Object[1]

図9 Add Object[1]

JSONオブジェクトとして保存されていることが確認できると思います。

図10 Add Object[2]

図10 Add Object[2]

次に{"name":""}の空欄の部分にカーソルを合わせてクリックすると,直接そのフィールドを加筆/修正することができます。

図11 Add Object[3]

図11 Add Object[3]

次にaddressの属性を追加してみたいと思います。shiroyamaの右あたりにカーソルを合わせて「+」アイコンをクリックしてください。

図12 Add Object[4]

図12 Add Object[4]

nameaddressvalueTokyo, JPと入力して「Add」で保存してください。

図13 Add Object[5]

図13 Add Object[5]

これでユーザ一覧usersshiroyamaというJSONオブジェクトを作成することができました。

図14 Add Object[6]

図14 Add Object[6]

実際にはこのWebコンソールでこのような複雑なデータを保存する機会はそれほど多くはありませんが,Firebaseでデータがどのように保持されているか視覚的に確認できたのではないでしょうか。

著者プロフィール

白山文彦(しろやまふみひこ)

サーバサイド,インフラ,Androidなど何でもやるプログラマ。