ほんとにWebデザイナーでもできる？Milkcocoaを使ったバックエンド楽ちん実装（4）までで、Milkcocoaを使ったデータの送信・保存～データ取得～ランダム表示、ができるようになりました。
ところで、まだひとつ問題が残っていましたね。
「次の問題に進むたびにデータストアのデータを取得してランダムで選ぶので処理に時間がかかる」ことです。
これを解消するために、処理の順番を変えていきます。
まず、今までは
1. 次の問題に進むボタンを押したときに
2. fungoGet()を実行すると
3. データを全件取得して
4. データ件数の中からランダムの番号を決めて
5. 決めた番号のデータを表示する
という順序でした。
これを、
1. データを全件取得しておく。
2. 次の問題に進むボタンを押したときに
3. fungoGet()を実行すると
4. データ件数の中からランダムの番号を決めて
5. 決めた番号のデータを表示する
としたいです。
var milkcocoa = new MilkCocoa("アプリID.mlkcca.com");
var fungo = milkcocoa.dataStore("fungoData");
var stream = fungo.stream().sort('asc');
stream.next(function(err, dataList) {
data = dataList;
});
stream.next()をfungoGet()の外側に出して、アプリを起動したときに先にデータを取得してしまおう、という作戦。
ただ、fungoGet()はnext(function(err, dataList){})の中にいません。
next()で取得したときのデータがどこにあるのかわからなくなってしまいます。
fungoGet()からでもデータを見ることができるように、
data = dataList;
と、変数にしまっておきましょう。
取得したデータはもともと配列なので、勝手に配列として代入されます。
Javascriptはそういうところが便利だし、エンジニア脳じゃない私でも感覚的に書いていけるので、すぐに結果が目に見えるし楽しいです。
しかしこういう「いいかげんでも大丈夫」ってのが深みにはまる原因なんですよね。
とっつきやすいけど奥が深いので、とても「私Javascriptできます」って胸張って言えるようになれない･･･
話がずれましたが、こうやって変数に入れておくと、fungoGet()を実行したとき
function fungoGet(){
var num = Math.floor( Math.random() * data.length );
hora = data[num].value.hora;
}
変数にしまっておいたデータのうち○件め、というのがすぐに取り出せます。
ここらへんはMilkcocoaのメソッドとは関係なく、普段書いているjsの話なので私でもすぐできました。
これで、通信状態があまりよくないところでも、問題を出すまでくるくるさせる必要がなくなりました！
( ﾟдﾟ)ﾊｯ!
もういっこ問題あった！
問題をサクサク進めていくところではなく、一番最初にスタートするときのことです。
1. アプリ起動
2. データを全件取得しておく
3. スタートボタンを押したら
4. データ件数の中からランダムの番号を決めて
5. 決めた番号のデータを表示する
という順序になるのですが、非同期のため
「2. データを全件取得しておく」が終わっていなくても、「3. スタートボタンを押したら」、まだデータがないのにデータを表示する処理を始めてしまいます。
このときもし電波が悪かったら、表示まで待たされてしまいますね。
そこで、スタートボタンを押したときだけ、毎回くるくるを表示します。
データの取得ができて画面に表示し終わってから、くるくるを非表示にします。
パフォーマンスも向上するし、体感としてもひっかかりがなく、電波が良好なときも毎回くるくるがチラチラすることがありません。
ただ動かすだけなら前回までの状態でいいのですが、こういう小さな調整を積み重ねることでより良いアプリにしていきたいですね！
これでようやくできましたε-(´∀｀*)ﾎｯ
もともとJavascriptが書ける人たちなら、このくらい簡単にできてしまいますね。
黒い画面を触る必要がないのでなんの抵抗もなく楽しんで制作できます。
そう、
黒い画面を触る必要がない
これ、私にとってはすっごく大事なポイントです。
Milkcocoaって名前のサービスなのに黒い画面をいじり倒さないといけなかったらぜんぜんかわいくない。
まあ、黒い画面いらないとか、そういう機能の話をし始めると、ほかのBaaSでも同じことなのかもしれません。
しかし、やっぱりサイトのデザインとか、名前とか、そういうとっつきやすさってのも大事。
高機能でなんでもできて堅牢なBaaSを「使いやすい」と思う人もいる。
シンプルでできることが絞られていて覚えることが少ないBaaSを「使いやすい」と思う人もいる。
Milkcocoaは後者だったので私でも使う気になれたし、ほんとうに使うことができた！ってことですね。
こうやって、バックエンドへのとっかかりを与えてくれたというところが一番素晴らしいんです。
Monacaを選んだのも、3年前にEXPOで興味があって立ち寄ったら最中もらえてｗ
そのころはJavascriptなんて1行も書いたことなかったけど、HTMLとCSSはできるからやってみたい！って思ったもん。
いまできることにちょっとプラスしてがんばれば新しいことができて、とても作れると思えなかったものが作れてしまう、っていうのは非常に魅力的ですね。
いきなりDB構築してって言われたら、ムリ！って思う。
いきなりアプリ作ってって言われたら、ムリ！って思う。
だからこうやって少しずつ近づいていけるような、手すりと踏み台を用意してくれるバリアフリーなサービスがありがたいし、どんどん増えていってると思うので、アンテナ張って活用していきたいです。
怖いけど貼っておきますね・・・