ニフクラ mobile backendとPWAでアプリ作ってみた

2018年2月28日水曜日

未分類

t f B! P L
どうもこんにちは、ykyuki.net管理人です。

久しぶりの投稿です。今回は「ニフクラ mobile backendとPWAでアプリ作ってみた」という話をしたいと思います。

なぜ作ってみようと思ったか



  1. へぇ、ニフクラ mobile backendっていうのがあるんだな~

  2. なるほど!なんかいろいろ便利そうだ

  3. でも、これでブログ書いてもな~既にありそうだし

  4. (ググり中) PWAっていう物があるんだな

  5. なになに、ウェブページをそのまま(いくつかファイルを追加すれば)アプリにできる!

  6. えっ、これニフクラ mobile backendと組み合わせたら...(゚∀゚)キタコレ!!ってなるんじゃね


と思ったので作ってみることにしました。

PWAとは


いまさら聞けないPWAとAMP

によると
モバイルユーザーのUX向上を目的とした、WEBページ/WEBアプリケーションとネイティブアプリの利点をいいとこ取りできる仕組み。

だそうです。Webページをそのままアプリにすることもできますし、プッシュ通知を送ったりすることもできるみたい(?)です。

※PWAはHTTPSサイトでないと提供できないそうです。

※ちなみにPWAはブログを書いている時点(2018/2/27)ではSafari非対応です。

作ったもの


https://ykyuki.net/zikken/PWA-sample/

androidの方はブラウザーのメニューの「ホーム画面に追加」からPWAアプリとしてインストールできます。

ソースコード


ykyuki/PWA-sample: ニフクラ mobile backendとPWAのテスト

一応、GitHubで公開してあります。

おわりに


PWA化するのはとても簡単でした。

ですので、アプリの開発のほうにガンガン取り組めました。

Safariが対応すれば対応サイトも増えると思うので楽しみですね。

アプリを作るときに参考にしたサイト


http://mb.cloud.nifty.com/doc/current/

http://mb.cloud.nifty.com/doc/current/tutorial/monaca_breakout.html

QooQ