Getting Started

Getting started with @motor-js/engine

Install via npm

The fastest way to get started is to install via npm.

npm i @motor-js/engine

Usage

Start by wrapping your application with the Motor component, at the root of your project. This handles connection to the Qlik engine and is needed for any of the hooks to work.

You can either set the configuration to your Qlik site directly in this component, or pass the engine object (useful if you are handling custom authentication and connection).

// 1. Import the Motor component
import { Motor } from @motor-js/engine

function App() {

	return (
		// 2. Use at the root of your project
		<Motor
		  config={
		    host: "myqliksite.qlik.com",
		    secure: true,
		    port: 433,
		    prefix: "",
		    appId: 'myAwesomeApp',
		  }>
			<App />
		</Motor>
	)
}

Next, import the hooks or contexts into your project and you are good to go. In the below example we are extracting data from the useList hook.

import { useList } from "@motor-js/engine"

const Filter = () => {
	
	const dimension = ['Country'];

	const {
	  listData,
	} = useList({
	  dimension,
	});
	
	console.log(listData);

	return (
	<div></div>
	);

};

Use the link below to jump to more details on how to use the hooks in the package.

pageIntroduction

Usage with Qlik Sense Cloud

If you are connecting to a Qlik cloud SAAS instance, your configuration will look slightly different. We need to set the qcs entry to true and also add the web integration id, generated in your Qlik site.

import { Motor }from '@motor-js/core'
<Motor
  config={{
    host: 'motor.eu.qlikcloud.com',
    secure: true,
    port: null,
    prefix: '',
    appId: '39e218c1-42ee-4f38-9451-1b8f850505d5',
    webIntId: '...',
    qcs: true,
  }}>
>
// ...
</Motor>

For more information on how to generate your first web integration id in Qlik SAAS, head to the Qlik docs.

Usage with Qlik Sense Enterprise

If you are using Qlik Sense Enterprise, you will need to handle authentication to the Engine yourself. You can find an example React project below. Once you've connected to your engine instance, you can pass the returned object to your Motor component.

Last updated