FJCT_ニフクラ mobile backend(mBaaS)お役立ちブログ

スマホアプリ開発にニフクラ mobile backend(mBaaS)。アプリ開発に役立つ情報をおとどけ!

NCMB for Excelにデータストア更新/削除機能を追加しました

https://cdn-ak.f.st-hatena.com/images/fotolife/m/mbaasdevrel/20171212/20171212211755.png

社内で大活躍しているのがMicrosoft Office系のソフトウェアでしょう。特に日本の業務で使われているのがExcelです。社内には膨大な数のマクロに溢れていることでしょう。

そこでmBaaSもExcelから使えるようになれば便利なはずです。そのためのクラスモジュール、NCMB for Excelにデータストア更新および削除機能を追加しました。

続きを読む

バイトの時間を忘れない!プッシュ通知でスプラトゥーン2のスケジュールを管理しよう

www.youtube.com

塗って塗って塗りまくる、そんなスプラトゥーンでは2になって新要素、サーモンランが登場しました。仲間と一緒にイクラを集めるミニゲームですが、修錬度もあり、やり込み要素の高いゲームです。決まった時間に仲間で集まって遊んだりするので、それをバイトと呼称している人たちもたくさんいます。

そんなバイトの開始時間を忘れないためにスケジュール管理している人もいるようです。カレンダーなどに入れても良いですが、普段の仕事などの内容と重なってしまうのは興ざめです。ここは独自のアプリで管理してみてはいかがでしょう。オマケ要素として、独自のプッシュ通知音を設定することで、他のプッシュ通知と区別して管理できるようにします。

続きを読む

mBaaSをフル活用!少人数での高速ソーシャルゲーム開発「強くてNEW GAME」開発者インタビュー

f:id:mbaasdevrel:20171120153417p:plain

mBaaSのスクリプト機能を使うことでアプリ内のロジックをクラウドで処理できるようになります。様々な使い方が考えられますが、ゲームではガチャ機能やチート防止に使われたりします。

今回はそんなスクリプト機能を徹底活用したスマートフォン向けゲームを開発したネストピ株式会社ディレクターの栗田 優輔氏、エンジニアの青木 仁志氏にお話を伺いました。

続きを読む

IoTに挑戦!実装に使える便利ツールとその活用事例の紹介

f:id:mbaasdevrel:20171117092238p:plain

植物の水分が足りていなかったらお知らせしてくれる、『植物の気持ちまるわかり君』 植物の水分が足りていないときに、Twitterでお知らせしてくれます。また、植物の土の水分状況がどのように推移しているのか、アプリからグラフとして見ることが出来ます。 センサーを使ったり、データベースサーバーを使ったりと、実装にはなんだか時間がかかりそうですね。ですが、このコンテンツ、たった2週間で完成しました! どうして短期間で開発することが出来たのでしょうか?今回活用した便利ツールを紹介致します。

続きを読む

ファイルストアの内容をすべてダウンロードするブックマークレットを作成しました

mBaaSではHTMLや動画、音楽ファイルなど任意のバイナリファイルを保存できるファイルストレージ機能を提供しています。ファイルはHTTPS公開でき、データストア同様に公開範囲を指定することもできます。

そんなファイルストアですが、エクスポート機能では対象外となっています。そのため、バックアップ目的でエクスポートを使われている場合、ファイルストアの内容はダウンロードできずに不便な思いをすることでしょう。

そこでブックマークレットを使ってファイルストアの内容をすべてダウンロードできるようにしました。

続きを読む

余興に使えるmBaaS×Webゲーム(๑•̀ㅂ•́)و✧

f:id:mbaasblog:20171117151208p:plain

おめでとうをいっぱい新郎新婦に届ける『全員参加!メッセージ送信ゲーム』

みんなが各自のスマホから新郎新婦に向けたお祝いメッセージを送ると、画面にお祝いを贈った人の顔写真とメッセージが表示され、少しずつ背景画像がめくられ現れていきます。すべてめくり終えるとミッションクリア!余興ムービーの上映がスタートされます。ゲームとムービーが一体になった新感覚?ゲームです。

そのゲームの裏でmbaasをどう活用したかを解説させていただきます。

続きを読む

Unity + mBaaS を使ってリアルタイム協力ゲームを爆速開発してみた

f:id:mbaasblog:20171116161855p:plain

同僚の結婚式の余興で mBaaS + Unity を使って、リアルタイム協力ゲームを作ってみました。 参加者各自のスマートフォンからメッセージと写真を送ると、会場スクリーン上に表示され、 一定数表示されるとゲームクリアという非常にシンプルかつ簡単ゲームです。

シンプルなゲームであれば、mBaaSの機能をフルに使う事によって、 高速にゲームを作る事ができますので、是非ご活用頂ければと思います。

続きを読む

結婚式の余興でmBaaSを使ったゲームを作ってみた

f:id:mbaasblog:20171116160907j:plain

実は先日、mBaaSチームの一人が結婚式を挙げました。 ありがたいことにチームメンバーも披露宴にお招きいただいたので、会を盛り上げるゲームを開発しましたっ!・・・もちろんmBaaSを使って

ゲームは、新婦への日ごろの感謝を伝え、新婦ご両親に新婦のお仕事内容および同僚からの信頼を伝えるようなものにしたいと考えていました・・・そしてできればご両親の琴線をつかみ涙腺を緩ませる何かを・・・

限りなく近いものができたと思うのでそちらについてご紹介します。

続きを読む

NCMB SDK for Unityが3.1.0になりました

エヴァンジェリストの一條です。

今回の大きな変更は、Android用である同梱のgoogleライブラリがjarファイルからaarファイルに変更になったことです。

Qiitaデモ紹介したような他SDKとの衝突問題のうち、ひとつがjar起因だったのですが、これが解消されます。 (そもそもUnity 5以降はjar非推奨でしたし!)

・android連携部分をjarからaarに置き換え

・SDK容量が小さくなった もともと6MBぐらいでしたが、今回のライブラリの見直しで1.52MBになりました

バージョン3からの追加

・ローカルのログイン情報をメニューから消せるようになりました

mobile backendゲーム活用事例『マリオネットAI』開発者インタビュー

こんにちは、ニフクラ mobile backend エヴァンジェリストの一條です。

ゲームアプリ開発者にニフティクラウド mobile backend(以下、NCMB)の利用事例をお伺いするこのコーナー。 今回は『マリオネットAI』の作者、"つね"こと嶋津恒彦(@simanezumi1989)さんにお話を伺いました。

作者近影

続きを読む

RESTAPIのたたき方を最速で確認する方法

f:id:mbaasblog:20171201093408p:plain

皆さん、mBaaSはどのような環境から使っていますか?スマートフォンのクライアントアプリからだけ使っていないでしょうか?自社システムなど他のサーバーと連携させるときはREST APIを使う必要があり若干ハードルが高いですよね。しかし!mBaaSには「REST APIツール」という簡単にREST APIの使い方が分かるツールがあるのでそちらを使えば、そんな悩みも吹き飛ぶはず・・・っということでこの記事はREST APIツールの使い方をご紹介いたします。

続きを読む

テクニカルサポートに寄せられる質問例(Monaca編)

mBaaSではExpertユーザ向けにテクニカルサポートを提供しています。日々多くの質問が寄せられていますが、実際に使っている方でないと、どういった質問をしていいのか分かりづらいかも知れません。

そこで実際にテクニカルサポートに寄せられる質問の中で、良く寄せられるものをピックアップして紹介します。今回はMonacaの話題です。

続きを読む

JavaScript SDKを拡張するNCMB Extendに一括更新メソッドを追加しました

JavaScript SDKはMonacaアプリやコンソールからNCMBを使うのに便利なライブラリですが、機能はごく基本的なものに限っており物足りなさを感じることがあります。

そこで非公式に作っているのがNCMB Extendです。データストアを拡張して便利なメソッドを追加しています。

updateAllメソッドの追加

今回は取得系ではなく更新系メソッドです。指定した条件にあうデータをまとめて更新します。mBaaSでは一括更新系メソッドは提供していませんので、実際には一件ずつ取得しつつ、同じ条件を適用していく流れになります。

使い方は以下のようになります。事前に指定した条件に従ってfetchAllし、取得したデータに対して同じ更新条件を適用します。便利な点としては関数を与えられることで、実際のデータに合わせて更新内容を変更できます。

例えば以下の例では1ずつ足して更新する例です。これはインクリメント的なものです。更新が重なると同じ数字に書き換わるのであくまでも「的」になります。ちゃんとしたインクリメントが必要な場合はsetIncrementを使ってください。

AA7
  .equalTo('Boolean', true)
  .updateAll({
    Integer: 5,
    Integer2: me => me.Integer2 += 1,
  })
  .then((ary) => {
    console.log(ary);
  });

結果として、更新されたデータが配列になって返ってきます。

インストール

NCMB Extendのインストールは npm コマンドでできます。

npm i ncmb-extend -S

後はJavaScript SDKを読み込んだ後でライブラリを読み込んでください。

const NCMB = require('ncmb');
require('ncmb-extend');

updateAllメソッドは汎用的なので、多くの場面で使えるのではないかと思います。ぜひお試しください。また、何か動作の不明点や問題、機能要望があれば下記リポジトリにお願いします。

NCMBMania/ncmb-extend

JavaScript SDKを拡張するNCMB Extendに一括削除メソッドを追加しました

JavaScript SDKはMonacaアプリやコンソールからNCMBを使うのに便利なライブラリですが、機能はごく基本的なものに限っており物足りなさを感じることがあります。

そこで非公式に作っているのがNCMB Extendです。データストアを拡張して便利なメソッドを追加しています。

続きを読む

JavaScript SDKのキッチンシンクアプリを作る【データストアTodoアプリ編】

キッチンシンクというのは、何かのフレームワークやライブラリがあった時に、その殆どの機能を体験できる仕組みになります。それがあることでフレームワークの全体像が分かったり、何か開発していて困った時に参考とできるコードになります。

元々MonacaとNCMBではアカウント連携機能があるのですが、NCMBからMonacaへ誘導した際にチュートリアルアプリを表示する機能は約1年ほど前になくなっています。チュートリアルアプリはデータの登録をしたり、写真を表示するアプリでした。つまりデータストアとファイルストアが体験できるというものです。アプリ自体はJavaScript SDKのver.1を使っていましたので、今となっては参考にはしづらいものでした。

この記事では旧チュートリアルアプリに変わるキッチンシンクアプリを作っていきたいと思います。ステップを踏んで紹介していきますので、実際に試す際の参考にしてください。今回は会員管理に続いてデータストアを使ったTodoアプリの作成です。

利用するフレームワーク

今回利用しているフレームワーク、ライブラリは次の通りです。

  • Onsen UI
  • Monaca CLI
  • NCMB
  • Bower

今回はOnsen UIをjQueryから使う形で進めています。ライブラリはBower経由でインストールしています。アプリのプレビュー表示を行うのに便利なのがMonaca CLIになります。インストールは Node.js をインストール後、 npm コマンドで行えます。

$ npm i monaca -g

ベースのコード

今回はNCMBMania/kitchensink-monaca: MonacaとJavaScript SDKを使ったキッチンシンクアプリです。にコードをアップロードしてあります。こちらを参考にしてください。ベースはOnsen UI V2 JS Navigationとなっています。

変更点について

まずTodoの画面を開いた時の処理です。すでに登録されているTodoを表示します。タスク追加する際にも表示処理を行うので別関数に分けています。

// 初期表示用
Todo
  .fetchAll()
  .then(function(todos) {
    for (let i = 0; i < todos.length; i++) {
      task_add(todos[i]);
    }
  });

// タスクを追加する処理
let task_add = (todo) => {
  $('#tasks').append(`
    <ons-list-item class="item">
      <div class="center">${todo.value}</div>
      <div class="right">
      <ons-icon icon="fa-trash-o" class="delete" data-id=${todo.objectId}>
      </ons-icon>
      </div>
    </ons-list-item>
  `);
};

タスクを追加する

タスクを追加する処理です。この時、ログイン済みであればACLを使って権限設定を行います。これによって自分だけが閲覧、削除できるTodoデータになります。

const Todo = ncmb.DataStore('Todo');

// タスクを追加するイベント
$(page).find('.add').on('click', function(e) {
  e.preventDefault();
  let todo = new Todo;
  
  // ログインしている場合は権限設定を行う
  let user = ncmb.User.getCurrentUser();
  if (user) {
    let acl = new ncmb.Acl();
    acl
      .setUserReadAccess(user, true)
      .setUserWriteAccess(user, true)
    todo.set('acl', acl);
  }
  
  // タスクを保存する
  todo
    .set('value', $('#todo').val())
    .save()
    .then(function(todo) {
      task_add(todo);
      $('#todo').val('');
    });
});

タスクを削除する

最後にタスクの削除です。これは削除するobjectIdをセットしてdeleteメソッドを呼ぶだけです。イベントは一覧の右側にあるゴミ箱アイコンに紐付けています。

$(page).on('click', '#tasks', function(e) {
  e.preventDefault();
  let todo = new Todo;
  todo
    .set('objectId', $(e.target).data('id'))
    .delete()
    .then(function() {
      $(e.target).parents('.item').remove();
    })
});

さいごに

これだけでTodoアプリができあがります。とても簡単なので、ぜひ試してみてください。

コードはNCMBMania/kitchensink-monaca: Monaca と JavaScript SDKを使ったキッチンシンクアプリです。にアップロードしてあります。Monacaアプリとして動かすこともできますのでぜひお試しください。