June 8, 2015

SAPクラウド演習2. バックエンドとフロントエンド並行開発

演習の目的

UXデザイン・シンキングでアプリ画面のプロトタイプができたら、次はバックエンドとフロントエンドの並行開発です。この演習2では、バックエンドのサービスがまだ完成していない段階で、データモデル定義を使ってアプリ開発し、モックデータを使ってテストします。開発、テストのスムーズな点を体験します。

早い段階でお客様にプロトタイプを見せたり、プリセールスデモでは、モックデータを使って意味あるデータをセットしてデモを実施できます。

1. EDMX (Entity Data Model) からMaster-Detail のFioriテンプレートを使ってアプリを生成

2. SAP Web IDE プリビューでテスト実行

3. ランダムなモックデータ、準備したモックデータでテスト

1. 新規プロジェクトを作り、EDMXファイルを指定

SAP Fiori アプリはバックエンドのデータをOData サービスを介して動くデザインです。まだバックエンドのODataサービスができていない段階でも、データ定義のEDMX ファイルを使ってアプリの開発をスタートできます。

演習1でブックマークしておいたSAP Web IDE を起動
Homeから New Project from Templateを選択

テンプレート一覧からSAP Fiori Master Detail Application を選択し、Next.

プロジェクト名を入力、例えば MyFirstFioriApp を入力して Next.
EDMX をデータ・ソースに指定

デザイン・シンキング、画面のモックアップができた段階で、データモデルを定義します。そのEntity Data Model file (EDMX) を使って、フロントエンドとバックエンドの並行開発を行います。

openSAP のページからデータモデル定義ファイルをダウンロードします。https://open.sap.com/files/6b0ebe1a-3181-4b20-bb08-3e7ef8c357f7
ZIP なのでファイルを展開してローカル保存しておきます。

New Projectウィザードのステップ3. Data Connection でFile System ソースを選択し“schema_file_salesorder.edmx” を読み込みます。Next で次へ。

ステップ4の Template Customization でテンプレートとデータ項目のマッピングを行います。

Nextで次へ
Finishでプログラムコードが生成されます。
EDMX 定義を元にアプリが生成されました。

2. モックデータを使ってアプリをテスト

バックエンドのOData サービスがまだ完成していないので、アプリをテストすることができません。SAP Web IDE には便利な機能、モックデータでアプリをテストするオプションがあります。SAP Web IDEがランダムにデータを生成して、ランダムデータでテストできます。また、JSON ファイルからテストデータを読み込む事もできます。開発者にとってはうれしい機能です。

まずは、ランダムデータでアプリのテストをしてみましょう。