概要
Monaca クラウド IDE は、ブラウザベースの開発環境です。 Web ブラウザから、アプリ開発を行うことができます。
このページでは、Monaca クラウド IDE の Graphic User Inteface (GUI) について説明します。
バー上のメニューを解説します。
メニューアイテム | 説明 |
新規ファイル | 新しいファイルを作成します。 |
保存 | 現在開いているファイルを保存します。 |
すべて保存 | 現在開いている、すべてのファイルを保存します。 |
アップロード | 選択されているフォルダーにファイルをアップロードします。 |
メニューアイテム | 説明 |
元に戻す | 編集前の状態に戻します。 |
やり直す | 取り消した編集をやり直します。 |
検索 | 現在開かれているファイルから対象の文字列を検索します。 |
置換 | 現在開かされているファイル上で、 指定した文字列を、他の文字列に置き換えします。 |
プロジェクト内検索 | すべてのプロジェクトファイルを検索します。 |
コメントの切り替え | 選択された行のコメントを切り替えます。 |
メニューアイテム | 説明 |
デバッガー タブ | デバッガー タブの表示を切り替えます。 |
レイアウトをリセット | IDE のレイアウトをデフォルトにリセットします。 |
メニューアイテム | 説明 |
プレビュータブを表示 | プレビュータブを表示します。 |
実機で実行 | Monaca デバッガーでプロジェクトを実行します。 |
デバッガーの説明とインストール | 端末に Monaca デバッガーをインストールします。 |
メニューアイテム | 説明 |
Android アプリのビルド | Android 端末用のアプリをビルドします。 |
iOS アプリのビルド | iOS 端末用のアプリをビルドします。 |
Windows アプリのビルド | Windows 端末用のアプリをビルドします。 |
ビルド結果一覧 | ビルドの結果一覧を表示します。 |
継続的インテグレーション結果一覧 | 継続的インテグレーションの結果一覧を表示します。 |
メニューアイテム | 説明 |
コミット | Monaca クラウド IDE 上で行った変更をコミットします ( ローカルコミットと呼ばれています )。 |
プッシュ | Monaca クラウド IDE 上で行った変更をリモートサーバー ( リモートレポジトリ ) 側へプッシュします。 |
プル | リモートサーバー ( リモートレポジトリ ) 側から最新情報をプルします。 |
リモートのコミット履歴 | リモートサーバー ( リモートレポジトリ ) 側のコミット履歴を表示します。 |
バージョン管理設定 | リモ ートレポジトリを設定します。 |
プロジェクトに Monaca ユーザーを参加させることができます。 | |
エクスポート | Monaca プロジェクトをエクスポートします。 |
公開 |
メニューアイテム | 説明 |
Android アプリ設定 | |
Android キーストア設定 | |
iOS アプリ設定 | |
iOS ビルド設定 | |
Windows アプリ設定 | |
Cordova プラグインの管理 | |
JS/CSS コンポーネントの追加と削除 | |
外部サービス連携 | |
継続的インテグレーション | |
デプロイサービス | |
ワークスペース設定 | コードエディターの環境設定を行います。 |
この機能を使用すると、オンライン上でプロジェクトを公開できます。プロジェクトの公開時に、プロジェクトへのアクセス用リンクが発行されるので、これを他のユーザーに対して公開・配布します。このリンクへアクセスすると、それぞれの Monaca アカウントにプロジェクトのコピーが作成されます。コピーしたプロジェクトは自由に編集できます。編集しても、オリジナルのプロジェクトへは反映されません。オリジナルとコピーのプロジェクト間での同期が行われないことが、従来の [ 共有設定・プロジェクトの共有 ] 機能とは異なる点です。
プロジェクトの公開は、次のようにして簡単に行うことができます。
1. Monaca クラウド IDE から、
プロジェクト → 公開 を選択します。2.
公開 ボタンをクリックします。
3. 他の Monaca ユーザーに対して生成されたリンクを公開・配布します。
公開を停止する場合には、プロジェクトの公開時に表示されたダイアログ上で、
プライベートにするボタンをクリックします。この機能を使用すると、公開された Monaca プロジェクトを自分のアカウントに直接インポートすることができます。公開時に生成されたリンク先へアクセスすると、次のページが表示されます。［ インポート ］ ボタンをクリックすると、現在ログインしているアカウントにプロジェクトがインポートされます。
Monaca デバッガーと Monaca クラウド IDE の接続後、このパネル上で、Console でのデバッグと DOM の解析を行えます。詳細は、Monaca クラウド IDE と Monaca デバッガーとの連携 ( Web 経由 ) をご確認ください。
プレビューログ タブは、プレビューでコンテンツを提供するための HTTP サービスを実行するためのターミナルウィンドウです。
プレビュー機能を使用すれば、リアルタイムで、アプリのレイアウトを確認できます。また、実際の端末にインストールされているアプリのように操作もできるため、制限付きではありますが、動作確認も行えます ( カメラの使用、住所録の取得、クロスオリジンの Ajax リクエストなど、一部の機能は使用できません )。Monaca デバッガーと併用すれば、より効率的に、より洗練されたアプリの開発を行えます。
プ レビュー タブでは、次の処理を行えます。
- プレビューの更新
- 端末のオリエンテーションの変更および使用する機種の選択。
Configureの アイコン ( 歯車のアイコン ) をクリックすると、適用可能なオリエンテーションと使用可能な機種が、ドロップダウンリスト形式で表示されます。使用可能な機種には、iPad、iPhone、Nexus があります。 - プレビューの切り離し・組み込み
プレビュー機能には、次の制限があります。
- Cordova プラグインの API は、利用できません。
- 同一生成元ポリシー ( Same Origin Policy ) による制限があるため、Ajax リクエストは行えません。ただし、サーバーからのレスポンスに、
Access-Control-Allow-Originヘッダーを追加した場合は、この限りではなく、クロスドメインの Ajax リクエストが行えます。 - 実際の端末とは、ビューポートの外観が異なることがあります。
- Monaca バックエンド API とプッシュ通知機能は、利用できません。
共有設定 では、次のことができます。
- チームメンバーの管理。共有プロジェクトへメンバーを招待できます。また、共有プロジェクトからメンバーを削除できます。
- ソースコードの共有。参加メンバーには、権限として、「 開発者 」を割り当てる必要がありま す。次に、プロジェクトの協同開発方法をいくつかご提案します。
- 1.1 つ目の協同開発方法として、Monaca クラウド IDE に実装されている「 共有 」機能を使用します。この機能を使用すれば、複数の開発者が、IDE上で、同じプロジェクトを編集できます。なお、プロジェクトの更新時に、以前の内容と競合 ( conflict ) する場合には、最新の内容に上書きされます。
- 2.2つ目の協同開発方法として、Monaca Localkit または Monaca CLI を使用して、ローカルで開発を行い、バージョン管理システム上で、共有を行います。バージョン管理システムなどの知識が必要になりますが、協同開発の方法としては、導入しやすいかと思います。
- プロジェクトを協同で検証。参加メンバーには、権限として、「 テスター 」 を割り当てる必要があります。
プロジェクトは、他の Monaca ユーザーと共有することができます。他の Monaca ユーザーを、プロジェクトに招待したり、プロジェクトから除外することもできます。プロジェクトの参加メンバーの管理方法は、次のとおりです。
1. Monaca クラウドIDE の
プロジェクト → 共有 を選択します。
2. [ チームメンバー管理 ] ページが表示されます。ここから、参加メンバーを招待 ( 案内メールの送信 ) します。入力できるメールアドレスは、1 行あたり 1 つです。また、ドロップダウンメニューから参加メンバーに割り当てる権限 ( 開発者またはテスター ) を選択できます。入力後、 ユーザーを追加する ボタンをクリックして、メンバーを追加します ( 通知メールを送信する場合には、[ 通知メールを送信する ] にチェックを入れます )。
3. プロジェクトからメンバーを除外するには、
× のアイコンをクリックし OKボタンをクリックします。
- 言語サーバーを使用して拡張できる自動補完システム。Monaca が提供する言語には、HTML、JavaScript、TypeScript、Onsen UI があります。React や Vue も対応予定です。
- 基本的な構文の色付け。
- 高機能なインテリセンスと検証。
現在のエディタで検索する場合は、
cmd+f または Ctrl+fを押します。 次にダイアログが表示されます。
最終更新 1yr ago