アプリケーションの UI の設計

アプリケーションのマークアップは <aura:application> タグで開始します。

<aura:application> タグについての詳細は、「aura:application」を参照してください。

sample.app ファイルを見てみましょう。<aura:application> タグで開始しています。

1<aura:application>
2    <div>
3      <header>
4          <h1>Sample App</h1>
5      </header>
6      <ui:block class="wrapper" aura:id="block">
7        <aura:set attribute="left">
8             <docsample:sidebar aura:id="sidebar" />
9        </aura:set>
10             <docsample:details aura:id="details" />
11      </ui:block>
12    </div>
13</aura:application>

sample.app ファイルには HTML タグ (<h1> や <div> など) とコンポーネント (<ui:block> など) が含まれています。ここでは各コンポーネントの詳細な説明は省きますが、マークアップがいかに簡単かを確認してください。<docsample:sidebar> および <docsample:details> コンポーネントは、ページのレイアウトをカプセル化します。

別のサンプルアプリケーションについては、「スタンドアロン Lightning アプリケーションを作成する」で作成された expenseTracker.app リソースを参照してください。