[Salesforce]Lightning コンポーネント‐手順１：コンポーネント作成

Lightningコンポーネント作成例を共有します。

１．Lightningコンポーネント作成

Eclipseでの開発の場合には、Lightning Bundleを選択する。

CreateComponent.cmp

作成すると、以下のモジュールも作成されます。

CreateComponent.cmp-meta.xml

CreateComponent.css

CreateComponentController.js

CreateComponentHelper.js

CreateComponentRenderer.js

CreateComponent.cmp編集

<aura:component implements="force:appHostable">
    <h1>Hello, Lightning Component!!</h1>
</aura:component>

解説

implements="force:appHostable"

： コンポーネントをSalesforce1のナビゲーションメニューで使用できるようにする。

implements="flexipage:availableForAllPageTypes"

： LightningアプリケーションビルダーやLightningページタブに表示できるように する。

動作確認するために、Lightning Application作成する。

CreateComponentAppliction.app

以下のモジュールも作成される。

CreateComponentAppliction.app-meta.xml

CreateComponentAppliction.css

CreateComponentApplictionController.js

CreateComponentApplictionHelper.js

CreateComponentApplictionRenderer.js

Applicaionを編集する。

<aura:application>
	<c:CreateComponent/>
</aura:application>

以下のURLで確認する。

https://[ yourdomain ]/c/CreateComponentAppliction.app
例えば、
https://testdaeheuitest-test11-dev-ed.lightning.force.com/c/CreateComponentAppliction.app

画面上に以下のように表示される。

Hello, Lightning Component!!