Code By Code – Lightning Framework – Chapter 3 – SLDS or Aura Component

Code By Code – Lightning Framework – Chapter 3 – SLDS or Aura Component

You can create Aura Component either using normal HTML tags and SLDS stylesheet or by directly accessing out of the box aura component like lightning:button etc. Which one to use, let’s learn in this chapter.

Chapter 3

HTML tags with SLDS

You can create components with Lightning look and feel by using normal HTML tags with Salesforce Lightning Design System CSS library. For example, you can create a button with SLDS like below:

<button class="slds-button slds-button_brand">Brand Button</button>

Base Aura Component

The lightning framework already comes with base aura components and it is very easy to create markup with the help of aura component. For example, you can create a button using base aura component like below:

<lightning:button variant=”brand” label=”Brand action” title=”Brand action” onclick=”{! c.handleClick }” />

Which one to use?

As per Salesforce best practices, always try to use Standard Lightning Component instead of HTML Tags. For ex. Use instead of “button”. The standard aura component offers many advantages:

  • Automatically use SLDS
  • Secure and Optimized for performance
  • Using aura component simplify your job by providing some out of the box functionality that you may have to create with HTML tags
  • Designed with accessibility in mind, that means users with disabilities can also use your app.

Lightning Component Development Day2 - Applying Stylesheet, Create Basic Lightning Component

Test Your Knowledge

SLDS vs Aura Components

Next In This Guide

Manish Choudhari

I am a certified Salesforce Application & System Architect and Developer working on Salesforce Technology since 2014. Currently, I have 14 Salesforce certifications along with OCPJP (Oracle Certified Profession JavaSE6 Programmer) working in Salesforce.com Hyderabad as a Technical Engineer. Writing technical blogs, learning new technologies and frameworks and sharing knowledge is my hobby.

Leave a Reply

Close Menu