The concept of Mashups isn't new to Qlik. QlikView also allows the integration of an application into websites. However, the integration of QlikView applications into sites is hard to achieve as its API isn't as open and varied as other Qlik Sense APIs.
Qlik Sense mashups help to easily integrate application objects or sheets into websites. Qlik has made it so easy that it is very common to see charts embedded in sites instead of the out-of-the-box look and feel Qlik Sense provides.
Mashup editor allows you to easily create or edit mashups. To open the editor, click on Mashup editor on the left-hand menu in Dev Hub:
In the welcome pop-up window, click on Create new project. Type in the name MyQSMashup and select Basic mashup template from the Template dropdown. After clicking on the Create & edit button, we are presented with the main screen.
At the top, we will see tabs with the main file extension present in most extensions: .qext, .html, .js, and .css.
We can either manually change these files, or we can choose an application from the Select an app drop-down, and drag and drop the objects into the main pane.
The following image shows the Mashup editor screen with its main elements:
Once we have drag and dropped the object, Save the project. To see what our work looks like, we can either click on View in the lower right-hand side corner or use the following URL:
http://localhost:4848/extensions/MyQSMashup/MyQSMashup.html
Remember that for the mashup to work, either Qlik Sense Desktop must be running, or the Qlik Sense services should be up and running-if you are working in an Enterprise environment.
The good thing about Mashup editor is that it gives you the base of the integration, which you can then scale up.
From within the .html file, you can add titles, tables, text, and so on. Edit the .css file to change any styling. It takes a bit of time to get familiar with all these terms, but in Chapter 13, Creating Extensions in Qlik Sense, we will go into more detail on how all these files work and what they mean.