Show Menu
TOPICS×

コアコンポーネントの開発

概要

コアコンポーネントは堅牢で拡張可能なベースコンポーネントを提供し、次のような特長があります。
コアコンポーネントでは AEM 6.3 以降と Java 8 が必要です。また、 編集可能テンプレート を使用する必要があります。
コアコンポーネントは、クラシック UI でも静的テンプレートでも動作しません。

Gems セッションの概要

コアコンポーネントとその機能、AEM での活用方法の概要については、AEM Gems セッションの AEM コアコンポーネント
Gems on Adobe Experience Manager は、アドビのエキスパートによる技術的な詳細の解説シリーズです。製品ドキュメントやその他のあらゆる技術的なチャネルを補完するこのシリーズを利用すれば、開発者は特定のトピックにふれ、深く理解することができます。

WKND 開発者向けチュートリアル

コアコンポーネントで AEM Sites の開発を始めるには、 この詳しいチュートリアル に従います。

AEM プロジェクトアーキタイプ

AEM プロジェクトアーキタイプ は、最小限の Adobe Experience Manager プロジェクトを独自のプロジェクトの起点として作成します。これには、推奨のプロキシパターンを使用してコアコンポーネントのロジックと適切な実装をおこなうために、SlingModels を使用したカスタム HTL コンポーネントの helloworld の例が含まれます。

GitHub 経由で配信

コアコンポーネントは GitHub で開発され、GitHub を通じて配信されます。
GitHub のコード
このページのコードは GitHub にあります
プロジェクトでコアコンポーネントの使用を開始する方法については、 コアコンポーネントの使用 を参照してください。
コアコンポーネントが GitHub にあることで、頻繁な更新を行えるほか、AEM 開発者コミュニティからのフィードバックを参考にすることができます。また、顧客やパートナーがカスタムコンポーネントを作成する際に類似のパターンに従うことができるようになります。
コアコンポーネントに常に最新の変更を反映させるには、GitHub 上の コアコンポーネントリポジトリ を監視してください。

コンポーネントライブラリ

コンポーネントライブラリ を参照してください。ここでは、コアコンポーネントの現在のリリースを紹介し、使用例を示しています。

サンプルコンテンツ実行モード

サンプルコンテンツが存在する場合は、コアコンポーネントがクイックスタートに表示されます。 We.Retail リファレンスサイト でコアコンポーネントが使用されるからです。ただし、実稼働環境で(サンプルコンテンツが有効でない
nosamplecontent
実行モードで)実行する場合は、コアコンポーネントは存在しなくなり、開発チームや運用チームの手で AEM インスタンスにインストールする必要があります。
実稼働環境では、クイックスタートを必ず
nosamplecontent
実行モードで実行してください。
nosamplecontent
実行モードでコアコンポーネントを使用するには、 コアコンポーネントの使用 の説明に従ってください。

技術的機能

コアコンポーネントと基盤コンポーネントの違いを次の表に大まかに示します。
オーサリング機能とそれらの機能を事前に設定するためのオプションについて詳しくは、 コアコンポーネントを使用したオーサリング を参照してください。
機能
コアコンポーネント
基盤コンポーネント
ロジックの実装
Sling モデル 注釈の付いた Java POJO
JSP コード
マークアップ定義
JSP コード
XSS サニタイズ
HTL で自動化
ほぼ手動
CSS クラスの命名
ブロック要素修飾子 (BEM)表記(リリース 2.0.0 時点)に基づく、標準化された命名規則
カスタムスキーム
ダイアログの定義
Coral 2 + クラシック UI
JSON 出力
デフォルト Sling サーブレット
バージョン管理
なし
テスト
単体テスト + 統合テスト
統合テスト
配信
クイックスタートを通じて
ライセンス
アドビ固有
貢献度
プル要求を通じて
不可能
アクセシビリティ
WCAG 2.0 AA 標準 に完全に準拠
WCAG 2.0 AA 標準 に部分的に準拠

コンポーネントリスト

使用可能なコアコンポーネント(API へのリンク)と、コアコンポーネントに置き換わる基盤コンポーネントの一覧を次の表に示します。
コアコンポーネント
説明
置き換わる基盤コンポーネント
テンプレートエディターに対応するレスポンシブページ
/libs/foundation/components/page /libs/wcm/foundation/components/page
ページ階層のナビゲーション
/libs/foundation/components/breadcrumb
H1 ~ H6 タイトル
/libs/foundation/components/title /libs/wcm/foundation/components/title
リッチテキスト
/libs/foundation/components/text /libs/foundation/components/table /libs/wcm/foundation/components/text
最適なレンディションサイズのスマート遅延読み込み
/libs/foundation/components/image /libs/foundation/components/adaptiveimage /libs/foundation/components/logo /libs/foundation/components/mobileimage /libs/foundation/components/mobilelogo /libs/wcm/foundation/components/image
ページのリスト
/libs/foundation/components/list /libs/foundation/components/mobilelist /libs/wcm/foundation/components/list
Facebook および Pinterest の共有ウィジェット
-
レスポンシブフォームの段落システム
/libs/foundation/components/form/start /libs/foundation/components/form/end
テキスト入力フィールド
/libs/foundation/components/form/text /libs/foundation/components/form/password
複数オプション入力フィールド
/libs/foundation/components/form/checkbox /libs/foundation/components/form/radio /libs/foundation/components/form/dropdown
非表示の入力フィールド
/libs/foundation/components/form/hidden
送信ボタンまたはカスタムボタン
/libs/foundation/components/form/submit
ネストしたページ階層を一覧表示するサイトナビゲーションコンポーネント
/libs/foundation/components/topnav /libs/foundation/components/mobiletopnav
グローバル言語構造を一覧表示する言語および国の切り替え機能
-
結果をドロップダウンメニューでインプレース候補として表示する検索コンポーネント
/libs/foundation/components/search
画像、タイトル、リッチテキスト、追加コンテンツや他のアクションへのリンクを使用して、コンテンツ作成者が詳細なコンテンツへのティーザーを容易に作成できるようにする
-
コンテンツ作成者がページコンテンツを複数のタブに整理できるようにする
-
コンテンツ作成者がコンテンツをスライドの回転カルーセルに整理できるようにする
/libs/foundation/components/carousel
コンテンツフラグメントを表示できるようにする
-
コンテンツフラグメントのリストを表示できるようにする
-
ページのコンテンツを区切る
-
折りたたみ可能なアコーディオンの形式にコンテンツパネルを整理する
-
コンテナ内のコンポーネントを整理する
-
ページ上にボタンを作成する
-
ダウンロード可能なアセットをページに追加する
-
エクスペリエンスフラグメントをページに追加する
/libs/cq/experience-fragments/editor/components/experiencefragment
ページ内に外部リソースを埋め込む
-

今後リリース予定のコンポーネント

今後リリース予定のコアコンポーネントのロードマップ概要については、 GitHub のプロジェクト Wiki を参照してください。

コアコンポーネントのアップグレード

バージョン管理されたコンポーネントのメリットの 1 つは、新しい AEM バージョンへの移行と新しいコンポーネントバージョンへの移行を切り離すことができる点です。また、新しいコンポーネントバージョンが使用可能になった場合は、コンポーネントごとに新バージョンへ個別に移行できます。
コアコンポーネントのバージョンが移行先の新しい AEM バージョンもサポートしている場合、新しい AEM バージョンへの移行はコアコンポーネントの動作に影響を与えません。 廃止または削除 された API を使用していない限り、コアコンポーネントのカスタマイズ部分も影響を受けません。
コアコンポーネントを新しいバージョンに移行しても、コンポーネントの動作には影響しませんが、ページ作成者向けの新しい機能が導入されることはあります。これらの機能については、デフォルトの動作が望ましくない場合、テンプレートエディターで何らかの設定が必要になる可能性があります。一方、カスタマイズ部分は適合が必要になる可能性があります。詳しくは、 コアコンポーネントのカスタマイズ を参照してください。

コアコンポーネントを使用すべき状況

コアコンポーネントはまったく新しい技術であり、複数のメリットがあるので、新しい AEM プロジェクトではコアコンポーネントを使用することをお勧めします。既存のプロジェクトでは、リブランディングや全体的なリファクタリングなど、より大きなプロジェクト作業の一環として移行をおこなうようにしてください。
そこで、アドビでは次の事項を推奨しています。
  • 新規プロジェクト
    新規プロジェクトでは、常に、コアコンポーネントを使用するよう努めます。コアコンポーネントを直接使用または 拡張 してプロジェクト要件を満たすことができない場合は、コアコンポーネントで規定されているコンポーネントアーキテクチャに従ってカスタムコンポーネントを作成します。他に方法がない場合を除き、 基盤コンポーネント を使用しないでください。
  • 既存プロジェクト
    サイトまたはコンポーネントのリファクタリングが予定されていない限り、 基盤コンポーネント を使用し続けることをお勧めします。 ほとんどの既存プロジェクトで広く使用されているので、基盤コンポーネントは 引き続きサポートされます
  • 新規のカスタムコンポーネント
    既存の コアコンポーネントをカスタマイズしてよいか どうかを評価します。 カスタマイズできない場合は、 コンポーネントのガイドライン に従って新規のカスタムコンポーネントを作成することをお勧めします。
  • 既存のカスタムコンポーネント
    コンポーネントが期待どおりに動作する場合は、それらのコンポーネントをそのままにしておきます。 そうでない場合は、上記の「新規のカスタムコンポーネント」を参照してください。

コアコンポーネントへの移行

新規プロジェクトは、コアコンポーネントで実装する必要があります。ただし、既存プロジェクトでは通常、基盤コンポーネントが広範囲にわたって実装されています。
既存プロジェクトに関する大規模な作業(リブランディングや全体的なリファクタリングなど)は、多くの場合、コアコンポーネントへの移行のチャンスとなります。このような移行を容易にするために、アドビでは、コアコンポーネントと最新の AEM テクノロジーの導入を促進するための多数の移行ツールを提供しています。
AEM Modernization Tools を使用すると、以下の変換を容易におこなえるようになります。
  • 静的テンプレートから編集可能テンプレートへ
  • デザイン設定からポリシーへ
  • 基盤コンポーネントからコアコンポーネントへ
  • クラシック UI からタッチ操作対応 UI へ
これらのツールの使用方法について詳しくは、 ぞれぞれのドキュメント /を参照してください。
AEM Modernize Tools はコミュニティの取り組みであり、アドビによるサポートまたは保証の対象外です。

コアコンポーネントのサポート

コアコンポーネントは AEM に不可欠な部分なので、クイックスタートの一部として提供される場合と同じ条件の下、現状のままでサポートされます。
他の AEM 製品機能と同様、原則的としてまず、コンポーネントの廃止が発表されてから、最短でその次のリリースで削除されます。これにより、サポートが終了する前に、コンポーネントの新バージョンに移行する猶予期間として少なくとも 1 回分のリリースサイクルを確保できます。
各コンポーネントのバージョンには、サポートされる AEM バージョンが明記されています。ある AEM バージョンのサポートが停止されると、その AEM バージョンでのコアコンポーネントのサポートも停止されます。
コンポーネントのカスタマイズのサポートについて詳しくは、 コアコンポーネントのカスタマイズ を参照してください。

Foundation コンポーネントのサポート

基盤コンポーネントは多数の AEM バージョンにわたって大規模プロジェクト開発の基礎の役割を果たしてきたので、今後も引き続きサポートされます。
ただし、アドビの開発の重点はコアコンポーネントに移っており、新機能はコアコンポーネントに追加されます。一方、 大部分の Foundation コンポーネントが AEM 6.5 で廃止され 、今後 Foundation コンポーネントに対してはバグ修正のみがおこなわれます。
関連項目: