Udemy

Platform

English

Language

Other

Category

The Qlik Sense Mashup Bootcamp

The only course you need to master Front End Web Development, the Qlik Sense APIs and build fully responsive Web Mashups

4.58 (99 reviews)

Students

26 hours

Content

Feb 2020

Last Update
Regular Price


What you will learn

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

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

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

Popular Java Script libraries including JQuery, RequireJS & Bootstrap

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

PicassoJS charting library and how to load data from Qlik Hypercubes

How to build re-usable Mashup templates


Description

Welcome to the Qlik Sense Mashup Bootcamp!

This is the only course you need to master Front End Web Development, the Qlik Sense APIs and build fully responsive Web Mashups.

By the end of this course you will be able to build Qlik Sense Mashups using both the Capabilities APIs and EnigmaJS, leveraging popular frameworks and libraries such as Bootstrap, RequireJS and Webpack.

This course includes:

  • 6 Complete Projects

  • Access to our Slack community

  • +25 hours of video content

  • +200 Lessons

We will start with the basics to ensure you have the foundational HTML, CSS and Java Script knowledge to get started using the Qlik APIs. We will then dive into building complete mashup projects using both the Capability APIs and EnigmaJS. This will include building a re-usable Mashup Template, loads of practice using and manipulating Qlik HyperCubes and mastering Qlik's open source charting library PicassoJS.


Looking forward to welcoming you to the course.



Screenshots

The Qlik Sense Mashup Bootcamp
The Qlik Sense Mashup Bootcamp
The Qlik Sense Mashup Bootcamp
The Qlik Sense Mashup Bootcamp

Content

Course Introduction

Course Syllabus

An Introduction to Qlik Sense Mashups

Access to Slack Channel

Environment Setup

Level Assessment: Where to start the course

Introduction to HTML

An Introduction to HTML

A Note on Documentation

JS Bin Intro & Writing Some HTML

What We're Going to Build: iFruit

Project Wireframe

Starting our Project & HTML Lists

Introducing DIVs

Features List Section

Forms and Finishing our HTML Content

Introduction to CSS

An 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

FlexBox and Bootstrap

An Introduction to FlexBox

Creating a FlexBox Header

An Introduction to Bootstrap

Converting our Header to Bootstrap

Introducing Font Awesome

Our Website's Hero Image Section

EXERCISE: Style our Feature List Section

SOLUTION: Style our Feature List Section

Completing our iFruit Website

Code Refactoring & Finishing Touches

Introduction to Java Script

Introduction to Java Script

Java Script in the Console

Numbers & String Methods

Assignment & Comparison Expressions

Java Script Functions

Dog Age Calculator

Reverse My Number

Discussing the Java Script Exercises

Control Flow and Arrays

Introduction to Control Flow

IF / ELSE and Switch Statements

EXERCISE & SOLUTION: Which Prize?

EXERCISE & SOLUTION: Weekend Finder

Java Script Loops

EXERCISE & SOLUTION: Count to 21

Arrays in Java Script

Revisit our Count to 21 Challenge - Create an Array

EXERCISE & SOLUTION: Print Sentence

Document Object Model

Introduction to the DOM

Download Project Files

Accessing the DOM & Manipulating Elements

Project Overview: RGB Color Game

Planning our Project

DOM Event Listeners

Generating Random Colors

Selecting a Random RGB Color

Creating our Reset Function

Finishing our Project

Intermediate Java Script

Higher Order Functions

Objects & Constructor Functions

Project Introduction: Recipe Selector

Download Project Files

Exploring our Recipe Object

Creating a Drop Down List

"THIS" Keyword

Rendering Recipe Data

Finishing our Project

Refactoring our Code

JQuery

An Introduction to JQuery

Minification & Loading the LIbrary

Changing CSS with JQuery

Changing Elements with JQuery

Adding Classes with JQuery

Download Finished Recipe Project Files

Converting our Recipe Project to JQuery

Download Finished Project Files

PROJECT: Dashboard with Nightmode

Project Introduction: Dashboard with Nightmode

Starting our Project (with Starter Files)

CSS RECAP EXERCISE: Style our Navbar

CSS RECAP SOLUTION: Style our Navbar

Building our Sidebar

JQuery Sidebar Toggle

CSS Variables & Nightmode Toggle

Responsive Design

Bootstrap Tooltip

Require JS

An Introduction to RequireJS

The Require Function

Require JS Config

Loading JQuery

Shim Config & Loading Bootstrap

The Define Function

Asynchronous Module Definition (AMD)

Require JS Quiz

Introduction to Qlik Sense

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

Qlik Sense Mashup Editor

Single Configurator

IFrames

An Introduction to the Capability APIs

Capability API Documentation

Mashup Editor Walkthrough & Loading Objects

The Hidden Qlik Sense Developer Menu

Creating our First Mashup

PROJECT: Mashup Template

What We're going to Build

Download Dashboard FIles

Reviewing our Dashboard Code

Resources for Dashboard Design

Converting to a RequireJS Project

Loading the Capability APIs

Improving our Config with Variables

Conditional (Ternary) Operators

Reviewing the Mashup Docs & Loading CSS

An Introduction to Lists

Making Selections

Revisiting Code Structure & Global Scope

SWITCH Recap: Redo, Undo and Clear

Bootstrap Modals

Creating Bookmarks

Finishing our Bookmarks

Some Code Cleanup

Current Selections

Array Prototype Reduce

Total Number of Selections

Search Bar

JQueryUI Autocomplete

Finishing Search Functionality

Recap on Tooltips

Bootstrap Grid & Placeholders

Finishing our Mashup Template

Download Finshed Code

Asynchronous Java Script

Callbacks & Asynchronous Java Script

Introduction to Promises

Introduction to Hypercubes

Introduction to Hypercubes

CreateCube Method & Rendering Data

Building a Table

Additional HyperCube Properties

Map Function & Adding a Second Measure

Adding Selections

PROJECT: Google Play Analytics Mashup

What We're Going to Build: Google Play Analytics Dashboard

Project Requirements

Creating our App & Loading Data

Starting our Mashup

Building Filters

Adding Selections

The Visualisation API

Creating KPIs

Adding Charts

Saving our Bookmarks

Filter State Colouring + Code Refactor

Introduction to Picasso JS

Picasso JS Documentation

Data for First Chart

Building our First Chart

Chart Brushing

Interactions

A Note on Hyperscript

Tooltips

Re-sizing and Finishing Touches

PROJECT: Avocado Analysis Mashup

Project Overview: Avocado Prices Mashup

Qlik Sense Version Update: April 2019

Download Starter Files

Starting our Avocado Analysis Mashup

Our Starter Charts

Bar Chart: Layering Components

Range Brushing

PicassoQ & Working with Data

Callbacks Method & Hypercubes

Picasso Q Plugin

Making Selections

Chart Linking with Promises

Cleaning up our HyperCubes

Async Await Syntax

EXERCISE: Line Chart

Trends Tab

EXERCISE: Complete Pie Chart

Discussing Websockets & Multi-Page Mashups

Download Completed Project

Introduction to Enigma JS

Engine API Explorer

An Introduction to Enigma JS

Client Side EnigmaJS: Accessing the Engine

Loading a HyperCube

A Note on QDT Components

PROJECT: KickStarter Mashup with Webpack & EnigmaJS

Project Overview: Kickstarter Mashup

Environment Setup

NodeJS v Node Package Manager

Java Script Runtime Link

What is Webpack?

Download Starter Files

Starting our Project with Webpack

Installing Babel

Loading Enigma & Accessing the Engine

Java Script Classes & Creating a Session Object

Line Chart Code

Building our PicassoJS Chart

Patch Properties

Theming our Chart

Starting our KPI Objects

Finishing our KPI Objects

Regular Expressions: MDN Web Docs

Trend Chart Code

Integrating our Trend Chart

Finishing our Mashup


Reviews

M
Mart11 May 2020

I'm a beginner in IT so I really had to learn from scratch. This course did a good job of showing me the different components that are involved with web development. I now know the basics of web development and also how to implement data and visualizations from Qlik into a browser. I did have to pause the video a lot because it was too quick for me at times.


2168354

Udemy ID

1/22/2019

Course created date

10/1/2020

Course Indexed date
AhmedELKING
Course Submitted by