What you'll learn

  • Everything you need to know to build end to end, fully responsive Qlik Sense Web Mashups

  • Front End Web Development, covering HTML, CSS, Java Script and DOM Manipulation

  • Intermediate Java Script concepts including Callbacks, Promises and Higher Order Functions

  • How to build re-usable Mashup templates

  • The Qlik Sense APIs and all the key concepts for building mashups using both the Capability APIs and EnigmaJS

  • Popular Java Script libraries including JQuery, RequireJS, Webpack & Bootstrap

  • PicassoJS charting library and how to load data from Qlik Hypercubes

  • +25 Hours of Video Content

  • 8 Complete Projects

  • Lifetime Access

  • Continuous Support

  • Dedicated Slack Channel

  • +200 Lessons

Want a breakdown of what the course covers?

Download the full course syllabus below
Download

The Essentials

  • What should I expect?

    All course material is available immediately and for life, so learn at your own pace. We have broken down the material into 8 weeks of 3-5 hours of content which you can use as a guide, to pace you through the course.

  • Who is this course for?

    Anyone with an interest in front end web development and Qlik Sense web mashups.

  • What do I need to take this course?

    A Windows OS computer and access to the internet.

  • How many projects do we build?

    We build a total of 8 projects: from java script websites through to web mashups using Enigma JS and the Capability APIs.

  • Which version of the software is this course recorded with?

    This course uses both February 2019 and June 2019 versions. Don't worry if you have a later version!

Course curriculum

  • 1

    Welcome to the Qlik Sense Mashup Bootcamp

  • 2

    Week 1: HTML, CSS & Bootstrap

  • 3

    Introduction to HTML

    • Section Links

    • An Introduction to HTML

    • A Note on Documentation

    • JS Bin Intro & Writing Some HTML

    • Project Wireframe

    • Starting our Project & HTML Lists

    • Introducing DIVs

    • Feature List Section

    • Forms & Finishing our HTML Content

    • Download HTML Content
  • 4

    Introduction to CSS

    • Section Links

    • Introduction to CSS

    • Adding CSS to our Project

    • CSS Positioning

    • CSS Positioning: Exercise Files

    • EXERCISE & SOLUTION: CSS Positioning

    • SOLUTION WITH FLEX: CSS Positioning

    • The Cascade, Inheritance & Specificity

    • The Box Model

    • Box Model: Download Starter Files

    • The Box Model in Practice
  • 5

    FlexBox & Bootstrap

    • Section Links

    • Download Files (or skip if continuing from previous section)

    • An Introduction to FlexBox

    • Creating a FlexBox Header

    • An Introduction to Bootstrap

    • Converting our Header to Bootstrap

    • Introducing Font Awesome

    • Hero Image Download

    • Our Website's Hero Image Section

    • EXERCISE: Style our Feature List Section

    • SOLUTION: Style our Feature List Section

    • Completing our iFruit Website

    • Code Refactoring and Finishing Touches

    • Download Complete iFruit Project
  • 6

    Week 2: Java Script & The DOM

  • 7

    An Introduction to Java Script

    • Introduction to Java Script

    • Java Script in the Console

    • Number and String Methods

    • Assignment & Comparison Expressions

    • Java Script Functions

    • EXERCISE: Dog Age Calculator

    • EXERCISE: Reverse My Number

    • Discussing the Java Script Exercises
  • 8

    Control Flow & Arrays

    • Introduction to Control Flow

    • IF / ELSE & SWITCH Statements

    • EXERCISE: Which Prize

    • EXERCISE & SOLUTION: Which Prize?

    • EXERCISE: Weekend Finder

    • EXERCISE & SOLUTION: Weekend Finder

    • Java Script Loops

    • EXERCISE: Count to 21

    • EXERCISE & SOLUTION: Count to 21

    • Arrays in Java Script

    • Revisit our Count to 21 Challenge - Create an Array

    • EXERCISE: Print Sentence

    • EXERCISE & SOLUTION: Print Sentence
  • 9

    The Document Object Model

    • Introduction to the DOM

    • Download Project Files

    • Accessing the DOM & Manipulating Elements

    • DOM Event Listeners

    • Generating Random Colours

    • Selecting a Random RGB Colour

    • Creating our Refresh Function

    • Finishing our Project

    • Download Finished Project
  • 10

    Week 3: Intermediate Java Script & JQuery

  • 11

    Intermediate Java Script

    • Higher Order Functions

    • Objects & Constructor Functions

    • Download Project Files

    • Exploring our Recipe Object

    • Creating a Drop Down List

    • 'THIS' Keyword

    • Rendering Recipe Data

    • Finishing our Project

    • Refactoring our Code

    • Download Finished Code
  • 12

    JQuery

    • An Introduction to JQuery

    • Minification & Loading the Library

    • Changing CSS with JQuery

    • Changing Elements with JQuery

    • Adding Classes

    • Converting our Recipe Project to JQuery

    • Download Finished Project
  • 13

    Dashboard with Nightmode Project

    • Download Starter Files

    • Starting our Project

    • CSS RECAP EXERCISE: Style our Nav Bar

    • CSS RECAP SOLUTION: Style our Nav Bar

    • Building our Sidebar

    • JQuery Sidebar Toggle

    • CSS Variables & Night Mode Toggle

    • Responsive Design

    • Bootstrap Tooltip
  • 14

    Week 4: RequireJS & Introducing Qlik Sense

  • 15

    Require JS

    • An Introduction to Require JS

    • The Require Function

    • Require JS Config

    • Loading JQuery

    • Shim Config & Loading Bootstrap

    • The Define Function

    • Asynchronous Module Definition (AMD)

    • Require JS Quiz
  • 16

    An Introduction to Qlik Sense

    • Download Dataset: Highest Grossing Films

    • The Hub, Dev Hub & Anatomy of an App

    • Qlik Script & Manipulating Fields

    • The Associative Engine

    • Master Items & Creating Expressions

    • Set Analysis

    • Set Analysis Challenge

    • Building a Dashboard
  • 17

    The Qlik Sense Mashup Editor

    • Single Configurator

    • iFrames

    • An Introduction to the Capability APIs

    • Capability API Documentation

    • The Mashup Editor & Loading Objects

    • The Hidden Qlik Sense Developer Menu

    • Creating our First Mashup
  • 18

    Week 5: Mashup Template Project

  • 19

    Project Requirements & Starter Files

    • Download Starter Code

    • Section Links

    • Reviewing our Dashboard Code

    • Resources for Dashboard Design
  • 20

    Part 1: Building a Mashup Template

    • Converting to a Require JS Project

    • Loading the Capability APIs

    • Improving our Config with Variables

    • Conditional (Ternary) Operators

    • Reviewing Docs & Loading CSS

    • An Introduction to Lists

    • Making Selections

    • Revisiting Code Structure & Global Scope

    • SWITCH: Redo, Undo & Clear

    • Bootstrap Modals

    • Creating Bookmarks

    • Finishing our Bookmarks

    • Some Code Cleanup
  • 21

    Part 2: Building a Mashup Template

    • Current Selections

    • Array Prototype Reduce

    • Total Number of Selections

    • Search Bar

    • JQuery UI Autocomplete

    • Finishing Search Functionality

    • Recap on Tooltips

    • Bootstrap Grid & Placeholders

    • Finishing our Mashup Template

    • Download Finished Code
  • 22

    Week 6: HyperCubes & the Visualisation API

  • 23

    Asynchronous Java Script

    • Callbacks & Asynchronous Java Script

    • An Introduction to Promises
  • 24

    Introduction to HyperCubes

    • Introduction to Hypercubes

    • TEMP QVF Download (If needed)

    • CreateCube Method & Rendering Data

    • Building a Table

    • Additional Hypercube Properties

    • Map Function & Second Measure

    • Adding Selections
  • 25

    Google Play Analytics Mashup

    • Creating our App & Loading Data

    • Starting our Mashup

    • Building Filters

    • Adding Selections

    • The Visualisation API

    • Creating KPIs

    • Adding Charts

    • *NEW* Saving our Bookmarks

    • *NEW* Filter State Colouring + Code Refactor
  • 26

    Week 7: Picasso JS

  • 27

    An Introduction to PicassoJS

    • Documentation

    • Data for Our First Picasso JS Chart

    • Our First Chart

    • Chart Brushing

    • Interactions

    • A Note on Hyperscript

    • Tooltips

    • Re-sizing & Finishing Touches
  • 28

    PicassoJS & Mashups

    • Qlik Sense Version Update: April 2019

    • Download Starter Files

    • Starting our Avocado Analysis Mashup

    • Our Starter Charts

    • Bar Chart: Layering Components

    • Range Brushing
  • 29

    Picasso Q & Working with Data

    • Callbacks Method & Hypercubes

    • Picasso Q Plugin

    • Making Selections

    • Chart Linking with Promises

    • Cleanup HyperCubes

    • Async Await Syntax

    • Line Chart Exercise

    • Trends Tab

    • EXERCISE: Complete Pie Chart

    • Discussing Websockets & Multi-Page Mashups

    • Download Complete Project
  • 30

    Week 8: Enigma JS

  • 31

    An Introduction to EnigmaJS

    • The Engine API Explorer

    • An Introduction to Enigma JS

    • Client Side Enigma JS: Accessing the Engine

    • Loading a HyperCube

    • Section Links

    • A Note on QDT Components
  • 32

    Kickstarter Mashup & Webpack

    • Environment Set-up

    • NodeJS v Node Package Manager

    • Java Script Runtime Link

    • What is Webpack?

    • Download Starter Files

    • Starting our Project with Webpack

    • Installing Babel

    • Loading Enigma and Accessing the Engine

    • Java Script Classes & Creating a Session Object
  • 33

    Finishing our Kickstarter Mashup

    • Line Chart Download

    • Building our PicassoJS Chart

    • Patch Properties

    • Theming our Chart

    • Starting our KPI Objects

    • Finishing our KPI Objects

    • Regular Expressions: MDN Web Docs

    • Trend Chart Download

    • Trend Chart

    • Finishing our Mashup
  • 34

    Course Feedback

    • Course Feedback

    • Course Discussion

Your instructor

Lead Instructor

Luke Reilly

Hey, I’m Luke, a developer and passionate trainer. I've taught web development and data visualisation to hundreds of students and I'm looking forward to helping you master a new skill. When I'm not teaching, I'm building enterprise scale Qlik Sense applications and mashups. I believe you learn by building the real thing, so we'll cover the theory and then build end-to-end projects. Looking forward to learning with you all.