Cordovaのチュートリアルをやってみる 第一回

使用したもの(環境)

1. cordova
2. visualStudioCode
3. windows10
4. Android

---

チュートリアルを訳しながらやってみる

チュートリアルのページは下記。

Apache Cordova Tutorial

環境構築については別途まとめてあるので下記参照。

cordova&VSCodeで環境を構築するまでの右往左往メモ。

---

Module 1: Creating a Cordova Project

1～3までは環境構築で済んでいるので飛ばす。

1. Cordova CLIを使用して、Workshopと名付けたCordova projectをworkshopディレクトリの中に作ります。
   カレントディレクトリ内に作成されるので、cdコマンドなどで階層を移動しておくこと。
   また、yournameのところは好きに変えて良いです。

cordova create workshop com.yourname.workshop Workshop

正常終了していれば
Creating a new cordova project.
と表示されます。

1. 作成したプロジェクトのディレクトリに移動します。

cd workshop

1. iOSプラットフォームをサポート対象に加えます。(オプション)
2. Androidプラットフォームをサポート対象に加えます。(オプション)

cordova platforms add android

本記事ではAndroidだけ追加します。
念のため下記コマンドを実施してAndroidがnstalled platformsに含まれていることを確認しましょう。

cordova platforms ls

実行結果は下記のように出るはずです。

Installed platforms:
  android 7.0.0
Available platforms:
  browser ~5.0.1
  ios ~4.5.4
  osx ~4.0.1
  windows ~5.0.0
  www ^3.12.0

1. 基本的なプラグインの追加を行います。
   チュートリアルにあるコマンドは古いようです。(下記を参照しました)
   Error when adding cordova plugin

実際に実行したコマンドは下記になります。

cordova plugin add cordova-plugin-device
cordova plugin add cordova-plugin-console

1. 生成されたものを確認しましょう！
   下記はgoogle先生の翻訳そのまま。

• wwwフォルダは、HTML / JavaScriptアプリケーションをコーディングする場所です。 ブラウザでindex.htmlファイルを開き、Cordova CLIで作成されたデフォルトアプリケーションを表示します。
• プラットフォームフォルダは、Cordovaがさまざまなプラットフォーム（iOS、Androidなど）用にアプリケーションをビルドする場所です。 このフォルダの内容は、Cordova CLIによって自動的に生成されます。そのディレクトリ内のコードは決して編集しないでください。
• プラグインはpluginsディレクトリにインストールされます。
  アプリケーションパラメータ（名前、作成者など）はconfig.xmlに格納されます。

Androidを接続し、デバッグから実行。DEVICE IS READYと表示されることを確認。

参考URL

Apache Cordova Tutorial

cordova&VSCodeで環境を構築するまでの右往左往メモ。

Error when adding cordova plugin