Lightning Component and Application Architecture

Understanding Component Composition

Component composition is the technical term for building new components and applications by assembling smaller, more granular components into something greater than the sum of its parts.

The smaller individual components do not add value in and of themselves, but their value is realized when they work together with other components to compose brand new components.

Peter Knolle breaks down the Lightning Component Framework architecture and clearly articulates the essence of component composition, which can be a difficult concept to conceptualize for developers new to the framework.

What you will learn from Peter’s piece is how to think about breaking down an application into finer grained components, then composing them into new components and applications by using component references and an attribute type called facets to pass data between components in the hierarchy.

Passing Data Between Components Up, Down and Across the Component Tree

As developers move from Visualforce and other MVC frameworks to Lightning Component development, one of the most difficult conceptual leaps that has to be made is unlearning the synchronous architecture of directly calling server-side controller actions from hard-wired UI components such as buttons or links, to a more decoupled and event-driven architecture.

Philippe Ozil lays out the different options for communicating between parent and child components up and down the component hierarchy, as well as across the entire component tree using a publish-subscribe pattern.

In this article you will learn about passing data values down the component hierarchy using both component attributes and public methods, passing data up or down the component hierarchy using component events, and passing data across the entire component tree using application events.

Patterns For Sharing JavaScript Code Between Lightning Components

To move beyond basic Lightning Component development into composing larger and more complex Lightning Applications, you will need to learn how to share code and data across any number of components contained in an application.

Christophe Coenraets presents two options for creating modular, reusable code that can be shared across Lightning Components: Importing a JavaScript file into a Lightning Component using ltng:require, and using lightweight “service components” that perform specific utility functions and enable you to utilize multiple Apex controllers from within the containing component.

In this article you will learn how modularizing code eliminates duplication and enables reusability as you build larger and larger enterprise applications on the Lightning Platform.