Skip to Content
Previous

SAPUI5 とは?

 

SAPUI5 は、エンタープライズ対応の Web アプリを構築するために必要なすべてを備えた UI テクノロジーです。これには主な SAP プラットフォームがすべて付属していますが、SAPUI5 の大部分は OpenUI5 でオープンソース化されているので SAP エコシステム外でも使用できます。

SAPUI5 / OpenUI5 を理解し、最高級の Web アプリを構築する方法を習得してください。

Next

SAPUI5 について学ぶ

SAPUI5 は、以下の原則に基づいて構築されています。

ビジネス用途向け Web ツールキット

SAPUI5 には、最新のアプリケーション要件を満たすために必要なすべての機能が、標準 SAP ソリューションで配布するのに十分な高い基準で搭載されています。

パワフルな開発コンセプト

SAPUI5 の中核機能は、最新の開発管理のさまざまな側面を舞台裏から支え、開発をシンプル化する確固とした基盤を提供します。これには、MVC などのアーキテクチャーの概念、メッセージ処理、データバインド、ルーティングなどのサポートが組み込まれています。

機能豊富な UI コントロール

SAPUI5 には、基本要素から複雑な UI パターンまで 400 を超える UI コントロールが付属しています。それらは、そのまますぐに使用することも、要件を満たすように拡張して微調整することもできます。

一貫性のあるユーザーエクスペリエンス

SAPUI5 アプリケーションには、すべてのフロントエンド機能で一貫性のある設計言語と事前定義済み UX パターンを使用できるというメリットがあります。事前定義済みのテーマまたは UI テーマデザイナーを使用して、独自のテーマを作成できます。

適応性の高い UI

個々のデバイスの仕様を心配する必要はありません。SAPUI5 アプリケーションはスマートフォン、タブレット、デスクトップ上で動作します。UI コントロールは、自動的に各デバイスの能力に適応し、それらの大部分を利用可能にします。

使いやすい


JavaScript と一般的な Web 標準に精通していますか?それなら、SAPUI5 を使い始めるのはとても簡単です。すぐに使えるアプリテンプレートを、アプリ開発の出発点としてご利用ください。これらのテンプレートには、一般的なアプリの機能と、必要に応じて簡単にカスタム機能で拡張できるテストが含まれています。

Previous
ブログ
質疑応答

SAPUI5 コミュニティでの質問

疑問の答えを探し、質問を投稿し、ナレッジを共有しましょう。
Next
image
ご質問やご不明点に関するお問い合わせ
Previous
 

SAPUI5:新機能と開発者にとってのメリット

 

YouTube での SAPUI5 プレイリスト

 

YouTube の OpenUI5 チャンネル

 

UI5con 2016 フランクフルトのプレイリスト

Next

内部の仕組み

Previous

SAPUI5 は、JavaScript、CSS、HTML5 に基づいたクライアント UI テクノロジーです。

SAPUI5 で開発されたアプリは、すべてのデバイス(モバイル、タブレット、またはデスクトップ PC)上のブラウザーで動作します。

ユーザーが SAPUI5 アプリにアクセスすると、要求が各サーバーに送信され、ブラウザーにアプリがロードされます。ビューは、関連ライブラリにアクセスします。通常、モデルはインスタンス化され、ビジネスデータはデータベースからフェッチされます。

SAPUI5 のご使用環境に応じて、ライブラリまたはアプリケーションを SAP NetWeaver アプリケーションサーバーまたは SAP Cloud Platform などに保存できます。ビジネスデータには、SAP Gateway を介して OData モデルを使用するなどしてアクセスできます。

Next

サマリーマトリクス

特長 詳細
アクセシビリティ
SAPUI5 コントロールにおいては、スクリーンリーダーサポート、ハイコントラストテーマ、キーボード処理
といったさまざまな製品標準への準拠をさらに強化するよう努めています。
アプリケーションキャッシュバスター

アプリケーションキャッシュバスター(AppCacheBuster)は、キャッシュバスターとほぼ同じですが、アプリケーションリソース用に使用されます。

SAPUI5 は、SAP NetWeaver AS for ABAP 上のアプリケーションキャッシュバスターのみサポートします。

アプリテンプレート
アプリテンプレートには、SAP の最新の推奨事項が組み込まれており、SAP Fiori デザインガイドラインに従ってアプリを開発する際の開始点として使用できます。これらのテンプレートには、一般的なアプリの機能と、必要に応じて簡単にカスタム機能で拡張できるテストが含まれています。
キャッシュバスター

キャッシュバスターは、SAPUI5 リソースが変更された場合のみリソースを更新するようにブラウザーに通知します。SAPUI5 リソースが変更されない限り、リソースは常にブラウザーのキャッシュからフェッチされます。

SAPUI5 は、Java サーバー、ABAP サーバー、SAP Cloud Platform 用のキャッシュバスターコンセプトをサポートしています。SAP HANA XS はキャッシュバスターコンセプトをサポートしません。

コンポーネント
コンポーネントは、SAPUI5 アプリケーションで使用される、独立した再生可能なパーツです。
コントロール

コントロールは、画面領域の外観と動作を定義するために使用します。

SAPUI5 には、基本要素から複雑な UI パターンまで 200 を超える UI コントロールが付属しています。

バインディング
タイプ

SAPUI5 は、プロパティバインディング、集計バインディング、エレメントバインディングの 3 つのバインディングタイプをサポートしています。
データバインディング

データバインディングは、2 つのデータソースまたは情報ソースをバインドして同期するために使用します。片方のデータソースが変更されると、もう一方のデータソースにもその変更が反映されます。

SAPUI5 は OData、JSON、XML、およびその他のデータ形式とのバインディングをサポートしています。

記述子
記述子は、W3C が提唱している Web アプリケーショマニフェストコンセプトによって導入されたもので、アプリケーション、アプリケーションコンポーネント、またはライブラリに関連付けられたメタデータを格納する、マシンリーダブルで、一元化されたアクセスしやすい場所を提供します。
デバイス対応
SAPUI5 は、オペレーティングシステムとデバイスに対応するための複数の機能をサポートしています。
拡張性
SAPUI5 アプリは、特定の要件を満たすように拡張することができます。 たとえば、ビューの拡張または
置換、コントローラーの拡張または置換、言語固有テキストの変更などが可能です。
フラグメント
フラグメントとは、再利用され、ビューと同じように定義できる軽量 UI パーツ(UI サブツリー)ですが、
コントローラーやその他の動作コードを組み込むことはできません。 SAPUI5 は XML、HTML、および JS のフラグメントを提供しています。
柔軟性
SAPUI5 では、UI とサーバーメッセージを一元的に管理します。
メッセージ管理
SAP Web IDE は、認証とさまざまなシステムや他のコンポーネントへの安全な接続については SAP Cloud Platform のインフラに依存。SAP Web IDE は、オンプレミスシステム上への安全な接続のために、顧客定義のアイデンティティプロバイダ(IdP)など任意の IdP を使用するか、SAP HANA Cloud コネクターを使用可能。
モックサーバー
モックサーバーは、モックサービスとモックデータを提供します。サービスメタデータに基づいて
ランダムに生成されるデータと、JSON ファイルで提供されるモックデータをサポートします。
モデル

SAPUI5 のモデルは、データを格納します。さらに、データベースからデータを取得し、データを設定および更新するためのメソッドを提供します。

SAPUI5 では、事前定義済みモデルとして、OData、JSON、XML、およびリソースモデルが用意されています。フレームワークでまだ対応していないデータソースやドメイン固有のデータソースに対して、カスタムモデルを作成して実装することもできます。

 
モデルビュー
コントローラー
SAPUI5 では、情報の表示とユーザー対話を分離するために、モデルビューコントローラー(MVC)コンセプトが採用されています。   
モジュール化と依存性の
管理
SAPUI5 フレームワークは、JavaScript アプリケーション全体に対するモジュール化をサポートしています。   
ナビゲーション SAPUI5 では、ハッシュベースのナビゲーションがサポートされ、ハッシュを変更することによりナビゲーションが実行される、シングルページアプリを構築できます。
 
パフォーマンス測定 SAPUI5 には、アプリのパフォーマンスを測定できるツールが含まれています。  
リソース処理 SAPUI5 のリソース処理は、クライアントサイドとサーバーサイドに分かれて行われます。 この 2 つのパートは補完的ですが、互いへの依存はありません。  
RTL のサポート SAPUI5 は右横書き(RTL)をサポートしています。この機能を有効にすると、ページ全体の方向が
RTL に設定され、すべての SAPUI5 コンテンツが RTL モードで表示されます。独自に作成したコントロールとコンテンツは別々にテストする必要があります。
 
ルーティングパターン
SAPUI5 がサポートしているパターンのタイプは、ハードコードパターン、必須パラメーター付きルート、オプションパラメーター付きルート、クエリーパラメーター付きルート、「rest as string」パラメーターです。  
サポートツール SAPUI5 には、トラブルシューティングや問題解決のためのさまざまなサポートツールがあります。   
テンプレート

SAPUI5 は HTML テンプレートと XML テンプレートをサポートしています。

SAPUI5 の HTML テンプレートコンセプトでは、モデル内のプロパティとテキストをバインドできます。 モデル内のプロパティが変更されると、それに合わせてテキストが更新されます。

XML テンプレートコンセプトでは、XML ビューをテンプレートとして使用できます。このテンプレートは、実行時、SAPUI5 コントールツリーが XML ソースから作成される直前に、ソースレベルの
XML プロセッサー XML DOM によって変換されます。

 
テスト SAPUI5 には、ユニットテスト、統合テスト、モックサーバーなどいくつかのテストオプションがあります。  
テキストのローカライズ SAPUI5 のテキストローカライズのためのフレームワーク概念は、Java プラットフォームの一般的な概念と整合しています。
 
テーマ設定 SAPUI5 は、さまざまな視覚的デザインの作成と使用をサポートしています。これらは、テーマと呼ばれ、二者択一的に使用でき、簡単に切り替えることが可能なため、ユーザーのデザインの好みやアクセシビリティ要件に応じて、同じアプリケーションに非常に異なる外観を持たせることが可能になります。  
UI の適応 柔軟性を参照してください。  
ビュー SAPUI5 のビューは、UI の定義とレンダリングを行います。SAPUI5 によってサポートされる定義済みのビュータイプは XML、JSON、JS、および HTML です。  

今すぐ試す

SAP Cloud Platform 上の SAPUI5

無料の SAP Cloud Platform, developer edition に登録し、SAPUI5 の推奨開発環境である SAP Web IDE の試用インスタンスを入手してください。最初の SAPUI5 アプリを構築し、SAP グローバルクラウドネットワーク上でそのプラットフォームをテストできます。

開発者が使用する場合のみ、完全に無料です。

コンテンツデリバリネットワーク(CDN)からの SAPUI5

分散サーバーのネットワークにより、ユーザーに最も近い場所から自動的に SAPUI5 が提供されます。これにより、以下を参照するだけでアプリに SAPUI5 がロードされます。

参照可能なオンラインバージョンについては、このリストをご覧ください。
動作方法の詳細は、CDN を使用した簡単な例をご確認ください。

オープンソースバージョンの OpenUI5

SAPUI5 のオープンソースバージョンである OpenUI5 を入手しましょう。これは、GitHubで Apache 2.0 ライセンスの下で無料で利用できます。

最新の安定した OpenUI5 ランタイム、すべてのドキュメントを含む OpenUI5 SDK をダウンロードするか、ダウンロードページで他のオプションをお選びください。

OpenUI5 の改善をご支援ください
  • バグを見つけたら、ぜひ SAP にご報告ください。
  • バグ修正や新しい機能の開発にぜひともご協力ください。

OpenUI5 への貢献に関するすべての情報は、こちらをお読みください。

Back to top