Salesforce 言語によるコーディング
学習の目的
- Lightning コンポーネントの利点を識別する。
- Lightning Experience での Visualforce の使用方法を説明する。
- Apex を使用して Lightning コンポーネントと Visualforce をサポートする方法の概要を説明する。
オプションの概要
Salesforce 開発者として学習するコアプログラムテクノロジは 3 つあります。
- Lightning コンポーネントフレームワーク: AngularJS や React と似た UI 開発フレームワーク。
- Apex: Java のような構文を持つ Salesforce 独自のプログラミング言語。
- Visualforce: HTML によく似たコードを使用してカスタムの Salesforce ページを作成できるマークアップ言語で、Apex と JavaScript の強力な組み合わせも利用できます。
ここでは、各テクノロジの概要を簡単に説明し、DreamHouse アプリケーションではどのようになるかを確認します。
Lightning コンポーネント
Lightning コンポーネントフレームワークは、デスクトップおよびモバイル用のユーザインターフェース開発フレームワークです。名前が示すとおり、これはのコンポーネントベースの UI 開発アプローチです。事前作成済みおよびカスタム Lightning コンポーネントを使用して、アプリケーションの洗練された一貫性のある UI を迅速に開発できます。
AngularJS、React、Polymer などのフレームワークに慣れている場合は、Lightning コンポーネントで何ができるか想像がつくでしょう。Lightning コンポーネントの利点はもちろん、Salesforce のすべてのビジネスデータと連動できることです。
メモ
Spring '19 リリース (API バージョン 45.0) では、Lightning Web コンポーネントモデルと従来の Aura コンポーネントモデルの 2 つのプログラミングモデルを使用して Lightning コンポーネントを作成できます。Lightning Web コンポーネントは、HTML と最新の JavaScript を使用して作成されるカスタム HTML 要素です。Lightning Web コンポーネントと Aura コンポーネントは、ページ上に共存可能で、同時に使用できます。詳細は、「Lightning Web Components Basics (Lightning Web コンポーネントの基本)」モジュールを参照してください。
「プラットフォーム開発の基礎」モジュールでは、Aura コンポーネントを使用して作成された DreamHouse アプリケーションを使用します。
では、DreamHouse アプリケーションに戻って実際の Lightning コンポーネントがどうなるかを確認しましょう。アプリケーションのカスタム Lightning コンポーネントを見てから、それがどう作成されているかを確認します。
アプリケーションランチャー 
で、[Properties (物件)] をクリックします。リストから物件を選択してその詳細ページを開きます。このページには多くの Lightning コンポーネントが表示されますが、ここでは特にあるものを探します。地図です。この地図で簡単に物件の場所を表示し、ユーザが拡大できるようにします。
- ギアメニュー
をクリックし、[設定] をクリックして [設定] に移動します。 - [クイック検索] ボックスで「Lightning コンポーネント」を検索してクリックします。
- [Map (地図)] をクリックし、[開発者コンソール] をクリックします。
開発者コンソールは、組織のコードを開発、デバッグ、テストするために使用できる Salesforce の統合開発環境 (IDE) です。現在、直前に見た物件地図のコードが表示されています。ここではコードを詳細には説明しません。それは別のモジュールで行います。少し時間を取り、注意して主要な属性を見てください。これは XML マークアップです。Aura 固有のタグと静的 HTML タグの両方が含まれています。タグには <namespace:tagName> 規則を使用しています。タグはそれぞれより小さいコンポーネントか、子コンポーネントを表します。
開発者コンソールの右側には、このコンポーネントのバンドルに含まれる追加のいくつかのアセットも表示されます。たとえば、[CONTROLLER (コントローラ)] をクリックすると、JavaScript が表示されます。Lightning コンポーネントではクライアント側の JavaScript コントローラとサーバ側の Apex コントローラを使用します。バンドルメニューから、これらのコントローラや、コンポーネントスタイルシートなどの他のアセットを作成してアクセスできます。
さらに Lightning コンポーネントにはモバイル対応という利点もあります。Salesforce モバイルアプリケーションを作成するとき、Lightning コンポーネントの表示方法を心配する必要はありません。アプリケーションに追加するだけで、後はプラットフォームが処理します。
Lightning コンポーネントについての詳細は、「リソース」セクションを参照してください。
Apex
ローコードツールとしてのプロセスビルダーについてはすでに説明しました。ローコードではありますが、短いコードを記述してプロセスビルダーの機能を拡張することもできます。DreamHouse に戻り、住宅価格が変更されたら常にプッシュ通知を送信するプロセスを見てみましょう。
- [設定] から、[クイック検索] で「プロセスビルダー」を検索し、[プロセスビルダー] ページを開きます。
- [Price Change Push Notification (価格変更プッシュ通知)] をクリックします。
- [ルール適用時のアクション] で、[プッシュ通知] をクリックします。
- [Apex クラス] 項目の値を確認します。上部のギアメニューから、開発者コンソールを開きます。
- をクリックし、[Filter (検索条件)] バーを使用して PushPriceChangeNotification を検索します。見つかったらダブルクリックして開発者コンソールで開きます。
Java で開発したことがあれば、このクラスで何が行われているかほどんど理解できるでしょう。ここでも、この実装の詳細には踏み込みません。Java に似た構文とは別に、いくつか注意すべき点があります。
Property__c property = [SELECT Name, Price__c from Property__c WHERE Id=:propId];
SQL に似た句は、実際には SOQL (Salesforce Object Query Language) です。SOQL を使用して、コードでデータベースからレコードを読み取ることができます。
もちろん、プロセスビルダーの拡張は、Apex を使用して組織の機能を拡張する多くの方法の 1 つにすぎません。詳細は、リソースを参照してください。
Visualforce
Salesforce Platform におけるコーディングの最後の主要な柱は Visualforce です。Web 開発の経験があれば、Visualforce は見慣れた感じがするでしょう。Visualforce を使用すると、Salesforce でのページの作成やカスタマイズに加え、HTML、CSS、JavaScript など他の標準 Web テクノロジとの統合が可能になります。
例を見る前に、Lightning コンポーネントと Visualforce ページの違いについて理解することが重要です。最大の違いは、名前が示しています。Lightning コンポーネントでは、つなぎ合わせてページを作成できるコンポーネントを開発します。Visualforce では、一度にページ全体を開発します。Lightning コンポーネントの方が新しく、モバイル開発などには適している一方で、状況によっては Visualforce を使用した方が妥当な場合があります。どのような場合にどちらを使用するのかについての詳細は、「ユーザインターフェース開発の考慮事項」の表を参照してください。
では、DreamHouse に戻ります。Visualforce ページの例を見てみましょう。
- アプリケーションランチャー で [HeatMap (ヒートマップ)] をクリックします。このページには、市内のすべての取り扱い物件とその場所が表示されます。
- ギアメニュー から、開発者コンソールを起動します。
- をクリックします。
- [Filter (検索条件)] バーで、「HeatMap」(ヒートマップ) と入力し、ダブルクリックして開きます。
このファイルには、Visualforce マークアップ、HTML マークアップ、CSS、JavaScript があります。SLDS という頭字語が何回か現れます。SLDS (Salesforce Lightning Design System) を使用すると、Salesforce の新しいインターフェースである Lightning Experience とデザインが一致するようにページのスタイルを設定できます。もう 1 つの注意点は、Visualforce が Lightning コンポーネントと似た規則 <apex:tagName> を使用していることです。
このクラスではわからないのは、Apex コントローラの概念です。前述のとおり、Lightning コンポーネントはクライアント側で JavaScript、サーバ側で Apex を使用しています。Visualforce ページもサーバ側の Apex コントローラを使用でき、複雑なページのほとんどで多用されています。Visualforce の探索を続けていけば、Apex コントローラに習熟できるでしょう。
[設定] の [クイック検索] バーから「Visualforce ページ」を検索して Visualforce ページにアクセスし、プレビューすることもできます。