Lightning is a rich client-side framework for developing device-agnostic and responsive user experiences (UXs) as well as for supporting mobile, tablet, and desktop. Unlike Visualforce, it was built from the ground up with today's multi-device rich client demands in mind. It is used by Salesforce themselves and is also available to developers to build their own standalone or platform-integrated UIs. Using Lightning Out, developers can also integrate UIs built with Lightning into external sites and applications. An emphasis on componentization is at the heart of its architecture and plays a key part in providing a means to implement reuse, separation of concerns, and extensibility.

This chapter provides an architectural overview of the Lightning Component architecture while contrasting it with its predecessor, Visualforce. New Lightning Components called Race Calendar, Race Results, Race Standings, and Race Setup will allow us to explore the development process and styling using the Lightning Design System.

Using the new components, we will explore the options for, and the benefits of, integrating components into Lightning Experience, Salesforce Mobile, and Lightning Communities, as well as existing Visualforce pages. Lightning Out and Lightning Out for Visualforce allow existing solutions to continue to support Salesforce Classic while moving toward Lightning. Lightning Flow integration allows you and/or your users to customize the UIs built with the clicks-not-code Lightning Flow Builder tool with your packaged components.

We will cover the following topics in this chapter:

• Overview of the two Lightning component frameworks
• Understanding the various component containers
• Building components that your end users can customize
• Using components to extend Lightning UIs and tools
• Understanding how to write secure JavaScript code
• Styling your Lightning UIs