An app’s markup starts with the <aura:application> tag.
Let's look at a sample.app file, which starts with the <aura:application> tag.
<aura:application extends="force:slds"> <lightning:layout> <lightning:layoutItem padding="around-large"> <h1 class="slds-text-heading--large">Sample App</h1> </lightning:layoutItem> </lightning:layout> <lightning:layout> <lightning:layoutItem padding="around-small"> Sidebar <!-- Other component markup here --> </lightning:layoutItem> <lightning:layoutItem padding="around-small"> Content <!-- Other component markup here --> </lightning:layoutItem> </lightning:layout> </aura:application>
The sample.app file contains HTML tags, such as <h1>, as well as components, such as <lightning:layout>. We won't go into the details for all the components here but note how simple the markup is. The <lightning:layoutItem> component can contain other components or HTML markup.