Firebase Webアプリ一本勝負 [山口]

会社の 20% ルールを使って Firebase という BaaS 的なあれを使って1つ Web アプリを作りました。

Firebase を使うのは初めてなのでアカウントを新規作成する所からです。

Firebase こんな画面でデータが見れてカッコイイです。

なにつくったの？

Firebase の特徴として、サーバサイドのデータに変化があった時に通知される機能があります。

なので、誰かがデータを追加したら、それが反映されるっぽい何かを作ろうと思いました。

そんでもって作ったのがこれです。

赤い円が書かれているので、その中に自分の名前を入れるゲームです。

curl というコマンドで座標データを Firebase に送りつけるとブラウザ上にその座標で自分の名前が表示されます。

HTML と JS のコードはこんな感じ

  
    
    
    
    
  
  

    

    
curl -X POST -d '{"x": 30, "y": 130}' https://fiery-fire-5323.firebaseio.com/your_name.json
    
    
  

座標を Firebase に送りつける curl のスクリプトはこんな感じ

#! /bin/bash

if [ $# -ne 3 ]; then
    echo "引数が3つ必要"
    echo "send.sh <名前>  "
    exit 1
fi

JSON=$(echo -e {\"x\": $2, \"y\": $3})

curl -X POST -d "$JSON" https://fiery-fire-5323.firebaseio.com/$1.json

Web 系は弱いので良い練習になりました。

jQuery の使い方すらメッチャググりながらやったので、かなりしょぼいことしか出来ていませんが Baas を使ってなにか作ったのは初めてだったので面白かったです。