Introduction to App Extensions

An app extension unlike an asset extension only allows a developer to either develop new endpoints (pages or APIs) or override existing endpoints. This is useful whenever a common page that is accessible by all asset types needs to be developed. As an example, the Store provides a top-assets view that displays the top assets for each of the asset types. In the app extension model, store_common and store_apis are the default implementation of an app extension.

App extension components

An application may have one or more extensions as shown in the diagram above. However, it is advised to group all customizations into a single extension to improve maintainability. The following diagram illustrates the structure of an app extension:

The key components of an app extension include: 

• A app.js script

• Defines new page and API endpoints.

• Specifies extensions on which dependencies exist.

• Specifies whether an extension should be loaded.

• For more information, see app.js Script.

• A pages directory - The page controllers are picked up from this directory.

• An apis directory - The API controllers are picked up from this directory.

• A themes directory - This directory serves a similar function to the app themes directory, and the ES rendering framework attempts to pick up resources in this directory under each theme name.

An app extension looks similar to an asset extension; however, they differ in the following ways: 

• The app.js script is a mandatory file unlike the asset.js file.

• The asset extension allows partials to be altered without specifying a controller; whereas, in an app extension a controller must be present for the ES rendering framework to attempt to pick up resources in the themes directory.

Related Links

• app.js Script
• Theme Resource Resolution for App Extensions