Salesforce CLI を使用した地理位置情報アプリケーションの作成
学習の目的
- CLI を使用して Apex クラスを作成する方法を説明する。
- CLI コマンドを使用して Aura コンポーネントを作成する方法を説明する。
作成する内容
ここでは、機能、つまり地理位置情報アプリケーションを作成するために、ローカルでコードを記述し、スクラッチ組織に同期して、そこでテストします。その過程で、Apex といくつかの Aura コンポーネントを使用します。
Salesforce CLI とスクラッチ組織に引き続き焦点を絞るために、Aura コンポーネントを使用した取引先地理位置情報アプリケーションのコードを用意してあります。
次の図は、コンポーネントのインタラクションの概要を示しています。
この設計により、アプリケーションは柔軟で管理しやすいものになります。アプリケーションやビジネス要件の進化に合わせて、データを表示するコンポーネントを置き換えることができ、データを照会するコンポーネントを作り直す必要はありません。また、この設計では、これらのコンポーネントを他のアプリケーションで個別に再利用できます。
- 取引先検索コンポーネントは、サーバーサイドアクションをコールして取引先を検索します。
- Apex メソッドは、SOSL 検索結果を返します。
- 取引先検索コンポーネントは、データの他のコンポーネントに通知するイベントを起動します。
- イベントを処理するコンポーネントは、ユーザーにデータを表示します。
取引先検索 Apex コントローラーの作成
このステップでは、Apex コントローラーを作成して Aura コンポーネントが取引先とその位置情報のリストを取得できるようにします。Apex クラスは、Salesforce DX プロジェクトの force-app/main/default
フォルダー内の classes
というフォルダーに保存されます。CLI を使用して、新しい Apex クラスのスキャフォールディングをすばやく行うことができます。
-
geolocation
プロジェクトディレクトリ内で、プロジェクトのルートから次のコマンドを実行します。 -
force-app/main/default/classes/AccountSearchController.cls
を開き、スキャフォールディングコードを次のコードに置き換え、ファイルを保存します。 - ここで、前の単元で作成したデフォルトのスクラッチ組織に新しいコードをデプロイ (同期) します。
project deploy start
コマンドからの出力は、次のようになります。
取引先が読み込まれた Aura イベントの作成
単一責任の設計原則を使用して、検索結果の表示は、後のステップで作成する取引先地図コンポーネントと取引先リストコンポーネントによって処理されるイベントを起動することによって委任します。
- aura フォルダーにイベントを作成します。
-
force-app/main/default/aura/AccountsLoaded/AccountsLoaded.evt
を開き、スキャフォールディングコードを次のコードに置き換え、ファイルを保存します。 - 新しいコードをスクラッチ組織にデプロイします。
project deploy start
コマンドからの出力は、次のようになります。
取引先検索 Aura コンポーネントの作成
次に、これとほぼ同じプロセスを繰り返して、AccountSearch コンポーネントを作成します。Aura コンポーネントファイルは、バンドルにまとめられていて、force-app/main/default/aura
フォルダー内のフォルダーに保存されています。Apex クラスと同様に、コマンドラインから Aura コンポーネントのスキャフォールディングを行うことができます。
-
aura
フォルダーにコンポーネントを作成します。 このように、すべての必要なファイルが作成されます。 -
force-app/main/default/aura/AccountSearch/AccountSearch.cmp
を開き、内容を次のコードに置き換え、ファイルを保存します。 このコンポーネントには、ユーザーが取引先の名前や住所などの検索語を入力する入力項目があり、コンポーネントが初期化されたときや検索語が変更されたときにイベントハンドラーを登録します。
-
force-app/main/default/aura/AccountSearch/AccountSearchController.js
を開き、内容を次のコードに置き換え、ファイルを保存します。 クライアント側コントローラーは、コンポーネントの初期化イベントと検索語が変更された場合の処理を実行します。ヘルパーファイルをコールして、ユーザーの入力に基づいて検索を実行します。
-
force-app/main/default/aura/AccountSearch/AccountSearchHelper.js
を開き、スキャフォールディングコードを次のコードに置き換え、ファイルを保存します。 - 新しいソースをスクラッチ組織にデプロイします。
取引先リスト Aura コンポーネントの作成
次に、データテーブルに取引先を表示する Aura コンポーネントを作成します。表示するデータを特定するために、このコンポーネントは前のステップで作成した c:AccountsLoaded
イベントに登録します。
-
aura
フォルダーにコンポーネントを作成します。 -
force-app/main/default/aura/AccountList/AccountList.cmp
を開き、スキャフォールディングコードを次のコードに置き換え、ファイルを保存します。 このコンポーネントは AccountsLoaded イベントをリスンし、イベントデータをテーブルに表示します。ユーザーが検索を行って別の結果が検出されると、リストはそれに応じて更新されます。
-
force-app/main/default/aura/AccountList/AccountListController.js
を開き、内容を次のコードに置き換え、ファイルを保存します。 クライアント側コントローラーのonAccountsLoaded
関数は、イベントデータを<lightning:datatable>
コンポーネントで想定される形式に変換します。onRowAction
関数は、ユーザーが操作した行の取引先レコードに移動します。
- 新しいコードをスクラッチ組織にデプロイします。
リソース
- Salesforce ドキュメント: Salesforce CLI Command Reference (Salesforce CLI コマンドリファレンス)
- Salesforce ドキュメント: Salesforce DX 開発者ガイド
- Visual Studio Marketplace: Salesforce Extensions for VS Code (VS コード向け Salesforce 拡張)
- Salesforce 動画: Salesforce CLI: Harnessing the Power of Salesforce Through the Command Line (Salesforce CLI: コマンドラインによる Salesforce の力の利用)