進行状況の追跡を始めよう
Trailhead のホーム
Trailhead のホーム

Lightning アプリケーションビルダーの使用開始

学習の目的

この単元を完了すると、次のことができるようになります。
  • 応答性の高いアプリケーションを作成したり Lightning Experience およびモバイルアプリケーション用のカスタムページを作成したりするために、Lightning アプリケーションビルダーをどう利用したらよいかを理解する。
  • Lightning アプリケーションビルダーのユーザインターフェースのレイアウトを理解する。
  • Lightning ページと Lightning コンポーネントの違いを説明する。

Lightning アプリケーションビルダーの紹介

ユーザは多忙です。常に商談を成立させたり、一流のサービスを提供したり、見込み客や顧客へのマーケティングを行ったりしています。カスタマイズされたページを作成すれば、ユーザは手元に主要な情報を持ったり、簡単なインターフェースを使用してレコードの更新や追加をしたりすることができます。

Lightning アプリケーションビルダーは、Salesforce モバイルアプリケーションや Lightning Experience のカスタムページを簡単に作成するためのポイント & クリックツールで、ユーザに必要なものが 1 か所にまとめられています。

それだけではありません。[設定] のアプリケーションマネージャから Lightning アプリケーションを編集すると、Lightning アプリケーションビルダーが開いてアプリケーションの設定を管理できます。アプリケーションのブランド設定、ナビゲーション、オプションの更新と、そのアプリケーションに割り当てられた Lightning ページの管理をすべて Lightning アプリケーションビルダーで行うことができます。

このモジュールでは、Lightning ページの作成について説明します。Lightning アプリケーションビルダーを使用したアプリケーションの編集についての詳細は、「Lightning アプリケーション」を参照してください。

Lightning アプリケーションビルダーのしくみ

Lightning アプリケーションビルダーでは、次のものを作成できます。
  • 標準ページにドリルダウンする単一ページアプリケーション
  • 四半期の上位の販売見込み客や主要なリードを追跡するアプリケーションなど、ダッシュボードスタイルのアプリケーション
  • ユーザが経費を入力し、送信した経費を監視する経費アプリケーションなど、特定の作業に対処する「ポイント」アプリケーション
  • ユーザのニーズに合わせたオブジェクトのカスタムレコードページ
  • ユーザがよく使用するコンポーネントや機能が含まれたカスタムホームページ

Lightning ページは、Salesforce モバイルアプリケーションまたは Lightning Experience で使用するページを設計できるカスタムレイアウトです。Lightning ページは、コンポーネントを含む範囲で構成されます。

ここで作成するページの一例を次に示します。

Lightning Experience でカスタムコンポーネントをテストする

Lightning ページの構造は、それを表示するデバイスに適合されます。ページの作成時に選択したテンプレートは、特定のデバイスでの表示方法を制御します。Lightning ページのテンプレートにより、ページがいくつかの領域に分割されます。

Lightning ページの領域

Lightning コンポーネント

Lightning コンポーネントは設定および再利用が可能なコンパクトな要素で、Lightning アプリケーションビルダーの Lightning ページに追加できます。

Lightning ページでは次のコンポーネントがサポートされています。
標準コンポーネント
標準コンポーネントとは、Salesforce が作成した Lightning コンポーネントです。
カスタムコンポーネント
カスタムコンポーネントとは、各自が作成した Lightning コンポーネントです。カスタム Lightning コンポーネントは、Lightning アプリケーションビルダーで機能するように設定できます。
AppExchange のサードパーティコンポーネント
AppExchange には、Lightning コンポーネントのマーケットプレイスがあります。設定済みのコンポーネントが含まれた、Lightning アプリケーションビルダーですぐに使用できるパッケージが見つかります。
メモ

メモ

Spring '19 リリース (API バージョン 45.0) では、Lightning Web コンポーネントモデルと従来の Aura コンポーネントモデルの 2 つのプログラミングモデルを使用して Lightning コンポーネントを作成できます。Lightning Web コンポーネントは、HTML と最新の JavaScript を使用して作成されるカスタム HTML 要素です。Lightning Web コンポーネントと Aura コンポーネントは、ページ上に共存可能で、同時に使用できます。

Lightning アプリケーションビルダーのユーザインターフェース

Lightning アプリケーションビルダーのユーザインターフェースを使用すると、Lightning ページを簡単に作成できます。このツールの各部の詳細を次に示します。

Lightning アプリケーションビルダーの UI
ヘッダー (1)
Lightning ページで作業を行うときに、ヘッダーにはその表示ラベルが表示され、最近更新した 10 個のページを参照できる [ページ] リストが含まれます。保存せずに [設定] に戻るか、Lightning アプリケーションビルダーの詳細ヘルプを表示することもできます。
アプリケーションを編集する場合は、ヘッダーにはアプリケーション名が表示され、ブランド設定、ナビゲーション、ユーティリティバーなどのアプリケーションのオプションを設定できる [アプリケーション設定] タブが含まれます。アプリケーションの場合、[ページ] リストには、現在のアプリケーションに関連付けられたすべての有効な Lightning ページが表示されます。
ツールバー (2)
ツールバーのボタンを使用して、ページコンテンツの切り取り (切り取り)、コピー (コピー)、貼り付け (貼り付け) を行うことができます。また、元に戻す (元に戻す)、やり直し (やり直し)、保存、Lightning ページの有効化も実行できます。さらに、ページを異なる形式で表示したり、キャンバスを更新したり、ビューに合わせてキャンバスのサイズを調整したりすることもできます。
Lightning コンポーネントペイン (3)

コンポーネントペインには、Lightning ページでサポートされている Lightning の標準およびカスタムコンポーネントがすべて含まれます。コンポーネントをクリックして、追加するページまでドラッグします。

ヒント

ヒント

カスタムコンポーネントが多数ある場合、検索項目にテキストを入力すると、必要なコンポーネントを簡単に検索できます。ペインの下部のボタンを使用して、AppExchange にあるサードパーティのカスタムコンポーネントにアクセスできます。

Lightning ページのキャンバス (4)
キャンバスはページを作成するエリアです。コンポーネントをドラッグして、ページ上で並び替えます。
プロパティペイン (5)
プロパティペインにはページで選択している内容に応じて、ページ全体のプロパティまたは選択したコンポーネントのプロパティのいずれかが表示されます。コンポーネントを表示中にページのプロパティにアクセスするには、ブレッドクラムの [ページ] をクリックします。

Lightning ページの種別

Lightning アプリケーションビルダーでは Lightning ページのさまざまな種別を作成できます。ここでは次の 3 つの種別について説明します。
アプリケーションページ
アプリケーションページを使用してサードパーティアプリケーションのホームページを作成し、そのページを Salesforce モバイルアプリケーションおよび Lightning Experience のナビゲーションメニューに直接追加できます。このページがアプリケーションホームページになり、最も重要なオブジェクトや項目にすばやくアクセスできます。
ホームページ
特定の種別のユーザに関連する機能を備えたホームページを作成し、カスタマイズしたページを異なるアプリケーション、またはアプリケーションとユーザプロファイルの組み合わせに割り当てます。カスタムホームページは、Lightning Experience でのみサポートされています。
レコードページ
レコードページを使用すると、オブジェクトのレコードページをユーザのニーズに合わせて調整し、カスタマイズされたバージョンを作成できます。カスタムレコードページは、Lightning Experience と Salesforce モバイルアプリケーションでサポートされています。

ホームページから開始しましょう。