@motor-js/engine is our core package, on top of which all motor mashups are built.


This package exists to provide:

  • Rapid Mashup Development: We aim to make the creation of Qlik Mashups as simple as possible for developers, removing the need for knowledge of the Qlik APIs

  • Headless UI: Designed to work with any front end UX and charting library

  • Powerful Hooks: Re-usable hooks and functions to simplify all interactions with the associative engine

@motor-js/engine is only free for non-commercial use, you need a license to use this package for commercial purposes.

How it Works

@motor-js/engine is a React library of hooks, contexts and components for building Qlik Sense mashups in React. It is leveraged by all Motor mashups.

It works by providing a layer over the Engine API to simplify these interactions. Meaning that you can build mashups and perform actions against the engine, without detailed knowledge of the Qlik APIs. For example, you can get data from the engine, apply selections, search your app and a lot more.

The library is designed to be headless, meaning it will work with any UX framework or charting library. It aims to simplify engine interaction, not make design decisions.

What is a "headless" UI library?

The Motor engine package is a headless utility, which means out of the box, it doesn't render or supply any actual UI elements. You are in charge of utilising the state and callbacks of the hooks provided by this library to render your own markup. Here's a quick explanation of why we have taken this decision:

  • Use Case for Mashups: Most of the time, design is a key reason for using mashups rather than the Qlik UI. We want to enable the developer to be in charge of designing their dashboard and Motor gives that control

  • Maintenance: By removing our UI components we can remain small, easy-to-use and simple to update/maintain

  • Extensibility: UI presents countless edge cases for a library and one where every developer does things differently. By not dictating UI concerns we empower the developer to design and extend the UI based on their unique use-case.


If you want to see this package in action, you can jump to our examples. We have lots of code hosted on Code Sandbox to show you how to perform some common use cases.


Last updated