Multicomponent

Overview

Multicomponent enables you to split your app into several components. Each may include different features, but all of the components are related and will contribute to the app’s functionality.

When developing an app that is a Multicomponent, develop each component separately and then register all the components under the same app in the Dev Center.

Terminology
  • Default component: The default component that will be added when users add your app to their website, this is set by you when you register your app in the dev center. If one of your components is a Page component, it will always become the default.
  • Extensions: All the components that are part of your app—except the default component. Users can add the app extensions from the bottom of the App Settings.
  • Essential extension: A component that is mandatory for the functionality of the app. This option can be checked when adding a new component in the Dev Center.
Example

For an example of a Multicomponent app, consider an eCommerce app that can be split into three components:

  • The default component is a Page component that includes the product catalog of the store.
  • The shopping cart is a Widget component that users can add to all the pages in their website.
  • The management of the store is a Dashboard component, which is managed from the user’s dashboard area. This component is included automatically when the user adds the app from the Editor.
User Experience
  • If your app includes site components, users will see your app in the Editor App Market and then add it to their website. This will add the default component to the Editor.
  • If your app includes more than one site component, users will be able to add the app extensions from the App Settings of each site component.
  • Each component will have its own name, description, and icon, which you will provide as part of the app registration process.
  • If your app also has a Dashboard component, it will be added automatically to the user’s dashboard area.
  • If users add the app from the Dashboard App Market, they will receive a notification that the app needs to be added to their website from the Editor App Market as well.
  • Deleting the app will revoke the permission only if there are no other components of the same app in the user’s website and dashboard area.
Architecture

Multicomponent consists of as many components as you want. Each site component has its own App Settings that the user can customize. If the Multicomponent also includes a Dashboard component, your app will be presented in the Editor App Market and the Dashboard App Market under the same name.

Signed App Instance

To link among all the components, use the App Instance. This is a signed parameter that allows you to identify the website and the Wix user, and verify that the calling party is indeed Wix. Each request to each of your endpoint components includes the App Instance ID parameter as part of the iframe URL.

Was this page helpful?

What can we do to improve it?

What did you like about it?