カスタム開発 Icon

Lightning コンポーネント

Lightning コンポーネントのフレームワークを使用して、ユーザーエクスペリエンスをカスタマイズできます。Lightning コンポーネントフレームワークは、Salesforce プラットフォームでコンポーネントやアプリケーションを構築するための最新の JavaScript フレームワークです。ほかの最新 JavaScript フレームワークと同じ特長を持ちながら、Salesforce プラットフォームとの連携性に優れています。 また、厳格なセキュリティモデルを備えており、たとえば、ほかのコンポーネントが所有している DOM には機密データが含まれている可能性があるので、承認を受けていない部分にはアクセスできないように禁止することができます。 Lightning コンポーネントフレームワークを使用してコンポーネントやアプリケーションを構築する際に使用するフレームワーク、メタデータ、デザインシステムは、Salesforce のエンジニアが Salesforce アプリやコアコンポーネントを開発する際に使用しているのと同じものです。そのため、見た目も機能も一貫したエクスペリエンスを実現できます。

DreamHouse サンプルアプリケーションでは、いくつかの Lightning コンポーネントが担当者のユーザ体験を改善するために利用されています。DreamHouse 中のコンポーネントは、 ベース Lightning コンポーネントLightning データサービス といった Lightning コンポーネントフレームワークの最新の機能を利用しています。 これらは Lightning ページやSalesforce1 モバイルアプリ、 クイックアクション、そしてユーティリティバーといった様々な場所で利用されています。

ベース Lightning コンポーネント

ベース Lightning コンポーネントはコンポーネントをビルドするための部品となるコアコンポーネントのセットです。ベースコンポーネントには次のようなものが含まれます : badge(バッジ), button(ボタン), buttonGroup(ボタングループ), buttonIcon(ボタンアイコン), buttonMenu(ボタンメニュー), card(カード), formattedDateTime(整形済み日付時刻), formattedNumber(整形済み数値), icon(アイコン), input(インプット), inputRichText(リッチテキスト), layout(レイアウト), layoutItem(レイアウトアイテム), menuItem(メニューアイテム), select(選択リスト), spinner(スピナー),tab(タブ), tabset(タブセット), textarea(テキストエリア).

Lightning データサービス

Lightning データサービスはLightningコンポーネネントの中でのデータの取り扱いを簡単にします:

  • 最小限のコード (クライアントサイドおよびサーバサイド)。データサービスはたった一行のマークアップを記述するだけで利用できます。
  • データ共有 データサービスではコンポーネントを跨いで透過的にデータを共有します。コンポーネントが同じデータを取得するために、冗長的な呼び出しを別々に行なうことはありません。
  • 自動同期 データは共有されているので、一つのコンポーネントからの変更は、同じレコードを介して自動的に他のコンポーネントと同期されます。

Lightning ページ内の Lightning コンポーネント

Lightning コンポーネント は既存の Lightning ページや、新しく作成する Lightning ページのどちらにも簡単に追加できます。

以下のビデオでは、Dreamhouse サンプルアプリケーション内でどのように Lightning コンポーネントを使用して物件レコードのホームページをカスタマイズするかが紹介されています:

Lightning Components を組み立てることで、まったく新しいユーザ経験を生み出すこともできます。 Lightning コンポーネントを使用して DreamHouse サンプルアプリケーションでカスタムの検索画面を作成する方法については、下のビデオをご覧ください:

Salesforce1 モバイルアプリ内の Lightning コンポーネント

Lightning ページを Salesforce1 モバイルアプリにデプロイすることも可能です。こちらのビデオをご覧ください :

クイックアクション内の Lightning コンポーネント

Lightningコンポーネントを利用してクイックアクションを作成することもできます。Dreamhouse サンプルアプリでは、 スマートホームコンポーネントを通じて担当者が部屋の温度や照明、ドアの解錠などを外部からコントロールできます。 スマートホームコンポーネントは物件ホームページに追加できますが、クイックアクションとして登録して、ブラウザ上やSalesforce1モバイルアプリからクリックやタップによって呼び出すことも可能です。

ビデオはこちら:

ユーティリティバー内の Lightning コンポーネント

ユーティリティーバーは、ユーザーが使用しているページに関係なく必要なコンポーネントを常に表示するのに最適な場所です。 DreamHouseのサンプルアプリケーションにある住宅ローン計算機コンポーネントは、担当者が常に手元に表示しておく必要のあるコンポーネントの良い例です。

以下のビデオを見て、ユーティリティーバーの実際の住宅ローン計算機コンポーネントを見てください:

ソースコード:

物件エクスプローラー コンポーネントのソースコードはDreamHouse非管理パッケージの中に含まれています。