Aura コンポーネントの基本その1【Trailhead】

こんにちは、アンダーソンです。
今回は上級デベロッパー試験でかなりの確率で出題されていたLightningコンポーネント関連の
Trailheadをやっていきます。
自身としては以前にこのモジュールは終わらせていたのですが、
再試験に向けての勉強も兼ねて再度チャレンジしていきます。
モジュールごとに分けていきますので、まずその1です。

はじめに

まずLightningコンポーネントとは何なんでしょうか。
Trailheadの言葉を借りると、

「Lightning コンポーネントフレームワークは モバイルデバイス用およびデスクトップデバイス用の Web アプリケーションを開発するための単一ページアプリケーションを構築するための最新のフレームワークです」

こんな感じでしょうか。
Lightningコンポーネントの開発に必要な知識は
クライアント側でコントローラとして動かすJavaScript
サーバ側でDatabaseとやり取りするApex
この二つが不可欠になりますので、しっかり抑えておきましょう。
ちなみにこの単元が難しいと感じる方はこちらから始めることもおすすめです。

Aura コンポーネントの作成および編集

• Bug Spray、Bear Repellant、Goat Foodを含むキャンプ用品の順序付きリストを含むcampingListコンポーネントを作成します。
• フォントサイズが18のH1タグでラップされたキャンプリストを表示するcampingHeaderコンポーネントを作成します。
• campingHeaderおよびcampingListコンポーネントを含むcampingコンポーネントを作成します。

コードは下記でOKです。

camping.cmp

<aura:component>
    <c:campingHeader/>
    <c:campingList/>
</aura:component>

campingHeader.cmp

<aura:component>
    <h1>Camping List</h1>
</aura:component>

campingList.cmp

<aura:component>
    <ol>
        <li>Bug Spray</li>
        <li>Bear Repellant</li>
        <li>Goat Food</li>
    </ol>
</aura:component>

campingHeader.css

h1.THIS {
    font-size: 18px;
}

見た目はこんな感じになればOKですね。

まずは小手調べって感じです。
Lightningの練習というより、HTMLとCSSの練習ですね。
コンポーネントの理解をするまず初期段階です。

その他の開発に関する記事はこちらです。

Developerも含めた試験問題にチャレンジしてみましょう。