Developing Customization Experiences

Because of the complexity associated with implementing product customization, Customizer supports a few distinct approaches to integration projects:

• Direct API method: a host site directly integrates with the Blueprint or Recipe APIs and is responsible for the generation of appropriate and valid API requests.

WARNING

Because of the complexity associated with this method, it is generally not recommended except for some special circumstances, and for the most part is out of the scope of this document.

• JavaScript API method: a host site uses a JavaScript library provided by Customizer to implement the experience. The JavaScript API implements the direct API communication protocol and hides the complexity associated with that method.
• Reference Implementation method: Instead of creating a new implementation from scratch using the JavaScript API, implementors can take advantage of the reference implementation provided by Customizer.

JavaScript Language Versions

Most examples in this document use modern JavaScript features such as const/let scope declarations, Array methods, destructuring, etc. We recommend using cross-compilers such as BabelJS to enable these features in all supported browsers, or rewrite examples using your preferred version of JavaScript.

Reference Implementation

Customizer experiences come in all shapes and forms: integrated with PDPs or put on standalone pages, used on e-commerce websites, or invoked as a part of a marketing campaign. At Drive Commerce, we believe that the platform tools should not impede any of the creative processes, and instead should enable customers to create unique, engaging customization tools.

Instead of creating a rigid customizer front-end, the platform instead aims to provide a set of easy to use tools that can be quickly updated to match the creative designs. One of these tools is our reference implementation. The reference implementation is a complete customization experience delivered as both a ready-to-use widget app and the associated source code. This widget application can be easily integrated into the frontend of the target host, which could be an e-commerce website, marketing mini-site, or even inside a native mobile app.

View it live at https://cz.drrv.co/demo/index.html.

Access the implementation source code at Git repository https://bitbucket.org/drivecommerce/customizer-reference-implementation