はじめに
業務でApache Cordovaを使う必要に迫られたので、とりあえずインストールして動くか確認したところまでの備忘録。
OSはWindows10。
Cordovaの公式サイトに従って進めていく。
Apache Cordovaとは
HTMLとJavaScriptというWebライクな言語でマルチプラットフォームアプリを作るよっていう技術。(そういうものをハイブリッドアプリというらしい)
多くの場合はiOSやAndroidといったモバイル向けアプリ作成に使われるが、Windowsや普通のWebアプリも作れる。
文系学部出身の筆者からしたらコルドバって後ウマイヤ朝の首都(Cordoba)かなって感じだけど、スペルが違った。
下準備
Node.jsというものが必要。
Node.js はスケーラブルなネットワークアプリケーションを構築するために設計された非同期型のイベント駆動の JavaScript 環境です。
(https://nodejs.org/ja/about/ より)
うーん。
とりあえずNode.jsの公式からLTS版をデフォルト設定のままインストール。
その他にもアプリを動かしたいプラットフォームによって必要なものがあるらしいので、そのあたりは各自で。
筆者の場合はWindowsで動かしたかったのでVisualStudioの環境を整える必要があったが、これがまた一苦労。(それはまた別のお話)
Cordovaのインストール
npm install -g cordova
作成されたファイルのツリーが出力されていればたぶん成功。
サンプルアプリケーション作成
公式チュートリアルだと、サンプルアプリはWebアプリとして作られる。(Cordovaを使う意味とは)
まずアプリを作りたいディレクトリに移動して
cordova create MyApp
途中で匿名のレポートを送信します的なことを聞かれるので、とりあえずY。
Creating a new cordova project.
とか出てきたら成功。
プロジェクトディレクトリの中に入りましょう。
cd MyApp
続いてプラットフォームの追加。
先述の通り、ブラウザ上で動くWebアプリを作成するので、
cordova platform add browser
ここまででWebアプリのサンプルが出来上がる。
実行してみてブラウザが立ち上がり、Apache Cordovaのロゴが表示されれれば完璧。
cordova run browser
(場合によっては自動でブラウザが立ち上がらないこともあるそうなので、その時はURL手打ちで)
確認が終わったらCtrl
+ C
でサーバを閉じる。
いじってみた
MyApp/www/index.html
の<body>
の中身を全部消して書き換えてみた。
<body>
<h1>Hello, World!</h1>
</body>
こうなった。
cssが効いている模様。

おわりに
序盤で言及した通り、Cordovaはハイブリッドアプリを作る技術なので、ブラウザで動くアプリを作ってもあまり意味がない。
動かしたいプラットフォームに合わせて環境を構築したり、プラグインを作成したりが醍醐味らしいが、そのあたりは追い追い。