SAPクラウド演習4. Chrome プラグイン、便利ツール

SAPUI5 のアプリ開発、デバックに便利なプラグインを2つ紹介します。

Google Chrome の Developer Tools は UI 開発者にとって便利なツールですが、それにプラスして SAPUI5 用のプラグインがあります。

Chrome Web Store で、SAPUI5で検索します。

Fiori Stars と UI5 Inspector の2つを Chrome に追加してください。

• Fiori Stars

どの UI5 コントロールを使っているかマウス・オーバーで調べられます。標準の Fiori アプリは700以上あるので、SAPの標準アプリからいろいろ学べます。

• UI5 Inspector

デバッグに便利なツールです

では、SAP Fiori, demo cloud edition で Fiori アプリを起動して、各ツールを使ってみましょう。

どのアプリでもいいですが、ここでの例は My Timesheet アプリを使います。

Chrome ブラウザの右上に FioriStars のアイコンがあります。

Explore モードにすると、マウスをコントロール上に置くと、どの SAPUI5 コントロールが使われているかがわかります。

さらに Shift キー + クリックで、そのコントロールの詳細ヘルプ、サンプルへジャンプします。

OData sniff を有効にしておくと、右上にコールされた OData サービスがわかります。

次は UI5 Inspector です。

Chrome ブラウザで右クリック、または Ctrl+shift+I で Developer Tools が立ち上がります。

UI5 用のタブが追加され、UI5 に絞った情報を見てデバッグできます。