ionic、モバイルアプリとWebアプリ(おさらいも含めて）
当初の考えでは、モバイルアプリとして公開しようと考えていたゲームブックアプリです。
何しろ作ったことが無いので、ワクワクしたというのもありますしHTMLとJavascriptの組み合わせより、なんとなく高度なモノになるような気がしていたことも大きいです。
(ionicを利用する時点でほぼ同一のものなのですが)
そんな理由で始めたionicの経験も5か月、大分考え方も変わってきました。
まずionicについておさらいです。
ionicはそれが提供する(いくつかの種類の)ひな型を元に、HTML＋Javascript+CSSでWebアプリを作ります。
Angularと言う技術が内部で様々なサポートをしてくれるので、例えばWeb画面上とJavascriptの間のデータのやり取りなど、煩雑で必須ですがアプリの本質にかかわらない部分のコーディングが楽になります。
(Angular以外の技術をベースにすることも可能なようですが経験が無いので語れません)
また直接javasciptで記述するのではなく、TypeScriptと言う言語で書き、これをjavascriptに変換しているのですが、そのおかげでJavascriptの許容するあいまいさによる予期せぬバグを避けることが出来たと思います。
最初は取っつきづらいと感じていましたが、ある程度慣れた今は、むしろ好ましい開発環境に思えます。
(半分くらいはVisualStudioCodeの入力補助機能のおかげもあります)
そしてionicの売りの一つ、AndroidアプリやiOSアプリ用ソースコードへの変換も、このTypeScriptを元にビルドしたjavascriptの品質の高さによるものと理解しています。
その分、ニンゲンが読むようなコードにはなっていませんが。
大量に作られるjavascriptのコードのごく一部を下記にご紹介します。
---------------------------------------------------------------
"use strict";var A=Math.pow;(self.webpackChunkapp=self.webpackChunkapp||[]).push([[2698],{2698:(bs,ae,le)=>{function oe(e){return null!==e&&"object"==typeof e&&"constructor"in e&&e.constructor===Object}function Q(e,t){void 0===e&&(e={}),void 0===t&&(t={}),Object.keys(t).forEach(function(s){void 0===e[s]?e[s]=t[s]:oe(t[s])&&oe(e[s])&&Object.keys(t[s]).length>0&&Q(e[s],t[s])})}le.r(ae),le.d(ae,{Swiper:()=>X});var T="undefined"!=typeof document?document:{},de={body:{},addEventListener:function(){},removeEventListener:function(){},activeElement:{blur:function(){},nodeName:""},querySelector:function(){return null},querySelectorAll:function(){return[]},
---------------------------------------------------------------
さてionicの開発の流れは以下のようになります。
ionicでコーディング
↓
Webアプリ
↓
モバイルアプリ(AndroidアプリやiOSアプリ)
という流れです。
このモバイルアプリなんですが、ご存知のように入手先はOSごとのほぼ独占状態です。
GooglePlayしか知りませんがセキュリティ上や社会的要請からのアプリへの対応要求が(タイミングが悪かったのかもしれませんが)かなりあって、正直、面倒に思えています。
それでも、一つのモバイルアプリがOSを問わずに使えます！という事だったら、また違うと思いますがionicで作るのであれば、Webアプリをサーバにあげた方が気楽に思えます。
(あと地味にビルドのための時間やハードディスクの圧迫も無視できません)
実際、内容的には表示ブラウザによる違い等はあっても見た目が大きく違うという事はありません。
以下、Androidアプリとほぼ同一ソースの対応するWebアプリの例です。
(数独の簡単バージョン的アプリ。AppStore版はありません)
GooglePlayのアプリ
https://play.google.com/store/apps/details?id=aticltd.one.four.all
Webアプリ
http://ajax-python.sakura.ne.jp/four_ten/
スマートフォンの画面サイズを前提にしたので、見栄え的な問題もありますが対応できる範囲と考えて良いと思いますし、また、上の開発の流れを見てわかるように(ionicで開発する場合)モバイルアプリに出来てWebアプリに出来ない事はありません。
(逆は、例えば、javascriptのクリップボードAPIがセキュリティ上の理由でAndroidアプリで使用不可です)
もちろんモバイルアプリならではのメリットもあるはずですが、ゲームブックアプリの場合、その恩恵にあずかるのは難しいかも？
アップできるサーバがあるならば、Webアプリ留めも有りかなと思い始めています。
オマケ
現在、開発中のゲームブックアプリのテスト版です。WebアプリですのでOS関係なしに見れるはず。
GameBook!
http://ajax-python.sakura.ne.jp/gamebookmaker/
※
上記のサイトを開くと、アドレスの末尾に"home"という文字がつきますが、この名のサブディレクトリは存在しないので、もしブックマークをする場合は上のアドレスをご使用ください。
(どうやっているのか、まだ分かってない部分の一つです。)
