<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0" xmlns:cc="http://cyber.law.harvard.edu/rss/creativeCommonsRssModule.html">
    <channel>
        <title><![CDATA[Stories by Yiannis Ververis on Medium]]></title>
        <description><![CDATA[Stories by Yiannis Ververis on Medium]]></description>
        <link>https://medium.com/@yiannisver?source=rss-62353883eb80------2</link>
        <image>
            <url>https://cdn-images-1.medium.com/fit/c/150/150/0*Ybn_LybqReiYG4Eo.</url>
            <title>Stories by Yiannis Ververis on Medium</title>
            <link>https://medium.com/@yiannisver?source=rss-62353883eb80------2</link>
        </image>
        <generator>Medium</generator>
        <lastBuildDate>Sat, 14 Nov 2026 08:32:00 GMT</lastBuildDate>
        <atom:link href="https://medium.com/@yiannisver/feed" rel="self" type="application/rss+xml"/>
        <webMaster><![CDATA[yourfriends@medium.com]]></webMaster>
        <atom:link href="http://medium.superfeedr.com/" rel="hub"/>
        <item>
            <title><![CDATA[Behind the scenes with bracketchallenge.qlik.com and Qlik Core]]></title>
            <link>https://medium.com/qlik-branch/behind-the-scenes-with-bracketchallenge-qlik-com-and-qlik-core-cf205f8632ae?source=rss-62353883eb80------2</link>
            <guid isPermaLink="false">https://medium.com/p/cf205f8632ae</guid>
            <category><![CDATA[qlik-core]]></category>
            <category><![CDATA[react]]></category>
            <category><![CDATA[data-visualization]]></category>
            <category><![CDATA[nodejs]]></category>
            <category><![CDATA[kubernetes]]></category>
            <dc:creator><![CDATA[Yiannis Ververis]]></dc:creator>
            <pubDate>Mon, 08 Apr 2019 20:41:40 GMT</pubDate>
            <atom:updated>2019-04-08T20:41:40.397Z</atom:updated>
            <content:encoded><![CDATA[<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*6FySVpZC1bgB72Z70Pi7DA.png" /></figure><p><strong>Introduction</strong></p><p>Most of you are probably aware and have already participated in the $100K competition, that Qlik has created for the College basketball tournament.</p><p>My colleague Arturo has a nice introduction on what the app is and how to get involved @ <a href="https://community.qlik.com/t5/Qlik-Design-Blog/Win-100K-The-Bracket-madness-has-started/ba-p/1558557">https://community.qlik.com/t5/Qlik-Design-Blog/Win-100K-The-Bracket-madness-has-started/ba-p/1558557</a></p><p>What very few are aware of, is how we designed the entire solution and why we picked each component.</p><p>The first and most important decision was about which Qlik product to use. We’ve decided on using Qlik Core, the Native cloud analytics development platform, because we needed to successfully handle thousands of concurrent users as fast as possible, in an independent cloud solution. The beauty of Qlik Core is that we take advantage of just the Qlik Associative Engine and we decide on the front end how to handle the data that comes from it. This makes the app ultra-fast since it is opening one WebSocket connection per user session and the data transferred are just simple json objects!</p><p>The second part we were worried about, was concurrency which leads to scalability. We needed to be able to handle thousands of concurrent users and if the server was reaching a certain percentage of Ram and Cpu, spin another one and route the new requests to the new server. That is where Qlik’s OSS awesome <a href="https://github.com/qlik-oss/core-scaling">core-scaling</a> repository came to be our key and the center of our solution.</p><p><strong>The Core-scaling Solution</strong></p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*jjcvNsLzgVBgypCE2DRdAQ.png" /></figure><p>This Github repository was the beginning and the foundation of the entire solution. I used Kubernetes as our container orchestrator and started with the main containers that R&amp;D has included in the public repo, Grafana, Prometheus, Custom Metrics Api, Nginx, Qix Session, Mira, License Service and the Qlik Engine. This repository is based on Google cloud, but I have made it work on Azure and AWS without any issues.</p><p>Now, each of these play a crucial role into the cluster and they are all needed.</p><p><strong>Custom Metrics Api</strong> is an Api service that is used to send metrics from various Kubernetes services to Prometheus. It is mostly required on the scaling part of the engines which is based on the average sessions.</p><p><strong>Prometheus</strong> is a service monitoring system that collects metrics from configured targets at given intervals. In our solution, we collect metrics from all of the servers so we can monitor performance and alert any issues, infrastructure or software related.</p><p><strong>Grafana</strong> is a dashboard for visual representations of the metrics that we are collecting. In the repo you will find a custom json dashboard for the engines. You can view the resources utilized, total current sessions vs sessions per engine etc. I have included one more dashboard to monitor the health of the entire cluster, like the total Ram and Cpu used of all the services and totals for each one.</p><p><strong>Nginx Ingress</strong> controller is a reverse proxy that handles all the security and traffic flow to the cluster. I will explain later a common user flow to the cluster.</p><p><strong>Qix Session</strong> handles the placement based on custom metrics and set up of a session.</p><p><strong>Mira</strong> is a Qlik Associative Engine discovery service for containerized environments. Mira finds the available Qlik Associative Engine instances and the properties of each instance.</p><p><strong>License Service</strong> checks the license expiration or token consumption.</p><p><strong>Qlik Associative Engine</strong> is the central service in the Qlik Core stack. It is designed specifically for interactive, free-form exploration and analysis. It fully combines large numbers of data sources and indexes them to find the possible associations, without leaving any data behind.</p><p>Once I had the initial repo, I created a cluster in Azure and I started deploying. You can do the same by following this guide to create the cluster <a href="https://community.qlik.com/t5/Qlik-Design-Blog/Azure-Kubernetes-Services-and-Qlik-Core/ba-p/1515128">https://community.qlik.com/t5/Qlik-Design-Blog/Azure-Kubernetes-Services-and-Qlik-Core/ba-p/1515128</a>.</p><p>There are 2 ways of deploying to any kubernetes cluster, Microsoft, Amazon or Google. Either by following the instruction in core-scaling repository <a href="https://github.com/qlik-oss/core-scaling">https://github.com/qlik-oss/core-scaling</a> and using kubectl commands to deploy the yaml files, or by using helm charts which I have created in <a href="https://github.com/yianni-ververis/core-scaling-helm">https://github.com/yianni-ververis/core-scaling-helm</a> repository.</p><p><strong>Customizing the Solution</strong></p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*pjvRyXxT6UrGWHhfTmrwvQ.png" /></figure><p>OK, we have Qlik Core and the Grafana dashboard where we can view the user sessions and they are all deployed in the Kubernetes cluster but what about the rest of the application? We need to host the mashups, get statistical data for each basketball game, handle user authentications and store users, their profiles and their brackets.</p><p>The first part with the websites was the easiest one. We’ve just created one docker image for bracketchallenge and one for bracketguru. We bound the DNSs to the cluster and let Nginx Ingress controller route the traffic based on the domain. So, if you typed in the URL bracketchallenge.qlik.com you will be redirected internally to the qdt-bracketchallenge server and if you typed bracketguru.qlik.com, you will be redirected to the qdt-bracketguru server.</p><p>Now that we got the websites’ physical location out of the way, the next question is how are going to handle authentication, with focus on security and data integrity. We created a Nodejs API server that handles the user authentication, creates sessions, checks and writes into the database the user data like profile and the desired bracket. It is also used to handle the authentication for stats.com and feed the desired stats to Qlik Sense. Then, created another docker image and pulled it in our Kubernetes cluster.</p><p>Each server is sending data to the Custom Metrics Api server which then are stored in Prometheus. Then we use Grafana to view all the stats on the Qlik Associative Engine like how many current sessions we have open, what is the distribution on the running Associative Engines, how much memory and Cpu is consumed on each one etc. These sessions are critical on determining how many Associative Engines to run. Kubernetes has a controller called HPA (Horizontal Pod Autoscaler). This, based on some metrics, in our case the Sessions, decides when to spin another pod / engine. We set the Qlik Associative Engines not to accept more than 3000 sessions and when we are averaging 1750 sessions per engine, then we need the HPA to start another engine and start sending new sessions there. You need to fine tune those settings to match your qvfs and what works better with the Ram usage. You can max the HPA to how ever many pods your cluster can take. If you combine this with a Kubernetes Cluster Autoscaler, you can have infinite amount of sessions! The only limit would be of course your budget. :smileyvery-happy:</p><p>Having all of the puzzle pieces together, let’s see what a user flow will be like. First you will type the url to bracketchallenge.qlik.com. Nginx will route your request to the bracketchallenge server where it will send you back the authentication page. From there, login or create a user, the mashup will send, in both scenarios, your request to the Api Server, which will validate you against the database and issue a session token. Once the React webpage gets your session and validates it for its integrity, you are guided to the bracket page. There, a new request is sent to the cluster and more specifically to the Nginx Ingress controller where it will redirect it to the Qix Session server and initiate a Websocket connection with a new session. Once we have established a session, we go to Mira to see our available Associative Engines and place our connection to the most appropriate one. I need to make a side note here, that Mira sees and utilizes the availability of the Qlik Associative Engines, only ifs they have been cleared by the License Service and that the license provided in the cluster, has not expired or the number of tokens have not been completely consumed. Once the Websocket connection has established, enigma.js opens the app and gets a hypercube with the available teams.</p><p><strong>Conclusion</strong></p><p>Qlik as a leader in the BI world, has many products that are here to transform your business. Bracketchallenge.qlik.com is one example that utilizes the latest platform, Qlik Core. Qlik Core is taking the Qlik Associative Engine into your cloud and making it part of your business infrastructure. Even though this solution is on AWS, you can still use it on Microsoft Azure or Google Cloud. It does not have to be on Kubernetes either. Qlik OSS has examples for Docker swarm and Nomad <a href="https://core.qlik.com/tutorials/orchestration/">https://core.qlik.com/tutorials/orchestration/</a></p><p>This journey was a tremendous experience for me as a developer and I gained a lot. I hope you enjoyed this article as much as I did and if you have any questions, feel free to drop me a note. If you have not done so, please join our community of developers in qlik-branch.slack.com and subscribe to the #qlik-core channel.</p><p>Yianni</p><p>**************</p><p><em>Editors Note: This blog originally </em><a href="https://community.qlik.com/t5/Qlik-Design-Blog/Behind-the-scenes-with-bracketchallenge-qlik-com-and-Qlik-Core/ba-p/1565369"><em>posted via Qlik Community</em></a><em> this past Friday, 4/5. But since the NCAA championship is tonight, we thought it deserved a refresh to our dev community who may have missed it. Thanks for reading + commenting + clapping!</em></p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=cf205f8632ae" width="1" height="1" alt=""><hr><p><a href="https://medium.com/qlik-branch/behind-the-scenes-with-bracketchallenge-qlik-com-and-qlik-core-cf205f8632ae">Behind the scenes with bracketchallenge.qlik.com and Qlik Core</a> was originally published in <a href="https://medium.com/qlik-branch">Qlik Branch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Qdt-components — latest additions]]></title>
            <link>https://medium.com/qlik-branch/qdt-components-latest-additions-d143c07462b3?source=rss-62353883eb80------2</link>
            <guid isPermaLink="false">https://medium.com/p/d143c07462b3</guid>
            <category><![CDATA[javascript]]></category>
            <category><![CDATA[qlik]]></category>
            <category><![CDATA[api]]></category>
            <category><![CDATA[component-libraries]]></category>
            <category><![CDATA[data-visualization]]></category>
            <dc:creator><![CDATA[Yiannis Ververis]]></dc:creator>
            <pubDate>Mon, 03 Dec 2018 17:05:38 GMT</pubDate>
            <atom:updated>2018-12-03T17:21:14.858Z</atom:updated>
            <content:encoded><![CDATA[<h3>Qdt-components —The Latest Additions</h3><blockquote>Qdt-components is a library that we’ve created to support the Demo Team’s work. And it’s awesome…</blockquote><p>ℹ️ <strong>In the past, I talked about how we can use it with </strong><a href="https://branch-blog.qlik.com/qdt-components-%EF%B8%8F-a-components-library-that-can-be-used-in-simple-html-angular-6-react-and-vue-7c1e3178d00c"><strong>various frameworks</strong></a><strong> like simple Html, Angular 5 and React‌ as well as a </strong><a href="https://branch-blog.qlik.com/qlik-sense-wordpress-plugin-ade9d3eddb92"><strong>Wordpress plugin</strong></a><strong>.‌</strong></p><p>ℹ️ <a href="https://branch-blog.qlik.com/qdt-components-picasso-js-more-charts-b80977d9c8eb"><strong>I have also shared with you how some of the components with examples on how to use them with picasso.js</strong></a><strong>.</strong></p><blockquote>Since these, we have added some more components! Below are the latest additions with examples on how to use them in your websites. Here are the latest additions with v1.3.5…</blockquote><ul><li><a href="https://webapps.qlik.com/qdt-components/react/index.html#/stacked-barchart"><strong>Stacked Bar Chart</strong></a></li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/1*AS2Kb9t_Z4kaxY6-v8KTPw.png" /></figure><ul><li><a href="https://webapps.qlik.com/qdt-components/react/index.html#/embed-object-multi-app"><strong>How to Embed object from 2 different apps</strong></a></li><li><a href="https://webapps.qlik.com/qdt-components/react/index.html#/table"><strong>Table with the Visualization API</strong></a></li><li><a href="https://webapps.qlik.com/qdt-components/react/index.html#/table-engine"><strong>Table with the Engine API</strong></a></li><li><a href="https://webapps.qlik.com/qdt-components/react/index.html#/search"><strong>Search with the results in the dropdown from the Engine API</strong></a></li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/1*Poi3GE4Z0wSjc5A9B4O6-A.png" /></figure><ul><li><a href="https://webapps.qlik.com/qdt-components/react/index.html#/filters"><strong>Custom Filters as a Dropdown, as a list object or as a horizontal tabular menu</strong></a></li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/1*kB3-rCC2DFdCYDq-1IHr4A.png" /></figure><ul><li><a href="https://webapps.qlik.com/qdt-components/react/index.html#/gauge"><strong>Vertical Gauge indicators with Picasso.js</strong></a></li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/1*ALsNdqrKW-MBSilQURqkKQ.png" /></figure><ul><li><a href="https://webapps.qlik.com/qdt-components/react/index.html#/picasso-range-area-chart"><strong>Range Area with Picasso.js</strong></a></li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/1*wIg3Q3SLg0aymLM3YQtajw.png" /></figure><ul><li><a href="https://webapps.qlik.com/qdt-components/react/index.html#/picasso-custom-chart"><strong>Create your custom chart based on the already predefined components</strong></a></li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/1*BzQ5zg9zIlL7IL8uqTW7Kw.png" /></figure><blockquote>Enjoy! And let me know if you have any questions in the comments.</blockquote><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=d143c07462b3" width="1" height="1" alt=""><hr><p><a href="https://medium.com/qlik-branch/qdt-components-latest-additions-d143c07462b3">Qdt-components — latest additions</a> was originally published in <a href="https://medium.com/qlik-branch">Qlik Branch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Developing for Good — Team Rubicon and qdt-components]]></title>
            <link>https://medium.com/qlik-branch/developing-for-good-team-rubicon-and-qdt-components-13b569e82de8?source=rss-62353883eb80------2</link>
            <guid isPermaLink="false">https://medium.com/p/13b569e82de8</guid>
            <category><![CDATA[enigmajs]]></category>
            <category><![CDATA[qlik-sense]]></category>
            <category><![CDATA[team-rubicon]]></category>
            <category><![CDATA[qdt-components]]></category>
            <dc:creator><![CDATA[Yiannis Ververis]]></dc:creator>
            <pubDate>Fri, 12 Oct 2018 15:12:09 GMT</pubDate>
            <atom:updated>2018-10-12T15:12:09.579Z</atom:updated>
            <content:encoded><![CDATA[<h3>Developing for Good — Team Rubicon and qdt-components</h3><p>This Summer, Julie Whipple blogged about Qlik’s partnership with Team Rubicon. She talked described how we helped Team Rubicon by creating an amazing mashup which gives the world a view of the awesome job Team Rubicon, it’s partners, and countless volunteers are doing around the world. You can find Julie’s blog here: <a href="https://blog.qlik.com/the-value-of-data-team-rubicon-and-qlik">The Value of Data — Team Rubicon and Qlik | Qlik Blog</a></p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*JuzDiTbCpXZuE7nC.png" /><figcaption>For more information, visit <a href="https://teamrubiconusa.org/">https://teamrubiconusa.org/</a></figcaption></figure><p>Even though the data is complex, using Qlik Sense to bring it all together in one view was like a walk in the park, too easy!</p><p>Once the data was uploaded into a Qlik Sense app, we setup the entire mashup using the <a href="https://github.com/qlik-demo-team/qdt-react-template">qdt-react-template</a>. We set up the pages and the routes and then used <a href="https://github.com/qlik-demo-team/qdt-components">qdt-components</a> to connect to the server and get the KPIs, Charts and Maps. In order to that, all we needed is the config to server <a href="https://github.com/qlik-demo-team/qdt-react-template/blob/master/src/components/QdtComponent.jsx">https://github.com/qlik-demo-team/qdt-react-template/blob/master/src/components/QdtComponent.jsx</a> and we were ready to go!</p><p>We are so thrilled to use our awesome products to make a difference. In general, developing is fun, really fun. When you add in the fact that what we develop is having a positive impact on the world, it makes us proud to be part of such a great company.</p><p>Check out the Team Rubicon — Open Initiative project: <a href="https://teamrubiconusa.org/open/">https://teamrubiconusa.org/open/</a></p><p>Here are some helpful links referenced above:<br>qdt-react-template: <a href="https://github.com/qlik-demo-team/qdt-react-template">https://github.com/qlik-demo-team/qdt-react-template</a><br>Examples: <a href="https://webapps.qlik.com/qdt-components/react/index.html">https://webapps.qlik.com/qdt-components/react/index.html#/</a><br>qdt-components: <a href="https://github.com/qlik-demo-team/qdt-components">https://github.com/qlik-demo-team/qdt-components</a></p><p>Best,</p><p>Yianni</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=13b569e82de8" width="1" height="1" alt=""><hr><p><a href="https://medium.com/qlik-branch/developing-for-good-team-rubicon-and-qdt-components-13b569e82de8">Developing for Good — Team Rubicon and qdt-components</a> was originally published in <a href="https://medium.com/qlik-branch">Qlik Branch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Qdt-components & picasso.js — More Charts!]]></title>
            <link>https://medium.com/qlik-branch/qdt-components-picasso-js-more-charts-b80977d9c8eb?source=rss-62353883eb80------2</link>
            <guid isPermaLink="false">https://medium.com/p/b80977d9c8eb</guid>
            <category><![CDATA[mashups]]></category>
            <category><![CDATA[qlik-sense]]></category>
            <category><![CDATA[data-visualization]]></category>
            <category><![CDATA[dataviz]]></category>
            <dc:creator><![CDATA[Yiannis Ververis]]></dc:creator>
            <pubDate>Fri, 27 Jul 2018 16:51:45 GMT</pubDate>
            <atom:updated>2018-07-27T19:17:51.349Z</atom:updated>
            <content:encoded><![CDATA[<p>We have been adding more features to our qdt-components and some of these are the latest <a href="https://picassojs.com/">picasso.js</a> charts.</p><p>This story details the charts that we have so far…</p><p>You can also interact with them live on our <a href="https://webapps.qlik.com/qdt-components/react/index.html">react template</a>.</p><ul><li>You can embed any object from Qlik Sense and the Capability API</li><li>You can create any custom session object by defining your own definition properties like dimension, measures, title, subtitle, color, order, etc.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/0*HyNdyL12OeMwPCae.png" /></figure><ul><li>There is a custom selection toolbar that we use extensively in our mashups.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/0*egNLEOGIdvY1D8t3.png" /></figure><ul><li>A picasso.js horizontal bar that detects the height of the div. Once the bars exceed that, it adds a scrollbar. It also features multiple selections and tooltip.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/0*3Sx8ZG45CUTfG5l-.png" /></figure><ul><li>The same idea but with vertical bars.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/0*Crcqu6yipz2vRlGO.png" /></figure><ul><li>A new picasso.js pie chart with legend, multiple selections and tooltip.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/0*IgXWmuPbjIo6o0_Y.png" /></figure><ul><li>A new scotterplot with multiple selections, tooltip and legend.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/0*hxpDuum7W97YPykg.png" /></figure><ul><li>And now the latest addition, a scotterplot with custom images.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/0*oQVQ7lon-UlmWp5j.png" /></figure><ul><li>A simple line chart.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/0*Y1NQUkQRapgvCw5V.png" /></figure><ul><li>A combo chart</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/1*zEwyBpJo90uroKD_mMT3dg.png" /></figure><p>More coming soon with this amazing library! Stay tuned.</p><p>— Yianni</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=b80977d9c8eb" width="1" height="1" alt=""><hr><p><a href="https://medium.com/qlik-branch/qdt-components-picasso-js-more-charts-b80977d9c8eb">Qdt-components &amp; picasso.js — More Charts!</a> was originally published in <a href="https://medium.com/qlik-branch">Qlik Branch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[qdt-components ➡️ A Components Library That Can Be Used in Simple Html, Angular 6, React and Vue]]></title>
            <link>https://medium.com/qlik-branch/qdt-components-%EF%B8%8F-a-components-library-that-can-be-used-in-simple-html-angular-6-react-and-vue-7c1e3178d00c?source=rss-62353883eb80------2</link>
            <guid isPermaLink="false">https://medium.com/p/7c1e3178d00c</guid>
            <category><![CDATA[data-science]]></category>
            <category><![CDATA[data-visualization]]></category>
            <category><![CDATA[angularjs]]></category>
            <category><![CDATA[javascript]]></category>
            <category><![CDATA[vuejs]]></category>
            <dc:creator><![CDATA[Yiannis Ververis]]></dc:creator>
            <pubDate>Fri, 08 Jun 2018 13:29:01 GMT</pubDate>
            <atom:updated>2018-06-08T13:39:55.515Z</atom:updated>
            <content:encoded><![CDATA[<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*NA0p4GbffftND_5T7VqMNQ.jpeg" /></figure><blockquote><strong>qdt-components</strong> (aka Qlik Demo Team Components) is a library of components that we have developed within the Demo Team. These have been used in most of our mashups found in <a href="https://webapps.qlik.com/">webapps.qlik.com</a> and <a href="https://demos.qlik.com/qliksense">demos.qlik.com</a>.</blockquote><p>It’s a collection of filters, tables, bar charts, selection toolbars and even simple getting/creating object methods from the Visualization API. You do not have to worry about connection strings, loading RequireJS, jQuery, etc.</p><blockquote>Basically, with this library everything is taken care of for you! The library can be used in a simple html page by loading the qdt-components.js or in React and Angular2+ via npm.</blockquote><p><strong>Today, I will show you how to load a simple object and create a session bar chart, in simple html and Angular 5.</strong></p><h4>✨ <strong>Simple html</strong></h4><ul><li>In your html add…</li></ul><pre>&lt;head&gt;<br>   &lt;script type=&quot;text/javascript&quot; src=&quot;qdt-components.js&quot;&gt;&lt;/script&gt;<br>&lt;/head&gt;<br>&lt;body&gt;<br>   &lt;div id=&quot;qdt1&quot;&gt;&lt;/div&gt;<br>&lt;/body&gt;</pre><ul><li>In your Javascript code, add…</li></ul><pre>var qConfig = {<br>   &quot;config&quot;: {<br>      &quot;host&quot;: &quot;your-sense-server.com&quot;,<br>      &quot;secure&quot;: true,<br>      &quot;port&quot;: 443,<br>      &quot;prefix&quot;: &quot;/&quot;,<br>      &quot;appId&quot;: &quot;133dab5d-8f56-4d40-b3e0-a6b401391bde&quot;<br>   },<br>   &quot;connections&quot;: {<br>      &quot;vizApi&quot;: true,<br>      &quot;engineApi&quot;: false<br>   }<br>}</pre><pre>var QdtComponent = new window.qdtComponents.default(qConfig.config, qConfig.connections);</pre><pre>var element = document.getElementById(&#39;qdt1&#39;);</pre><pre>QdtComponent.render(&#39;QdtViz&#39;, {id: &#39;a5e0f12c-38f5-4da9-8f3f-0e4566b28398&#39;, height:&#39;300px&#39;}, element);</pre><p><strong>More resources! </strong>Here’s a <a href="https://github.com/qlik-demo-team/qdt-html-template">simple html template we have on GitHub</a> and here’s a <a href="https://webapps.qlik.com/qdt-components/plain-html/index.html">live demo</a> of this in action.</p><h4>✨ <strong>Angular 5</strong></h4><ul><li>Install <a href="https://cli.angular.io/">Angular cli</a> or get the prepared template</li><li>Install the package…</li></ul><pre>npm install --save qdt-components</pre><ul><li>Create new component by typing in the command line…</li></ul><pre>ng generate component components/qdt-components --style=less</pre><ul><li>In your qdt-component.component.ts import the library and import or set the qConfig with the connection details…</li></ul><pre>import { Component, OnInit, ElementRef, Input } from &#39;@angular/core&#39;;<br>// import * as qConfig from &#39;../../../qConfig.json&#39;;<br>import QdtComponents from &#39;qdt-components&#39;;</pre><pre>let qConfig = {<br>   &quot;config&quot;: {<br>      &quot;host&quot;: &quot;your-sense-server.com&quot;,<br>      &quot;secure&quot;: true,<br>      &quot;port&quot;: 443,<br>      &quot;prefix&quot;: &quot;/&quot;,<br>      &quot;appId&quot;: &quot;133dab5d-8f56-4d40-b3e0-a6b401391bde&quot;<br>   },<br>   &quot;connections&quot;: {<br>      &quot;vizApi&quot;: true,<br>      &quot;engineApi&quot;: false<br>   }<br>}</pre><ul><li>Replace the class with…</li></ul><pre>export class QdtComponentComponent implements OnInit {</pre><pre>@Input() Component: Function;</pre><pre>@Input() props: object;</pre><pre>static QdtComponent = new QdtComponents(qConfig.config, qConfig.connections);</pre><pre>constructor(private elementRef: ElementRef) { }</pre><pre>ngOnInit() {</pre><pre>   QdtComponentComponent.QdtComponent.render(&#39;QdtViz&#39;, this.props, this.elementRef.nativeElement);</pre><pre>}<br>}</pre><ul><li>After this, you can start using it in any other component. In the html, add…</li></ul><pre>&lt;qdt-component [Component]=&quot;QdtViz&quot; [props]=&quot;{id: &#39;a5e0f12c-38f5-4da9-8f3f-0e4566b28398&#39;, height:&#39;300px&#39;}&quot;&gt;&lt;/qdt-component&gt;</pre><p><strong>More resources! </strong>Here’s an <a href="https://github.com/qlik-demo-team/qdt-angular-template">Angular template we have on GitHub</a> and here are some live demos…</p><ul><li><a href="https://webapps.qlik.com/qdt-components/angular5/index.html"><strong>Live Demo Angular 5</strong></a></li><li><a href="https://webapps.qlik.com/qdt-components/angular/index.html"><strong>Live Demo Angular 6</strong></a></li></ul><blockquote><strong>You can also use qdt-components with React and Vue. Here’s a </strong><a href="https://webapps.qlik.com/qdt-components/react/index.html"><strong>live demo using React 16.3</strong></a><strong> (</strong><a href="https://github.com/qlik-demo-team/qdt-react-template"><strong>Git Repo</strong></a><strong>) and here’s a </strong><a href="https://webapps.qlik.com/qdt-components/vue/index.html"><strong>live demo using Vue 2.5</strong></a><strong> (</strong><a href="https://github.com/qlik-demo-team/qdt-vue-template"><strong>Git Repo</strong></a><strong>).</strong></blockquote><h4>✨ Looking for more? See these other resources for working with <strong>qdt-components</strong></h4><ul><li><a href="http://branch.qlik.com/#!/project/5a74c32bb6de3b187d84d4e2">Qlik Branch</a></li><li><a href="https://github.com/qlik-demo-team/qdt-components">GitHub</a></li><li><a href="https://www.npmjs.com/package/qdt-components">Npm: qdt-components‌</a></li></ul><blockquote>Let me know if you have any questions in the comments! You can also reach out via <a href="http://branch.qlik.com/slack">Qlik Branch Slack</a> (at)yianniververis.</blockquote><p>— Yianni</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=7c1e3178d00c" width="1" height="1" alt=""><hr><p><a href="https://medium.com/qlik-branch/qdt-components-%EF%B8%8F-a-components-library-that-can-be-used-in-simple-html-angular-6-react-and-vue-7c1e3178d00c">qdt-components ➡️ A Components Library That Can Be Used in Simple Html, Angular 6, React and Vue</a> was originally published in <a href="https://medium.com/qlik-branch">Qlik Branch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Bike.qlik.com]]></title>
            <link>https://medium.com/qlik-branch/bike-qlik-com-6de850bd9171?source=rss-62353883eb80------2</link>
            <guid isPermaLink="false">https://medium.com/p/6de850bd9171</guid>
            <category><![CDATA[programming]]></category>
            <category><![CDATA[developer-tools]]></category>
            <category><![CDATA[open-source]]></category>
            <category><![CDATA[developer]]></category>
            <category><![CDATA[nodejs]]></category>
            <dc:creator><![CDATA[Yiannis Ververis]]></dc:creator>
            <pubDate>Fri, 18 May 2018 13:11:39 GMT</pubDate>
            <atom:updated>2018-05-18T13:15:17.729Z</atom:updated>
            <content:encoded><![CDATA[<h3><a href="https://community.qlik.com/blogs/qlikviewdesignblog/2018/04/27/bikeqlikcom-the-beauty-of-qliks-open-source-with-qlik-core-enigmajs-picassojs-and-qdt-components">Bike.qlik.com — The beauty of Qlik’s Open Source with Qlik Core, Enigma.js, Picasso.js and Qdt-components</a></h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*TGvflMQKerT8mYUcHbBIqw.png" /></figure><blockquote>Hopefully you all attended <strong>Qonnections 2018</strong> and saw Jimmie on the bike!!!</blockquote><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*2-zyGrlJV5KUC2MuVdo5NQ.jpeg" /></figure><blockquote><a href="http://bike.qlik.com/"><strong>Bike.qlik.com </strong></a><strong>is the latest mashup built entirely with Qlik’s open source libraries, </strong><a href="https://www.qlik.com/us/products/qlik-core"><strong>Qlik Core</strong></a><strong>, </strong><a href="https://github.com/qlik-oss/enigma.js"><strong>Enigma.js</strong></a><strong>, </strong><a href="https://github.com/qlik-oss/picasso.js"><strong>Picasso.js</strong></a><strong>, </strong><a href="https://qlik-oss.github.io/leonardo-ui/"><strong>Leonardo UI</strong></a><strong> and the Demo Team’s </strong><a href="https://github.com/qlik-demo-team/qdt-components"><strong>Qdt-components</strong></a><strong>.</strong></blockquote><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*gscGAC0hFRAa8h4untY8ZA.png" /></figure><h3>Here is (briefly) how we did it…</h3><ul><li>Sensors are sending data wirelessly to the Raspberry Pi</li><li>Node.js reads and writes the csv</li><li><strong>Qlik Core</strong> in Raspberry Pi is reading the csv with a reload script and saves the data</li><li><strong>Enigma.js </strong>connects and gets the data from <strong>Qlik Core</strong> then <strong>Picasso.js</strong> displays that data in a graphical format</li><li>Node.js uploads the qvds on <strong>bike.qlik.com</strong></li><li><strong>Bike.qlik.com</strong> is a Docker that runs two containers in an AWS EC2 instance — one for the <strong>Qlik Core</strong> / Engine and another for an <strong>apache</strong> server</li><li>The htdocs and the apps for the <strong>Qlik Core</strong>, are mounted outside of the two containers so there is no need to reload containers or recreate the Docker images, once the html code is changed or the qvf is updated</li><li>Once uploaded, a Node.js restful API endpoint reloads the session app, reads the new data from the just uploaded qvds and saves the qvf with the new data</li><li><strong>React.js</strong> with <strong>Qdt-components</strong> is connecting to <strong>Qlik Core</strong> on the server and is getting the data</li><li><strong>Qdt-components</strong> is rendering <strong>11 KPI components </strong>and one <strong>search</strong> components on the Rider field</li><li><strong>Picasso.js</strong> is used to read the data and displays a <strong>scatter plot</strong> and a <strong>line chart</strong> with tooltip and multiple selections</li></ul><blockquote>Expect more examples in the coming future with these combinations of our Open Source Software! In the meantime, explore the <a href="https://qlikcore.com/docs/getting-started/">Qlik Core Beta getting started guide</a> to learn the basic concepts.</blockquote><p>— Yianni</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=6de850bd9171" width="1" height="1" alt=""><hr><p><a href="https://medium.com/qlik-branch/bike-qlik-com-6de850bd9171">Bike.qlik.com</a> was originally published in <a href="https://medium.com/qlik-branch">Qlik Branch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[QlikBotNode for Microsoft Skype]]></title>
            <link>https://medium.com/qlik-branch/qlikbotnode-for-microsoft-skype-a59eae9ed736?source=rss-62353883eb80------2</link>
            <guid isPermaLink="false">https://medium.com/p/a59eae9ed736</guid>
            <category><![CDATA[salesforce]]></category>
            <category><![CDATA[nodejs]]></category>
            <category><![CDATA[bots]]></category>
            <category><![CDATA[microsoft]]></category>
            <category><![CDATA[skype]]></category>
            <dc:creator><![CDATA[Yiannis Ververis]]></dc:creator>
            <pubDate>Fri, 05 Jan 2018 19:49:27 GMT</pubDate>
            <atom:updated>2018-01-05T19:49:54.621Z</atom:updated>
            <content:encoded><![CDATA[<figure><img alt="" src="https://cdn-images-1.medium.com/max/674/1*YwRDrsBKiz3L4Dn7Blcz6Q.jpeg" /></figure><p>Last month I talked about our new QlikBotNode, setting it up and getting it ready for Telegram with <a href="https://branch-blog.qlik.com/qlik-sense-bot-with-node-js-and-enigma-js-2a47e738dfd7">this post on the Qlik Branch Blog</a> and this one on <a href="https://community.qlik.com/blogs/qlikviewdesignblog/2017/12/12/qlik-sense-bot-with-nodejs">Qlik Community</a>.</p><blockquote>Today, I will talk about the steps needed to make your bot available for Microsoft Skype as well!</blockquote><p>With this, I’m assuming that you have already forked the code from <a href="https://github.com/qlik-bots/QlikBotNode">GitHub</a> and have already went through the previous tutorial and set up for the Telegram bot (see links above)….</p><blockquote>Now, let’s get started! 🏁</blockquote><h3><strong>The Installation</strong></h3><ul><li>First you need to “Register a Bot with Bot Service”. Login to the <strong>Azure Portal </strong>at<strong> </strong><a href="http://portal.azure.com/">http://portal.azure.com/</a></li><li>Click the <strong>New</strong> button found on the upper left-hand corner of the Azure Portal, then select <strong>AI + Cognitive Services &gt; Bot Channels Registration</strong></li><li>Click the <strong>Create</strong> button to start the creation process</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/295/0*By-S5BR_fUhOpqiW.png" /></figure><ul><li>Enter a <strong>Bot Name</strong> as you want to appear in your contact list</li><li>You can use the free Pricing Tier for testing</li><li>For the Messaging Point add your full route like <a href="https://medium.com/"><strong>https://</strong></a><strong>{your-server}/api/sense-bot/microsoft/</strong></li><li>You can skip the Application Insight for now</li><li>Once registered, go to settings and get the <strong>AppId</strong> and the <strong>Password</strong>. You will need to add them in your environmental variables</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/527/0*3x39aNEvM3uDg16D.png" /></figure><ul><li>Click on <strong>Manage</strong> to get the password</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/800/0*Xz7jK_WmikzAOpQe.png" /></figure><ul><li>Put the <strong>AppId</strong> and <strong>Password</strong> in your Environmental variables</li><li>For Windows, go to “<strong>Control Panel</strong>” -&gt; “<strong>System</strong>” -&gt; “<strong>Advanced System Settings</strong>” -&gt; “<strong>Environment Variables</strong>”</li><li>For Linux, from your directory (~), type “<strong>nano .bash_profile</strong>” or “<strong>vim .bash_profile</strong>” and enter the variables there like</li><li>export SKYPE_BOT_ID_SCV=’’</li><li>export SKYPE_BOT_PASSWORD_SVC=’’</li><li>While still in settings, go to “channel” and add Skype</li></ul><blockquote>Thats it! You’re done! 🏁 And for more Details on <strong>Register a bot with Bot Service, </strong><a href="https://docs.microsoft.com/en-us/bot-framework/bot-service-quickstart-registration">go here</a><strong>.</strong></blockquote><h3><strong>Now, let’s talk about Usage</strong></h3><ul><li>Type <strong>help</strong> for all of the available commands</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/659/0*U510oTrzxU7rCq61.png" /></figure><ul><li>Click on <strong>Salesforce</strong> to get the available commands for the Salesforce App and then click on the <strong>Dashboard</strong> to get a list of KPIs</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/651/0*NZ9ViqsrXnC7UAco.png" /></figure><ul><li>Click on <strong>CIO Dashboard</strong> and then on <strong>Management</strong></li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/546/0*U6j_zxqrK_uu40uq.png" /></figure><ul><li>If you want to change your language click on <strong>Language</strong> and select one of the available ones. So far we have 3 — <strong>English</strong>, <strong>Spanish</strong> and <strong>Greek</strong> but please feel free to add as many as you want.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/649/0*RTMeEC9lXCrnIJn8.png" /></figure><blockquote>And that’s it for usage! 🏁</blockquote><h3>But one more pro tip…</h3><p>Make sure you follow the list below. They’re phenomenal resources and we’re here to help.</p><ul><li><a href="https://github.com/qlik-bots/QlikBotNode">QlikBotNode on GitHub</a></li><li><a href="https://github.com/yianni-ververis/QlikBotNode/blob/master/docs/Skype.md">QlikBotNode/Skype.md at master · yianni-ververis/QlikBotNode · GitHub</a></li><li><a href="http://branch.qlik.com/#!/project/5a2fd27d444ec6f5997b3829">Qlik Branch</a> (project details)</li><li><a href="http://qlikbranch-slack-invite.herokuapp.com/">Qlik Branch Slack Community</a></li><li><a href="https://community.qlik.com/groups/qlik-chatbots">Qlik Community QlikBot Group</a></li><li><a href="https://twitter.com/yianni_ververis">(@yianni_ververis) | Twitter</a></li></ul><p>Best,</p><p>Yianni</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=a59eae9ed736" width="1" height="1" alt=""><hr><p><a href="https://medium.com/qlik-branch/qlikbotnode-for-microsoft-skype-a59eae9ed736">QlikBotNode for Microsoft Skype</a> was originally published in <a href="https://medium.com/qlik-branch">Qlik Branch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[QlikBotNode with Node.js and Enigma.js]]></title>
            <link>https://medium.com/qlik-branch/qlik-sense-bot-with-node-js-and-enigma-js-2a47e738dfd7?source=rss-62353883eb80------2</link>
            <guid isPermaLink="false">https://medium.com/p/2a47e738dfd7</guid>
            <category><![CDATA[bots]]></category>
            <category><![CDATA[telegraph]]></category>
            <category><![CDATA[nodejs]]></category>
            <category><![CDATA[enigma]]></category>
            <category><![CDATA[telegram]]></category>
            <dc:creator><![CDATA[Yiannis Ververis]]></dc:creator>
            <pubDate>Mon, 11 Dec 2017 16:34:52 GMT</pubDate>
            <atom:updated>2017-12-12T18:46:31.269Z</atom:updated>
            <content:encoded><![CDATA[<figure><img alt="" src="https://cdn-images-1.medium.com/max/674/1*VMl-imWtHN9AAIvRJJvNdg.jpeg" /></figure><h3>Hello everyone! Let’s talk about QlikBots.</h3><blockquote>Today, Qlik is releasing two open source QlikBot projects on <a href="http://branch.qlik.com/#!/project">Qlik Branch</a> and <a href="https://github.com/qlik-bots">GitHub</a>. 👍</blockquote><ul><li><a href="http://branch.qlik.com/#!/project/5a2fd27d444ec6f5997b3829"><strong>QlikBotNode</strong></a><strong>: </strong>A web service built in Node.js, Express.js and MySql that can connect to messaging platforms like Telegram, Skype, Microsoft Teams, Cortana, Slack, Google Assistant and Amazon Alexa.</li><li><a href="http://branch.qlik.com/#!/project/5a2fb8474666f1a641bc8e76"><strong>QlikBotNet</strong></a><strong>: </strong>Built in .NET/C# and provides access to Qlik Sense content. It can also be used with the Telegram messaging platform. More details on that one <a href="https://branch-blog.qlik.com/all-you-need-to-know-about-qlikbotnet-b86b455f0e10">here</a>.</li></ul><blockquote>And specifically, let’s talk about QlikBotNode.</blockquote><p>Based on the popularity of Juan Gerardo’s QlikBot for Telegram written all in C#, I created this QlikBot in JavaScript with <a href="https://nodejs.org/en/">Node.js</a>‌ and <a href="https://github.com/qlik-oss/enigma.js">Enigma.js</a>. So what’s the difference between this and QlikBotNet? Besides the obvious difference in programming languages, QlikBotNode is a little simpler to use. You just click buttons to get info whereas with QlikBotNet, users can type their own questions such as “Could you show me the cost by family?”</p><blockquote>So, while QlikBotNet may be more powerful for analysis, QlikBotNode provides quick and easy access to KPIs.</blockquote><h3>Now, let’s create your own chatbot with QlikBotNode.</h3><p>Below details how to get started creating your own QlikBotNode for <a href="https://telegram.org/">Telegram</a> on any operating system that has Node.js installed.</p><ul><li>The server will be running under https so if you do not have valid certificates for your domain (or localhost if you are testing it on your local computer), you can have Qlik Sense Enterprise take care of that for you. From QMC, go to start-&gt;Certificates and then export for localhost using the “Platform Independent PEM-format.”</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*tXA7JlyQYL6Kp4PO4IgIew.png" /><figcaption>QMC — export certificates</figcaption></figure><ul><li>Copy these certificates and paste them into {QlikBotNode folder}/app/server/certs/localhost</li><li>I have used three apps in this: 1. <a href="https://demos.qlik.com/qliksense/HelpdeskManagement">helpdesk</a>, 2. <a href="http://https//webapps.qlik.com/salesforce/index.html">Salesforce</a> and 3. <a href="https://webapps.qlik.com/CIO/index.html">CIO dashboard</a>. The qvf for helpdesk is bundled in your Qlik Sense Desktop while the Salesforce one you can get <a href="https://github.com/yianni-ververis/Salesforce/tree/master/Files">here</a> and the CIO Dashboard one you can get <a href="https://github.com/yianni-ververis/CIO/tree/master/Files">here</a>.</li><li>Now get the code from the <strong>Qlik Branch project</strong> (also available <a href="https://github.com/qlik-bots/QlikBotNode">here</a>).</li><li>From the command line, using your favorite tool (I am using Git Bash) type npm install in the root directory to get all of the required modules.</li><li>Install <a href="https://www.mysql.com/">MySql</a> or <a href="https://www.apachefriends.org/index.html">Xampp</a> / <a href="http://www.wampserver.com/en/">Wamp </a>and connect to it. Xampp is bundled with phpmyadmin so you can use that. Then, create the database and the tables by running <a href="https://github.com/qlik-bots/QlikBotNode/blob/master/files/sensebot.sql">this sql query</a>.</li></ul><p>Now, all messaging platforms (including Telegram) require some tokens so your code can authenticate with the platform’s servers. Once we have these tokens, for security reasons, we need to set them as environment variables.</p><h3>So, let’s create our QlikBot and get our token.</h3><ul><li>Once you install <a href="https://telegram.org/">Telegram Desktop</a>, go to your “BotFather” contact and type “/newbot”. Everything in Telegram that starts with “/” is a command. So we typed the command to create a new QlikBot. This will give you an options menu to configure your bot.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/941/1*3dUvJXQ2BgDh3UbYiizHng.png" /></figure><ul><li>Go ahead and give your Bot a name, an icon and a description. If you click on “Back to Bot,” you will get a button with the “API Token”. Take that token and store it as Environment Variable.</li><li>In windows you have to go to “Control Panel” -&gt; “System” -&gt; “Advanced System Settings” -&gt; “Environment Variables” and set a new one as “TELEGRAM_BOT_TOKEN”, while in Linux, from your directory (~), type “nano .bash_profile” or “vim .bash_profile” and enter a new line with the token “export TELEGRAM_BOT_TOKEN=######”.</li><li>Now you should be ready to run your code. From the command line (again, I’m using Git Bash), type “gulp”. If everything goes well and you do not have any errors, you should see a message “[nodemon] starting `node app/server/server.js`”. <strong><em>This means your server is up and running and communication via the token auth has been established!</em></strong></li></ul><h3>Now, let’s explore QlikBotNode.</h3><ul><li>Type help to view all of the available commands.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/959/1*wPN2jYL3BoD2vXqHLaKb6g.png" /></figure><ul><li>Click on the Salesforce button or type /salesforce</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/935/1*RaxsoR33JJgH360vpLihxQ.png" /></figure><ul><li>Here, there are some buttons to get KPIs and one that takes you to the mashup for validation. My recommendation? <strong><em>Try them all!</em></strong></li><li>Click on the CIO button or type /cio and then click on &quot;Management&quot; to get the set of KPIs.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/955/1*T8iov6Gz9kmn1j2Mhd5GJg.png" /></figure><ul><li>Click on the Helpdesk button or type /helpdesk</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/939/1*tiNXw3QlRUR2xFzwm2Eclw.png" /></figure><h3>That’s it!</h3><p>Now you can a have a Node.js server running with your QlikBotNode and you can start experimenting with KPI commands in the Telegram app.</p><h3>What Next?</h3><p>As mentioned, the code for <a href="http://branch.qlik.com/#!/project/5a2fd27d444ec6f5997b3829">QlikBotNode is open sourced on Qlik Branch</a> and <a href="https://github.com/qlik-bots/QlikBotNode">GitHub</a> (same with <a href="http://branch.qlik.com/#!/project/5a2fb8474666f1a641bc8e76">QlikBotNet</a> — more details <a href="https://branch-blog.qlik.com/all-you-need-to-know-about-qlikbotnet-b86b455f0e10">here</a>).We encourage you to fork the projects on GitHub, add new features, test them and submit pull requests. We just ask that you please follow our open source guidelines <a href="https://github.com/qlik-bots/open-source">found here</a>.</p><p>Also, if you have any questions, don’t hesitate to ask in the comments below or join the <a href="http://branch.qlik.com/slack">Qlik Branch Slack</a>. We have an entire channel that’s devoted to all that is QlikBot.</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=2a47e738dfd7" width="1" height="1" alt=""><hr><p><a href="https://medium.com/qlik-branch/qlik-sense-bot-with-node-js-and-enigma-js-2a47e738dfd7">QlikBotNode with Node.js and Enigma.js</a> was originally published in <a href="https://medium.com/qlik-branch">Qlik Branch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Qlik Sense Wordpress Plugin]]></title>
            <link>https://medium.com/qlik-branch/qlik-sense-wordpress-plugin-ade9d3eddb92?source=rss-62353883eb80------2</link>
            <guid isPermaLink="false">https://medium.com/p/ade9d3eddb92</guid>
            <category><![CDATA[plugins-for-wordpress]]></category>
            <category><![CDATA[programming]]></category>
            <category><![CDATA[web-development]]></category>
            <category><![CDATA[plugins]]></category>
            <category><![CDATA[wordpress]]></category>
            <dc:creator><![CDATA[Yiannis Ververis]]></dc:creator>
            <pubDate>Fri, 10 Nov 2017 00:00:00 GMT</pubDate>
            <atom:updated>2018-03-02T14:33:55.853Z</atom:updated>
            <content:encoded><![CDATA[<p>There are a lot of people that use Wordpress as their company’s portal. If you are one of these people then, you may find this plugin incredibly useful.</p><blockquote>You can create a mashup from within Wordpress, using the <a href="https://help.qlik.com/en-US/sense-developer/3.2/Subsystems/APIs/Content/mashup-api-reference.htm">Capabilities API</a>, without writing a single line of code.</blockquote><p>And it’s easy — just add the settings with the host and the App ID, then the shortcode for the objects that you want and you are done.</p><h4>But here are the instructions step-by-step…</h4><ul><li>First go to your wp admin panel, under “Plugins” click on “Add New” and then search for “Qlik”</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*bW-xRgcXuFXN9yhF.png" /></figure><ul><li>Click on “Install Now” and then on “Activate”</li><li>This will create a “Qlik Sense” settings page, just open that</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/775/0*vLUzQnfSs-voxXr7.png" /></figure><ul><li>Here you need to define your host, the Virtual Proxy (prefix) and the App Id, as you would in a regular mashup</li><li>Save changes.</li><li>Then add the shortcode into your posts “[qlik-sense-object qvid=”ZwjJQq” height=”400&quot; nointeraction=”true”]”- qvid: Is the object id as found in the “dev-hub/single-configurator”- height: The height of the visualization in pixels- nointeraction: Add this if you want to disable interactions. If you want the objects to have interaction, you can just omit this.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/1000/0*zz6mlexxNtEw7khd.png" /></figure><ul><li>I have added few objects with a specific height in a bootstrap template for better layout. Now, lets preview the page.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*TmHlRSaz3MuPvjGm.png" /></figure><ul><li>Now just make sure you whitelist your url in the virtual proxy.</li></ul><h4>What do you think?</h4><p>If you use it and like it, please give it a 5️⃣ star review in Wordpress.</p><h4>Other Resources</h4><ul><li><a href="https://github.com/yianni-ververis/qlik-sense-wordpress-plugin">GitHub — yianni-ververis/qlik-sense-wordpress-plugin: A Wordpress plugin to create a Qlik Sense Mashup</a></li><li><a href="http://branch.qlik.com/#!/project/5a0095382965bf50789e6888">Qlik Branch</a></li></ul><p>This is it!</p><p>— Yianni</p><p>476 Views Tags: none (<a href="https://community.qlik.com/blogs/qlikviewdesignblog/2017/11/10/qlik-sense-wordpress-plugin#">add</a>) <a href="https://community.qlik.com/blogs/qlikviewdesignblog/tags#/?tags=wordpress">wordpress</a>, <a href="https://community.qlik.com/blogs/qlikviewdesignblog/tags#/?tags=demo_and_best_practices">demo_and_best_practices</a>, <a href="https://community.qlik.com/blogs/qlikviewdesignblog/tags#/?tags=qlik%20sense">qlik sense</a>, <a href="https://community.qlik.com/blogs/qlikviewdesignblog/tags#/?tags=capabilities%20api">capabilities api</a></p><p><em>Originally published at </em><a href="https://community.qlik.com/blogs/qlikviewdesignblog/2017/11/10/qlik-sense-wordpress-plugin"><em>community.qlik.com</em></a><em> on November 10, 2017.</em></p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=ade9d3eddb92" width="1" height="1" alt=""><hr><p><a href="https://medium.com/qlik-branch/qlik-sense-wordpress-plugin-ade9d3eddb92">Qlik Sense Wordpress Plugin</a> was originally published in <a href="https://medium.com/qlik-branch">Qlik Branch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Trello and Qlik Sense]]></title>
            <link>https://medium.com/qlik-branch/trello-and-qlik-sense-2da6e1912967?source=rss-62353883eb80------2</link>
            <guid isPermaLink="false">https://medium.com/p/2da6e1912967</guid>
            <category><![CDATA[trello]]></category>
            <category><![CDATA[api]]></category>
            <category><![CDATA[d3]]></category>
            <category><![CDATA[mashups]]></category>
            <category><![CDATA[qlik-sense]]></category>
            <dc:creator><![CDATA[Yiannis Ververis]]></dc:creator>
            <pubDate>Tue, 18 Jul 2017 16:19:02 GMT</pubDate>
            <atom:updated>2017-07-21T14:04:25.408Z</atom:updated>
            <content:encoded><![CDATA[<p>Are you a <a href="https://trello.com/">Trello</a> user and want to start integrating your cards with <a href="http://www.qlik.com/us/products/qlik-sense">Qlik Sense</a> and getting some statistical analysis out of your projects’ workflow? Here I will show you how to connect to you boards and get your lists and cards into Qlik Sense.</p><p>First, you need to have a developer’s key and an authorization token, both generated for you by <a href="https://trello.com/">trello.com</a>.</p><ul><li>To get you Key you need to go to <a href="https://trello.com/app-key">https://trello.com/app-key</a></li><li>To get your Auth token, at the same page, right under your key, there is a link “Token”. Click on that and it will take to a page that asks you “Let Server Token use your account?”. You need to click “Allow” and then copy the key.</li></ul><p>Then, lets go to Qlik Sense and setup our Rest Connector to get our data. All of the desired template links are in <a href="https://developers.trello.com/advanced-reference">Trello Developers.</a>‌ Here I will just create a simple connection that retrieves all of the lists and their cards from a single board</p><ul><li>Go to your “Data Load Editor”</li><li>Create a new section and name it Trello</li><li>Create a new connection using the “Qlik REST Connector”</li><li>In the url add “<a href="https://api.trello.com/1/boards/[board_id]/lists?cards=open&amp;card_fields=name&amp;fields=name&amp;key=[key]&amp;token=[token]">https://api.trello.com/1/boards/[board_id]/lists?cards=open&amp;card_fields=name&amp;fields=name&amp;key=[key]&amp;token=[token]</a>&quot;. Don’t forget to substitute the key and token that you got above. To get your board id, simply open your Trello board and go to the url. It should be in the form of “<a href="https://trello.com/b/[board_id]/[your-board-name]">https://trello.com/b/[board_id]/[your-board-name]</a>&quot;.</li><li>Method is “GET”</li><li>Under Authentication select “BASIC” and add your username and password, give it a name and save it.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/760/1*bXjYTKVn746iInNNxrRYTQ.png" /></figure><ul><li>Click on “Select Data” and select what you want to get. If you select “root”, you will get only the lists. If you select cards too, then you will get all of the lists with their cards.</li><li>The REST Connector should generate the load script for you and should look something like this…</li></ul><pre>LIB CONNECT TO &#39;Trello-board-list&#39;;</pre><pre>RestConnectorMasterTable:</pre><pre>SQL SELECT</pre><pre>&quot;id&quot; AS &quot;id_u0&quot;,</pre><pre>&quot;name&quot; AS &quot;name_u0&quot;,</pre><pre>&quot;__KEY_root&quot;,</pre><pre>(SELECT</pre><pre>&quot;id&quot;,</pre><pre>&quot;name&quot;,</pre><pre>&quot;__FK_cards&quot;</pre><pre>FROM &quot;cards&quot; FK &quot;__FK_cards&quot;)</pre><pre>FROM JSON (wrap on) &quot;root&quot; PK &quot;__KEY_root&quot;;</pre><pre>[cards]:</pre><pre>LOAD [id] AS [card_id],</pre><pre>[name] AS [card_name],</pre><pre>[__FK_cards] AS [list_key]</pre><pre>RESIDENT RestConnectorMasterTable</pre><pre>WHERE NOT IsNull([__FK_cards]);</pre><pre>[root]:</pre><pre>LOAD [id_u0] AS [list_id],</pre><pre>[name_u0] AS [list_name],</pre><pre>[__KEY_root] AS [list_key]</pre><pre>RESIDENT RestConnectorMasterTable</pre><pre>WHERE NOT IsNull([__KEY_root]);</pre><pre>DROP TABLE RestConnectorMasterTable;</pre><p>The end result should be something like:</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/571/1*1tvazeoqL29Zw6EqqNu1Ag.png" /></figure><p>There are a lot of possibilities here. You can combine this with some power ups/custom fields that you would like to track and get more detail into your visualizations.</p><p>This is it!! Now with few steps you can add your lists and cards intro Qlik Sense and create charts or KPIs. Share your experience in the comments below.</p><p>Relevant Links: <a href="https://community.qlik.com/blogs/qlikviewdesignblog/2017/07/21/trello-and-qlik-sense">https://community.qlik.com/blogs/qlikviewdesignblog/2017/07/21/trello-and-qlik-sense</a></p><p>— Yianni</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=2da6e1912967" width="1" height="1" alt=""><hr><p><a href="https://medium.com/qlik-branch/trello-and-qlik-sense-2da6e1912967">Trello and Qlik Sense</a> was originally published in <a href="https://medium.com/qlik-branch">Qlik Branch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
    </channel>
</rss>