Build your first Lightning Component – Only View
How to build your first Lightning Component?
Only View, No Logic
Step 1: Create Lightning Component Bundle named “Welcome”
After creation, we will get four primary files such as
- Welcome.cmp
- Welcome.css
- WelcomeController.js
- WelcomeHelper.js
We need to update Welcome.cmp & Welcome.css file for now.
Welcome.cmp | Describes View Layout
<aura:component> <div class="slds slds-m-top--x-large slds-align_absolute-center tagLine"> Welcome to Everyone !! </div> </aura:component>
Welcome.css | Describes Styling
.THIS.tagLine{ font-size:30px; color:#0066CC; }
Step 2: Create Lightning App named “LearningLightning”
LearningLightning.app | To run this newly created Lightning Component
<aura:application extends="force:slds"> <c:Welcome/> </aura:application>
You can notice that we are using the tag extends=”force:slds” to run the Lightning Application using Lightning Styles.
Step 3: Result
2,843 total views, 3 views today