Using Components

You can use components in many different contexts. This section shows you how.

• Aura Component Bundle Design Resources

  Use a design resource to control which attributes are exposed to builder tools like the Lightning App Builder, Experience Builder, or Flow Builder. A design resource lives in the same folder as your .cmp resource, and describes the design-time behavior of the Aura component—information that visual tools need to display the component in a page or app.

• Use Aura Components in Lightning Experience and the Salesforce Mobile App

  Customize and extend Lightning Experience and the Salesforce mobile app with Aura components. Launch components from tabs, apps, and actions.

• Navigate Across Your Apps with Page References

  The pageReference JavaScript object represents a URL for a page. You can use a pageReference instead of parsing or creating a URL directly. This approach helps you avoid broken navigation if Salesforce changes URL formats in the future.

• Get Your Aura Components Ready to Use on Lightning Pages

  Custom Aura components don’t work on Lightning pages or in the Lightning App Builder right out of the box. To use a custom component in either of these places, configure the component and its component bundle so that they’re compatible.

• Use Aura Components in Experience Builder

  To use a custom Aura component in Experience Builder, you must configure the component and its component bundle so that they’re compatible.

• Use Aura Components with Flows

  Customize the look-and-feel and functionality of your flows by adding Lightning components to them. Or wrap a flow in an Aura component to configure the flow at runtime, such as to control how a paused flow is resumed.

• 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.

• Integrate Your Custom Apps into the Chatter Publisher

  Use the Chatter Rich Publisher Apps API to integrate your custom apps into the Chatter publisher. The Rich Publisher Apps API enables developers to attach any custom payload to a feed item. Rich Publisher Apps uses Lightning components for composition and rendering. We provide two Lightning interfaces and a Lightning event to assist with integration. You can package your apps and upload them to AppExchange. An Experience Builder site admin page provides a selector for choosing which five of your apps to add to the Chatter publisher for that site.

• Using Background Utility Items

  Implement the lightning:backgroundUtilityItem interface to create a component that fires and responds to events without rendering in the utility bar.

• Use Lightning Components in Visualforce Pages

  Add Aura components to your Visualforce pages to combine features that use both solutions. Implement new functionality using Aura components and then use it with existing Visualforce pages.

• Use Aura and Lightning Web Components Outside of Salesforce with Lightning Out (Beta)

  To run components outside of Salesforce servers, use Lightning Out, a special type of standalone Aura app. Whether it’s a Node.js app running on Heroku or a department server inside the firewall, add your components as dependencies to a Lightning Out app. Then run the Lightning Out app wherever your users are.

• Lightning Container

  Upload an app developed with a third-party framework as a static resource, and host the content in an Aura component using lightning:container. Use lightning:container to use third-party frameworks like AngularJS or React within your Lightning pages.