Lightning Aura Components Developer Guide

Introducing Aura Components
Quick Start
Creating Components
Using Components
Aura Component Bundle Design Resources
Use Aura Components in Lightning Experience and the Salesforce Mobile App
Navigate Across Your Apps with Page References
Get Your Aura Components Ready to Use on Lightning Pages
Use Aura Components in Experience Builder
Use Aura Components with Flows
Add Components to Apps
Integrate Your Custom Apps into the Chatter Publisher
Using Background Utility Items
Use Lightning Components in Visualforce Pages
Use Aura and Lightning Web Components Outside of Salesforce with Lightning Out (Beta)
Lightning Container
Communicating with Events
Communicating Across the DOM with Lightning Message Service
Creating Apps
Styling Apps
Developing Secure Code
Using JavaScript
Working with Salesforce Data
Testing Components
Debugging
Performance
Reference
PDF

Note: This release is in preview. Features described here don’t become generally available until the latest general availability date that Salesforce announces for this release. Before then, and where features are noted as beta, pilot, or developer preview, we can’t guarantee general availability within any particular time frame or at all. Make your purchase decisions only on the basis of generally available products and features.

Add Components to Apps

When you’re ready to add components to your app, first look at the built-in base components that Salesforce provides with the framework. You can also use these components by extending them or using composition to add them to custom components that you’re building.

For all the base components, see the Lightning Component Library. The lightning namespace includes many base components that implement visual elements common on web pages.

Note

If you can’t find a base component that meets your requirements, consider these options.

Components are encapsulated and their internals stay private, while their public shape is visible to consumers of the component. This strong separation gives component authors freedom to change the internal implementation details and insulates component consumers from those changes.

The public shape of a component is defined by the attributes that can be set and the events that interact with the component. The shape is essentially the API for developers to interact with the component. To design a new component, think about the attributes that you want to expose and the events that the component can initiate or respond to.

After you’ve defined the shape of any new components, developers can work on the components in parallel. This approach is useful if you have a team working on an app.

To add a custom component to your app, see Using the Developer Console.