Firefox OSの開発環境「WebIDE」(2)
WebIDEの起動
ここからはWebIDEを使って実際にアプリをつくっていきましょう。
はじめにWebIDEを起動します。まずFirefox上部メニューの一番右のメニューボタンから[開発ツール]をクリックします。開発ツールの一覧が表示されるので、そこから[WebIDE]をクリックします。WebIDEが別ウィンドウで起動します。
ざっくりと画面の説明をすると、画面上部中央の再生、ストップ、一時停止の各ボタンはそれぞれアプリの実行、停止、デバッグをエミュレータ、または、USBでPCに接続されたFirefox OS端末上で実行するボタンです。
画面上部左側の[アプリを開く]ボタンをクリックすると、新しいアプリの作成、既存アプリを開くメニューが表示されます。画面上部右側の[ランタイムを選択]をクリックすると、シミュレータやUSBで接続されたFirefox OS端末を管理するためのメニューが表示されます。
画面構成からみてとれる機能はとてもシンプルで、ファイルの作成と編集、アプリのデバッグが主な機能です。IDEというと、Android Studioのような多くの機能を備えた重量級の開発環境を想像しがちですが、WebIDEはアプリケーションの開発に必要最低限な機能のみで覚えることが少ないので、はじめてでも操作をすぐ習得できると思います。
シミュレータをインストールする
ではWebIDEを使って、さっそくアプリの作成をしたいところですが、その前に作成中のアプリを試しに起動したり、デバッグしたりするために必要なFirefox OSシミュレータをインストールしましょう。
WebIDEが発表される前まではFirefox OSのシミュレータは、Firefoxブラウザのアドオンとして提供されていて、別途アドオンをダウンロードしてインストールする必要がありました(※2)。WebIDEでは、これをボタンクリック一発で簡単に行えるようになっています。
※2 WebIDE提供以前は、アドオンは下記URLからダウンロードしていました。
まず、画面上部右側の[ランタイムを選択]ボタンをクリックして、出てきたメニューの中央付近にある[シミュレータをインストール]をクリックしてください。すると、メイン画面にインストールできるシミュレータの一覧が表示されます。
今回は、現時点で最新の安定版であるバージョン2.0のシミュレータをインストールしてみましょう。「Firefox OS 2.0 シミュレータ(安定) 未インストール」と表記されている右側の[インストール]ボタンをクリックしてください。シミュレータのダウンロードとインストールが実行されます。
しばらくして「インストール済み」と表示されるとインストールは完了です。
WebIDEでは、複数のバージョンのシミュレータが管理でき、簡単に異なるOSバージョンのシミュレータを切り替えながらアプリを作成できます。
シミュレータをインストールした後のアンインストールや、他のシミュレータの追加などは、この画面から行います。