You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@predictionio.apache.org by gi...@apache.org on 2018/03/14 22:08:22 UTC
[23/51] [partial] predictionio-site git commit: Documentation based on apache/predictionio#439b87e07a59021839ea3fe2cd40f98fb8d4cc5f

http://git-wip-us.apache.org/repos/asf/predictionio-site/blob/9d2bd407/demo/tapster/index.html
----------------------------------------------------------------------
diff --git a/demo/tapster/index.html b/demo/tapster/index.html
index 40b74e6..fe39c89 100644
--- a/demo/tapster/index.html
+++ b/demo/tapster/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html><head><title>Comics Recommendation Demo</title><meta charset="utf-8"/><meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta class="swiftype" name="title" data-type="string" content="Comics Recommendation Demo"/><link rel="canonical" href="https://predictionio.apache.org/demo/tapster/"/><link href="/images/favicon/normal-b330020a.png" rel="shortcut icon"/><link href="/images/favicon/apple-c0febcf2.png" rel="apple-touch-icon"/><link href="//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800" rel="stylesheet"/><link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"/><link href="/stylesheets/application-eccfc6cb.css" rel="stylesheet" type="text/css"/><script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.min.js"></script><script src="//cdn.mathjax.org/mathjax/la
 test/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script><script src="//use.typekit.net/pqo0itb.js"></script><script>try{Typekit.load({ async: true });}catch(e){}</script></head><body><div id="global"><header><div class="container" id="header-wrapper"><div class="row"><div class="col-sm-12"><div id="logo-wrapper"><span id="drawer-toggle"></span><a href="#"></a><a href="http://predictionio.apache.org/"><img alt="Apache PredictionIO" id="logo" src="/images/logos/logo-ee2b9bb3.png"/></a><span>®</span></div><div id="menu-wrapper"><div id="pill-wrapper"><a class="pill left" href="/gallery/template-gallery">TEMPLATES</a> <a class="pill right" href="//github.com/apache/incubator-predictionio/">OPEN SOURCE</a></div></div><img class="mobile-search-bar-toggler hidden-md hidden-lg" src="/images/icons/search-glass-704bd4ff.png"/></div></div></div></header><div id="search-bar-row-wrapper"><div class="container-fluid" id="search-bar-row"><div class="row"><div class="col-md-9 col-sm-11 col-xs-11"><
 div class="hidden-md hidden-lg" id="mobile-page-heading-wrapper"><p>PredictionIO Docs</p><h4>Comics Recommendation Demo</h4></div><h4 class="hidden-sm hidden-xs">PredictionIO Docs</h4></div><div class="col-md-3 col-sm-1 col-xs-1 hidden-md hidden-lg"><img id="left-menu-indicator" src="/images/icons/down-arrow-dfe9f7fe.png"/></div><div class="col-md-3 col-sm-12 col-xs-12 swiftype-wrapper"><div class="swiftype"><form class="search-form"><img class="search-box-toggler hidden-xs hidden-sm" src="/images/icons/search-glass-704bd4ff.png"/><div class="search-box"><img src="/images/icons/search-glass-704bd4ff.png"/><input type="text" id="st-search-input" class="st-search-input" placeholder="Search Doc..."/></div><img class="swiftype-row-hider hidden-md hidden-lg" src="/images/icons/drawer-toggle-active-fcbef12a.png"/></form></div></div><div class="mobile-left-menu-toggler hidden-md hidden-lg"></div></div></div></div><div id="page" class="container-fluid"><div class="row"><div id="left-menu-wr
 apper" class="col-md-3"><nav id="nav-main"><ul><li class="level-1"><a class="expandible" href="/"><span>Apache PredictionIO® Documentation</span></a><ul><li class="level-2"><a class="final" href="/"><span>Welcome to Apache PredictionIO®</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Getting Started</span></a><ul><li class="level-2"><a class="final" href="/start/"><span>A Quick Intro</span></a></li><li class="level-2"><a class="final" href="/install/"><span>Installing Apache PredictionIO</span></a></li><li class="level-2"><a class="final" href="/start/download/"><span>Downloading an Engine Template</span></a></li><li class="level-2"><a class="final" href="/start/deploy/"><span>Deploying Your First Engine</span></a></li><li class="level-2"><a class="final" href="/start/customize/"><span>Customizing the Engine</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Integrating with Your App</span></a><ul><li class="level-2"
 ><a class="final" href="/appintegration/"><span>App Integration Overview</span></a></li><li class="level-2"><a class="expandible" href="/sdk/"><span>List of SDKs</span></a><ul><li class="level-3"><a class="final" href="/sdk/java/"><span>Java & Android SDK</span></a></li><li class="level-3"><a class="final" href="/sdk/php/"><span>PHP SDK</span></a></li><li class="level-3"><a class="final" href="/sdk/python/"><span>Python SDK</span></a></li><li class="level-3"><a class="final" href="/sdk/ruby/"><span>Ruby SDK</span></a></li><li class="level-3"><a class="final" href="/sdk/community/"><span>Community Powered SDKs</span></a></li></ul></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Deploying an Engine</span></a><ul><li class="level-2"><a class="final" href="/deploy/"><span>Deploying as a Web Service</span></a></li><li class="level-2"><a class="final" href="/batchpredict/"><span>Batch Predictions</span></a></li><li class="level-2"><a class="final" href="/deploy/moni
 toring/"><span>Monitoring Engine</span></a></li><li class="level-2"><a class="final" href="/deploy/engineparams/"><span>Setting Engine Parameters</span></a></li><li class="level-2"><a class="final" href="/deploy/enginevariants/"><span>Deploying Multiple Engine Variants</span></a></li><li class="level-2"><a class="final" href="/deploy/plugin/"><span>Engine Server Plugin</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Customizing an Engine</span></a><ul><li class="level-2"><a class="final" href="/customize/"><span>Learning DASE</span></a></li><li class="level-2"><a class="final" href="/customize/dase/"><span>Implement DASE</span></a></li><li class="level-2"><a class="final" href="/customize/troubleshooting/"><span>Troubleshooting Engine Development</span></a></li><li class="level-2"><a class="final" href="/api/current/#package"><span>Engine Scala APIs</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Collecting and Anal
 yzing Data</span></a><ul><li class="level-2"><a class="final" href="/datacollection/"><span>Event Server Overview</span></a></li><li class="level-2"><a class="final" href="/datacollection/eventapi/"><span>Collecting Data with REST/SDKs</span></a></li><li class="level-2"><a class="final" href="/datacollection/eventmodel/"><span>Events Modeling</span></a></li><li class="level-2"><a class="final" href="/datacollection/webhooks/"><span>Unifying Multichannel Data with Webhooks</span></a></li><li class="level-2"><a class="final" href="/datacollection/channel/"><span>Channel</span></a></li><li class="level-2"><a class="final" href="/datacollection/batchimport/"><span>Importing Data in Batch</span></a></li><li class="level-2"><a class="final" href="/datacollection/analytics/"><span>Using Analytics Tools</span></a></li><li class="level-2"><a class="final" href="/datacollection/plugin/"><span>Event Server Plugin</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span
 >Choosing an Algorithm(s)</span></a><ul><li class="level-2"><a class="final" href="/algorithm/"><span>Built-in Algorithm Libraries</span></a></li><li class="level-2"><a class="final" href="/algorithm/switch/"><span>Switching to Another Algorithm</span></a></li><li class="level-2"><a class="final" href="/algorithm/multiple/"><span>Combining Multiple Algorithms</span></a></li><li class="level-2"><a class="final" href="/algorithm/custom/"><span>Adding Your Own Algorithms</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>ML Tuning and Evaluation</span></a><ul><li class="level-2"><a class="final" href="/evaluation/"><span>Overview</span></a></li><li class="level-2"><a class="final" href="/evaluation/paramtuning/"><span>Hyperparameter Tuning</span></a></li><li class="level-2"><a class="final" href="/evaluation/evaluationdashboard/"><span>Evaluation Dashboard</span></a></li><li class="level-2"><a class="final" href="/evaluation/metricchoose/"><span>Choosing 
 Evaluation Metrics</span></a></li><li class="level-2"><a class="final" href="/evaluation/metricbuild/"><span>Building Evaluation Metrics</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>System Architecture</span></a><ul><li class="level-2"><a class="final" href="/system/"><span>Architecture Overview</span></a></li><li class="level-2"><a class="final" href="/system/anotherdatastore/"><span>Using Another Data Store</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>PredictionIO® Official Templates</span></a><ul><li class="level-2"><a class="final" href="/templates/"><span>Intro</span></a></li><li class="level-2"><a class="expandible" href="#"><span>Recommendation</span></a><ul><li class="level-3"><a class="final" href="/templates/recommendation/quickstart/"><span>Quick Start</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/dase/"><span>DASE</span></a></li><li class="level-3"><a class="f
 inal" href="/templates/recommendation/evaluation/"><span>Evaluation Explained</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/how-to/"><span>How-To</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/reading-custom-events/"><span>Read Custom Events</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/customize-data-prep/"><span>Customize Data Preparator</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/customize-serving/"><span>Customize Serving</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/training-with-implicit-preference/"><span>Train with Implicit Preference</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/blacklist-items/"><span>Filter Recommended Items by Blacklist in Query</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/batch-evaluator/">
 <span>Batch Persistable Evaluator</span></a></li></ul></li><li class="level-2"><a class="expandible" href="#"><span>E-Commerce Recommendation</span></a><ul><li class="level-3"><a class="final" href="/templates/ecommercerecommendation/quickstart/"><span>Quick Start</span></a></li><li class="level-3"><a class="final" href="/templates/ecommercerecommendation/dase/"><span>DASE</span></a></li><li class="level-3"><a class="final" href="/templates/ecommercerecommendation/how-to/"><span>How-To</span></a></li><li class="level-3"><a class="final" href="/templates/ecommercerecommendation/train-with-rate-event/"><span>Train with Rate Event</span></a></li><li class="level-3"><a class="final" href="/templates/ecommercerecommendation/adjust-score/"><span>Adjust Score</span></a></li></ul></li><li class="level-2"><a class="expandible" href="#"><span>Similar Product</span></a><ul><li class="level-3"><a class="final" href="/templates/similarproduct/quickstart/"><span>Quick Start</span></a></li><li cla
 ss="level-3"><a class="final" href="/templates/similarproduct/dase/"><span>DASE</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/how-to/"><span>How-To</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/multi-events-multi-algos/"><span>Multiple Events and Multiple Algorithms</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/return-item-properties/"><span>Returns Item Properties</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/train-with-rate-event/"><span>Train with Rate Event</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/rid-user-set-event/"><span>Get Rid of Events for Users</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/recommended-user/"><span>Recommend Users</span></a></li></ul></li><li class="level-2"><a class="expandible" href="#"><span>Classification</span></a><ul><li 
 class="level-3"><a class="final" href="/templates/classification/quickstart/"><span>Quick Start</span></a></li><li class="level-3"><a class="final" href="/templates/classification/dase/"><span>DASE</span></a></li><li class="level-3"><a class="final" href="/templates/classification/how-to/"><span>How-To</span></a></li><li class="level-3"><a class="final" href="/templates/classification/add-algorithm/"><span>Use Alternative Algorithm</span></a></li><li class="level-3"><a class="final" href="/templates/classification/reading-custom-properties/"><span>Read Custom Properties</span></a></li></ul></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Engine Template Gallery</span></a><ul><li class="level-2"><a class="final" href="/gallery/template-gallery/"><span>Browse</span></a></li><li class="level-2"><a class="final" href="/community/submit-template/"><span>Submit your Engine as a Template</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><spa
 n>Demo Tutorials</span></a><ul><li class="level-2"><a class="final active" href="/demo/tapster/"><span>Comics Recommendation Demo</span></a></li><li class="level-2"><a class="final" href="/demo/community/"><span>Community Contributed Demo</span></a></li><li class="level-2"><a class="final" href="/demo/textclassification/"><span>Text Classification Engine Tutorial</span></a></li></ul></li><li class="level-1"><a class="expandible" href="/community/"><span>Getting Involved</span></a><ul><li class="level-2"><a class="final" href="/community/contribute-code/"><span>Contribute Code</span></a></li><li class="level-2"><a class="final" href="/community/contribute-documentation/"><span>Contribute Documentation</span></a></li><li class="level-2"><a class="final" href="/community/contribute-sdk/"><span>Contribute a SDK</span></a></li><li class="level-2"><a class="final" href="/community/contribute-webhook/"><span>Contribute a Webhook</span></a></li><li class="level-2"><a class="final" href="/co
 mmunity/projects/"><span>Community Projects</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Getting Help</span></a><ul><li class="level-2"><a class="final" href="/resources/faq/"><span>FAQs</span></a></li><li class="level-2"><a class="final" href="/support/"><span>Support</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Resources</span></a><ul><li class="level-2"><a class="final" href="/cli/"><span>Command-line Interface</span></a></li><li class="level-2"><a class="final" href="/resources/release/"><span>Release Cadence</span></a></li><li class="level-2"><a class="final" href="/resources/intellij/"><span>Developing Engines with IntelliJ IDEA</span></a></li><li class="level-2"><a class="final" href="/resources/upgrade/"><span>Upgrade Instructions</span></a></li><li class="level-2"><a class="final" href="/resources/glossary/"><span>Glossary</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><sp
 an>Apache Software Foundation</span></a><ul><li class="level-2"><a class="final" href="https://www.apache.org/"><span>Apache Homepage</span></a></li><li class="level-2"><a class="final" href="https://www.apache.org/licenses/"><span>License</span></a></li><li class="level-2"><a class="final" href="https://www.apache.org/foundation/sponsorship.html"><span>Sponsorship</span></a></li><li class="level-2"><a class="final" href="https://www.apache.org/foundation/thanks.html"><span>Thanks</span></a></li><li class="level-2"><a class="final" href="https://www.apache.org/security/"><span>Security</span></a></li></ul></li></ul></nav></div><div class="col-md-9 col-sm-12"><div class="content-header hidden-md hidden-lg"><div id="breadcrumbs" class="hidden-sm hidden xs"><ul><li><a href="#">Demo Tutorials</a><span class="spacer">&gt;</span></li><li><span class="last">Comics Recommendation Demo</span></li></ul></div><div id="page-title"><h1>Comics Recommendation Demo</h1></div></div><div id="table-of
 -content-wrapper"><h5>On this page</h5><aside id="table-of-contents"><ul> <li> <a href="#introduction">Introduction</a> </li> <li> <a href="#tapster-demo-application">Tapster Demo Application</a> </li> <li> <a href="#apache-predictionio-setup">Apache PredictionIO Setup</a> </li> <li> <a href="#import-data">Import Data</a> </li> <li> <a href="#connect-demo-app-with-apache-predictionio">Connect Demo app with Apache PredictionIO</a> </li> <li> <a href="#links">Links</a> </li> <li> <a href="#conclusion">Conclusion</a> </li> </ul> </aside><hr/><a id="edit-page-link" href="https://github.com/apache/incubator-predictionio/tree/livedoc/docs/manual/source/demo/tapster.html.md"><img src="/images/icons/edit-pencil-d6c1bb3d.png"/>Edit this page</a></div><div class="content-header hidden-sm hidden-xs"><div id="breadcrumbs" class="hidden-sm hidden xs"><ul><li><a href="#">Demo Tutorials</a><span class="spacer">&gt;</span></li><li><span class="last">Comics Recommendation Demo</span></li></ul></div>
 <div id="page-title"><h1>Comics Recommendation Demo</h1></div></div><div class="content"> <h2 id='introduction' class='header-anchors'>Introduction</h2><p>In this demo, we will show you how to build a Tinder-style web application (named &quot;Tapster&quot;) recommending comics to users based on their likes/dislikes of episodes interactively.</p><p>The demo will use <a href="https://predictionio.apache.org/templates/similarproduct/quickstart/">Similar Product Template</a>. Similar Product Template is a great choice if you want to make recommendations based on immediate user activities or for new users with limited history. It uses MLLib Alternating Least Squares (ALS) recommendation algorithm, a <a href="http://en.wikipedia.org/wiki/Recommender_system#Collaborative_filtering">Collaborative filtering</a> (CF) algorithm commonly used for recommender systems. These techniques aim to fill in the missing entries of a user-item association matrix. Users and products are described by a smal
 l set of latent factors that can be used to predict missing entries. A layman&#39;s interpretation of Collaborative Filtering is &quot;People who like this comic, also like these comics.&quot;</p><p>All the code and data is on GitHub at: <a href="https://github.com/PredictionIO/Demo-Tapster">github.com/PredictionIO/Demo-Tapster</a>.</p><h3 id='data' class='header-anchors'>Data</h3><p>The source of the data is from <a href="http://tapastic.com/">Tapastic</a>. You can find the data files <a href="https://github.com/PredictionIO/Demo-Tapster/tree/master/data">here</a>.</p><p>The data structure looks like this:</p><p><a href="https://github.com/PredictionIO/Demo-Tapster/blob/master/data/episode_list.csv">Episode List</a> <code>data/episode_list.csv</code></p><p><strong>Fields:</strong> episodeId | episodeTitle | episodeCategories | episodeUrl | episodeImageUrls</p><p>1,000 rows. Each row represents one episode.</p><p><a href="https://github.com/PredictionIO/Demo-Tapster/blob/master/data
 /user_list.csv">User Like Event List</a> <code>data/user_list.csv</code></p><p><strong>Fields:</strong> userId | episodeId | likedTimestamp</p><p>192,587 rows. Each row represents one user like for the given episode.</p><p>The tutorial has four major steps:</p> <ul> <li>Demo application setup</li> <li>PredictionIO installation and setup</li> <li>Import data into database and PredictionIO</li> <li>Integrate demo application with PredictionIO</li> </ul> <h2 id='tapster-demo-application' class='header-anchors'>Tapster Demo Application</h2><p>The demo application is built using Rails.</p><p>You can clone the existing application with:</p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1
+<!DOCTYPE html><html><head><title>Comics Recommendation Demo</title><meta charset="utf-8"/><meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta class="swiftype" name="title" data-type="string" content="Comics Recommendation Demo"/><link rel="canonical" href="https://predictionio.apache.org/demo/tapster/"/><link href="/images/favicon/normal-b330020a.png" rel="shortcut icon"/><link href="/images/favicon/apple-c0febcf2.png" rel="apple-touch-icon"/><link href="//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800" rel="stylesheet"/><link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"/><link href="/stylesheets/application-eccfc6cb.css" rel="stylesheet" type="text/css"/><script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.min.js"></script><script src="//cdn.mathjax.org/mathjax/la
 test/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script><script src="//use.typekit.net/pqo0itb.js"></script><script>try{Typekit.load({ async: true });}catch(e){}</script></head><body><div id="global"><header><div class="container" id="header-wrapper"><div class="row"><div class="col-sm-12"><div id="logo-wrapper"><span id="drawer-toggle"></span><a href="#"></a><a href="http://predictionio.apache.org/"><img alt="Apache PredictionIO" id="logo" src="/images/logos/logo-ee2b9bb3.png"/></a><span>®</span></div><div id="menu-wrapper"><div id="pill-wrapper"><a class="pill left" href="/gallery/template-gallery">TEMPLATES</a> <a class="pill right" href="//github.com/apache/predictionio/">OPEN SOURCE</a></div></div><img class="mobile-search-bar-toggler hidden-md hidden-lg" src="/images/icons/search-glass-704bd4ff.png"/></div></div></div></header><div id="search-bar-row-wrapper"><div class="container-fluid" id="search-bar-row"><div class="row"><div class="col-md-9 col-sm-11 col-xs-11"><div class=
 "hidden-md hidden-lg" id="mobile-page-heading-wrapper"><p>PredictionIO Docs</p><h4>Comics Recommendation Demo</h4></div><h4 class="hidden-sm hidden-xs">PredictionIO Docs</h4></div><div class="col-md-3 col-sm-1 col-xs-1 hidden-md hidden-lg"><img id="left-menu-indicator" src="/images/icons/down-arrow-dfe9f7fe.png"/></div><div class="col-md-3 col-sm-12 col-xs-12 swiftype-wrapper"><div class="swiftype"><form class="search-form"><img class="search-box-toggler hidden-xs hidden-sm" src="/images/icons/search-glass-704bd4ff.png"/><div class="search-box"><img src="/images/icons/search-glass-704bd4ff.png"/><input type="text" id="st-search-input" class="st-search-input" placeholder="Search Doc..."/></div><img class="swiftype-row-hider hidden-md hidden-lg" src="/images/icons/drawer-toggle-active-fcbef12a.png"/></form></div></div><div class="mobile-left-menu-toggler hidden-md hidden-lg"></div></div></div></div><div id="page" class="container-fluid"><div class="row"><div id="left-menu-wrapper" cla
 ss="col-md-3"><nav id="nav-main"><ul><li class="level-1"><a class="expandible" href="/"><span>Apache PredictionIO® Documentation</span></a><ul><li class="level-2"><a class="final" href="/"><span>Welcome to Apache PredictionIO®</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Getting Started</span></a><ul><li class="level-2"><a class="final" href="/start/"><span>A Quick Intro</span></a></li><li class="level-2"><a class="final" href="/install/"><span>Installing Apache PredictionIO</span></a></li><li class="level-2"><a class="final" href="/start/download/"><span>Downloading an Engine Template</span></a></li><li class="level-2"><a class="final" href="/start/deploy/"><span>Deploying Your First Engine</span></a></li><li class="level-2"><a class="final" href="/start/customize/"><span>Customizing the Engine</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Integrating with Your App</span></a><ul><li class="level-2"><a class=
 "final" href="/appintegration/"><span>App Integration Overview</span></a></li><li class="level-2"><a class="expandible" href="/sdk/"><span>List of SDKs</span></a><ul><li class="level-3"><a class="final" href="/sdk/java/"><span>Java & Android SDK</span></a></li><li class="level-3"><a class="final" href="/sdk/php/"><span>PHP SDK</span></a></li><li class="level-3"><a class="final" href="/sdk/python/"><span>Python SDK</span></a></li><li class="level-3"><a class="final" href="/sdk/ruby/"><span>Ruby SDK</span></a></li><li class="level-3"><a class="final" href="/sdk/community/"><span>Community Powered SDKs</span></a></li></ul></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Deploying an Engine</span></a><ul><li class="level-2"><a class="final" href="/deploy/"><span>Deploying as a Web Service</span></a></li><li class="level-2"><a class="final" href="/batchpredict/"><span>Batch Predictions</span></a></li><li class="level-2"><a class="final" href="/deploy/monitoring/"><
 span>Monitoring Engine</span></a></li><li class="level-2"><a class="final" href="/deploy/engineparams/"><span>Setting Engine Parameters</span></a></li><li class="level-2"><a class="final" href="/deploy/enginevariants/"><span>Deploying Multiple Engine Variants</span></a></li><li class="level-2"><a class="final" href="/deploy/plugin/"><span>Engine Server Plugin</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Customizing an Engine</span></a><ul><li class="level-2"><a class="final" href="/customize/"><span>Learning DASE</span></a></li><li class="level-2"><a class="final" href="/customize/dase/"><span>Implement DASE</span></a></li><li class="level-2"><a class="final" href="/customize/troubleshooting/"><span>Troubleshooting Engine Development</span></a></li><li class="level-2"><a class="final" href="/api/current/#package"><span>Engine Scala APIs</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Collecting and Analyzing Data
 </span></a><ul><li class="level-2"><a class="final" href="/datacollection/"><span>Event Server Overview</span></a></li><li class="level-2"><a class="final" href="/datacollection/eventapi/"><span>Collecting Data with REST/SDKs</span></a></li><li class="level-2"><a class="final" href="/datacollection/eventmodel/"><span>Events Modeling</span></a></li><li class="level-2"><a class="final" href="/datacollection/webhooks/"><span>Unifying Multichannel Data with Webhooks</span></a></li><li class="level-2"><a class="final" href="/datacollection/channel/"><span>Channel</span></a></li><li class="level-2"><a class="final" href="/datacollection/batchimport/"><span>Importing Data in Batch</span></a></li><li class="level-2"><a class="final" href="/datacollection/analytics/"><span>Using Analytics Tools</span></a></li><li class="level-2"><a class="final" href="/datacollection/plugin/"><span>Event Server Plugin</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Choosing 
 an Algorithm(s)</span></a><ul><li class="level-2"><a class="final" href="/algorithm/"><span>Built-in Algorithm Libraries</span></a></li><li class="level-2"><a class="final" href="/algorithm/switch/"><span>Switching to Another Algorithm</span></a></li><li class="level-2"><a class="final" href="/algorithm/multiple/"><span>Combining Multiple Algorithms</span></a></li><li class="level-2"><a class="final" href="/algorithm/custom/"><span>Adding Your Own Algorithms</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>ML Tuning and Evaluation</span></a><ul><li class="level-2"><a class="final" href="/evaluation/"><span>Overview</span></a></li><li class="level-2"><a class="final" href="/evaluation/paramtuning/"><span>Hyperparameter Tuning</span></a></li><li class="level-2"><a class="final" href="/evaluation/evaluationdashboard/"><span>Evaluation Dashboard</span></a></li><li class="level-2"><a class="final" href="/evaluation/metricchoose/"><span>Choosing Evaluation
  Metrics</span></a></li><li class="level-2"><a class="final" href="/evaluation/metricbuild/"><span>Building Evaluation Metrics</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>System Architecture</span></a><ul><li class="level-2"><a class="final" href="/system/"><span>Architecture Overview</span></a></li><li class="level-2"><a class="final" href="/system/anotherdatastore/"><span>Using Another Data Store</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>PredictionIO® Official Templates</span></a><ul><li class="level-2"><a class="final" href="/templates/"><span>Intro</span></a></li><li class="level-2"><a class="expandible" href="#"><span>Recommendation</span></a><ul><li class="level-3"><a class="final" href="/templates/recommendation/quickstart/"><span>Quick Start</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/dase/"><span>DASE</span></a></li><li class="level-3"><a class="final" href
 ="/templates/recommendation/evaluation/"><span>Evaluation Explained</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/how-to/"><span>How-To</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/reading-custom-events/"><span>Read Custom Events</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/customize-data-prep/"><span>Customize Data Preparator</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/customize-serving/"><span>Customize Serving</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/training-with-implicit-preference/"><span>Train with Implicit Preference</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/blacklist-items/"><span>Filter Recommended Items by Blacklist in Query</span></a></li><li class="level-3"><a class="final" href="/templates/recommendation/batch-evaluator/"><span>Batc
 h Persistable Evaluator</span></a></li></ul></li><li class="level-2"><a class="expandible" href="#"><span>E-Commerce Recommendation</span></a><ul><li class="level-3"><a class="final" href="/templates/ecommercerecommendation/quickstart/"><span>Quick Start</span></a></li><li class="level-3"><a class="final" href="/templates/ecommercerecommendation/dase/"><span>DASE</span></a></li><li class="level-3"><a class="final" href="/templates/ecommercerecommendation/how-to/"><span>How-To</span></a></li><li class="level-3"><a class="final" href="/templates/ecommercerecommendation/train-with-rate-event/"><span>Train with Rate Event</span></a></li><li class="level-3"><a class="final" href="/templates/ecommercerecommendation/adjust-score/"><span>Adjust Score</span></a></li></ul></li><li class="level-2"><a class="expandible" href="#"><span>Similar Product</span></a><ul><li class="level-3"><a class="final" href="/templates/similarproduct/quickstart/"><span>Quick Start</span></a></li><li class="level-
 3"><a class="final" href="/templates/similarproduct/dase/"><span>DASE</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/how-to/"><span>How-To</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/multi-events-multi-algos/"><span>Multiple Events and Multiple Algorithms</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/return-item-properties/"><span>Returns Item Properties</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/train-with-rate-event/"><span>Train with Rate Event</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/rid-user-set-event/"><span>Get Rid of Events for Users</span></a></li><li class="level-3"><a class="final" href="/templates/similarproduct/recommended-user/"><span>Recommend Users</span></a></li></ul></li><li class="level-2"><a class="expandible" href="#"><span>Classification</span></a><ul><li class="lev
 el-3"><a class="final" href="/templates/classification/quickstart/"><span>Quick Start</span></a></li><li class="level-3"><a class="final" href="/templates/classification/dase/"><span>DASE</span></a></li><li class="level-3"><a class="final" href="/templates/classification/how-to/"><span>How-To</span></a></li><li class="level-3"><a class="final" href="/templates/classification/add-algorithm/"><span>Use Alternative Algorithm</span></a></li><li class="level-3"><a class="final" href="/templates/classification/reading-custom-properties/"><span>Read Custom Properties</span></a></li></ul></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Engine Template Gallery</span></a><ul><li class="level-2"><a class="final" href="/gallery/template-gallery/"><span>Browse</span></a></li><li class="level-2"><a class="final" href="/community/submit-template/"><span>Submit your Engine as a Template</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Demo Tut
 orials</span></a><ul><li class="level-2"><a class="final active" href="/demo/tapster/"><span>Comics Recommendation Demo</span></a></li><li class="level-2"><a class="final" href="/demo/community/"><span>Community Contributed Demo</span></a></li><li class="level-2"><a class="final" href="/demo/textclassification/"><span>Text Classification Engine Tutorial</span></a></li></ul></li><li class="level-1"><a class="expandible" href="/community/"><span>Getting Involved</span></a><ul><li class="level-2"><a class="final" href="/community/contribute-code/"><span>Contribute Code</span></a></li><li class="level-2"><a class="final" href="/community/contribute-documentation/"><span>Contribute Documentation</span></a></li><li class="level-2"><a class="final" href="/community/contribute-sdk/"><span>Contribute a SDK</span></a></li><li class="level-2"><a class="final" href="/community/contribute-webhook/"><span>Contribute a Webhook</span></a></li><li class="level-2"><a class="final" href="/community/pr
 ojects/"><span>Community Projects</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Getting Help</span></a><ul><li class="level-2"><a class="final" href="/resources/faq/"><span>FAQs</span></a></li><li class="level-2"><a class="final" href="/support/"><span>Support</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Resources</span></a><ul><li class="level-2"><a class="final" href="/cli/"><span>Command-line Interface</span></a></li><li class="level-2"><a class="final" href="/resources/release/"><span>Release Cadence</span></a></li><li class="level-2"><a class="final" href="/resources/intellij/"><span>Developing Engines with IntelliJ IDEA</span></a></li><li class="level-2"><a class="final" href="/resources/upgrade/"><span>Upgrade Instructions</span></a></li><li class="level-2"><a class="final" href="/resources/glossary/"><span>Glossary</span></a></li></ul></li><li class="level-1"><a class="expandible" href="#"><span>Apache 
 Software Foundation</span></a><ul><li class="level-2"><a class="final" href="https://www.apache.org/"><span>Apache Homepage</span></a></li><li class="level-2"><a class="final" href="https://www.apache.org/licenses/"><span>License</span></a></li><li class="level-2"><a class="final" href="https://www.apache.org/foundation/sponsorship.html"><span>Sponsorship</span></a></li><li class="level-2"><a class="final" href="https://www.apache.org/foundation/thanks.html"><span>Thanks</span></a></li><li class="level-2"><a class="final" href="https://www.apache.org/security/"><span>Security</span></a></li></ul></li></ul></nav></div><div class="col-md-9 col-sm-12"><div class="content-header hidden-md hidden-lg"><div id="breadcrumbs" class="hidden-sm hidden xs"><ul><li><a href="#">Demo Tutorials</a><span class="spacer">&gt;</span></li><li><span class="last">Comics Recommendation Demo</span></li></ul></div><div id="page-title"><h1>Comics Recommendation Demo</h1></div></div><div id="table-of-content-w
 rapper"><h5>On this page</h5><aside id="table-of-contents"><ul> <li> <a href="#introduction">Introduction</a> </li> <li> <a href="#tapster-demo-application">Tapster Demo Application</a> </li> <li> <a href="#apache-predictionio-setup">Apache PredictionIO Setup</a> </li> <li> <a href="#import-data">Import Data</a> </li> <li> <a href="#connect-demo-app-with-apache-predictionio">Connect Demo app with Apache PredictionIO</a> </li> <li> <a href="#links">Links</a> </li> <li> <a href="#conclusion">Conclusion</a> </li> </ul> </aside><hr/><a id="edit-page-link" href="https://github.com/apache/predictionio/tree/livedoc/docs/manual/source/demo/tapster.html.md"><img src="/images/icons/edit-pencil-d6c1bb3d.png"/>Edit this page</a></div><div class="content-header hidden-sm hidden-xs"><div id="breadcrumbs" class="hidden-sm hidden xs"><ul><li><a href="#">Demo Tutorials</a><span class="spacer">&gt;</span></li><li><span class="last">Comics Recommendation Demo</span></li></ul></div><div id="page-title"
 ><h1>Comics Recommendation Demo</h1></div></div><div class="content"> <h2 id='introduction' class='header-anchors'>Introduction</h2><p>In this demo, we will show you how to build a Tinder-style web application (named &quot;Tapster&quot;) recommending comics to users based on their likes/dislikes of episodes interactively.</p><p>The demo will use <a href="https://predictionio.apache.org/templates/similarproduct/quickstart/">Similar Product Template</a>. Similar Product Template is a great choice if you want to make recommendations based on immediate user activities or for new users with limited history. It uses MLLib Alternating Least Squares (ALS) recommendation algorithm, a <a href="http://en.wikipedia.org/wiki/Recommender_system#Collaborative_filtering">Collaborative filtering</a> (CF) algorithm commonly used for recommender systems. These techniques aim to fill in the missing entries of a user-item association matrix. Users and products are described by a small set of latent fact
 ors that can be used to predict missing entries. A layman&#39;s interpretation of Collaborative Filtering is &quot;People who like this comic, also like these comics.&quot;</p><p>All the code and data is on GitHub at: <a href="https://github.com/PredictionIO/Demo-Tapster">github.com/PredictionIO/Demo-Tapster</a>.</p><h3 id='data' class='header-anchors'>Data</h3><p>The source of the data is from <a href="http://tapastic.com/">Tapastic</a>. You can find the data files <a href="https://github.com/PredictionIO/Demo-Tapster/tree/master/data">here</a>.</p><p>The data structure looks like this:</p><p><a href="https://github.com/PredictionIO/Demo-Tapster/blob/master/data/episode_list.csv">Episode List</a> <code>data/episode_list.csv</code></p><p><strong>Fields:</strong> episodeId | episodeTitle | episodeCategories | episodeUrl | episodeImageUrls</p><p>1,000 rows. Each row represents one episode.</p><p><a href="https://github.com/PredictionIO/Demo-Tapster/blob/master/data/user_list.csv">User
  Like Event List</a> <code>data/user_list.csv</code></p><p><strong>Fields:</strong> userId | episodeId | likedTimestamp</p><p>192,587 rows. Each row represents one user like for the given episode.</p><p>The tutorial has four major steps:</p> <ul> <li>Demo application setup</li> <li>PredictionIO installation and setup</li> <li>Import data into database and PredictionIO</li> <li>Integrate demo application with PredictionIO</li> </ul> <h2 id='tapster-demo-application' class='header-anchors'>Tapster Demo Application</h2><p>The demo application is built using Rails.</p><p>You can clone the existing application with:</p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1
 2
 3</pre></td><td class="code"><pre><span class="gp">$ </span>git clone  https://github.com/PredictionIO/Demo-Tapster.git
 <span class="gp">$ </span><span class="nb">cd </span>Demo-Tapster
@@ -7,11 +7,11 @@
 2</pre></td><td class="code"><pre><span class="gp">$ </span>rake db:create
 <span class="gp">$ </span>rake db:migrate
 </pre></td></tr></tbody></table> </div> <p>At this point, you should have the demo application ready but with an empty database. Lets import the episodes data into our database. We will do this with: <code>$ rake import:episodes</code>. An &quot;Episode&quot; is a single <a href="http://en.wikipedia.org/wiki/Comic_strip">comic strip</a>.</p><p><a href="https://github.com/PredictionIO/Demo-Tapster/blob/master/lib/tasks/import/episodes.rake">View on GitHub</a></p><p>This script is pretty simple. It loops through the CSV file and creates a new episode for each line in the file in our local database.</p><p>You can start the app and point your browser to <a href="http://localhost:3000">http://localhost:3000</a></p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1</pre></td><td class="code"><pre><span class="nv">$rails</span> server
-</pre></td></tr></tbody></table> </div> <p><img alt="Rails Server" src="/images/demo/tapster/rails-server-997d690e.png"/></p><h2 id='apache-predictionio-setup' class='header-anchors'>Apache PredictionIO Setup</h2><h3 id='install-apache-predictionio' class='header-anchors'>Install Apache PredictionIO</h3><p>Follow the installation instructions <a href="http://predictionio.apache.org/install/">here</a> or simply run:</p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1</pre></td><td class="code"><pre><span class="gp">$ </span>bash -c <span class="s2">"</span><span class="k">$(</span>curl -s https://raw.githubusercontent.com/apache/incubator-predictionio/master/bin/install.sh<span class="k">)</span><span class="s2">"</span>
+</pre></td></tr></tbody></table> </div> <p><img alt="Rails Server" src="/images/demo/tapster/rails-server-997d690e.png"/></p><h2 id='apache-predictionio-setup' class='header-anchors'>Apache PredictionIO Setup</h2><h3 id='install-apache-predictionio' class='header-anchors'>Install Apache PredictionIO</h3><p>Follow the installation instructions <a href="http://predictionio.apache.org/install/">here</a> or simply run:</p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1</pre></td><td class="code"><pre><span class="gp">$ </span>bash -c <span class="s2">"</span><span class="k">$(</span>curl -s https://raw.githubusercontent.com/apache/predictionio/master/bin/install.sh<span class="k">)</span><span class="s2">"</span>
 </pre></td></tr></tbody></table> </div> <p><img alt="PIO Install" src="/images/demo/tapster/pio-install-2d870aed.png"/></p><h3 id='create-a-new-app' class='header-anchors'>Create a New App</h3><p>You will need to create a new app on Apache PredictionIO to house the Tapster demo. You can do this with:</p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1</pre></td><td class="code"><pre><span class="gp">$ </span>pio app new tapster
 </pre></td></tr></tbody></table> </div> <p>Take note of the App ID and Access Key.</p><p><img alt="PIO App New" src="/images/demo/tapster/pio-app-new-5a8ae503.png"/></p><h3 id='setup-engine' class='header-anchors'>Setup Engine</h3><p>We are going to copy the Similar Product Template into the PIO directory.</p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1
 2</pre></td><td class="code"><pre><span class="gp">$ </span><span class="nb">cd </span>PredictionIO
-<span class="gp">$ </span>git clone https://github.com/apache/incubator-predictionio-template-similar-product.git tapster-episode-similar
+<span class="gp">$ </span>git clone https://github.com/apache/predictionio-template-similar-product.git tapster-episode-similar
 </pre></td></tr></tbody></table> </div> <p>Next we are going to update the App ID in the ‘engine.json’ file to match the App ID we just created.</p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1
 2
 3</pre></td><td class="code"><pre><span class="gp">$ </span><span class="nb">cd </span>tapster-episode-similar
@@ -171,7 +171,7 @@ end
 </pre></td></tr></tbody></table> </div> <p>In total the script takes about 4 minutes to run on a basic laptop. At this point all the data is now imported to Apache PredictionIO.</p><p><img alt="Import" src="/images/demo/tapster/pio-import-predictionio-1ecd11fd.png"/></p><h3 id='engine-training' class='header-anchors'>Engine Training</h3><p>We train the engine with the following command:</p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1
 2</pre></td><td class="code"><pre><span class="gp">$ </span><span class="nb">cd </span>tapster-episode-similar
 <span class="gp">$ </span>pio train -- --driver-memory 4g
-</pre></td></tr></tbody></table> </div> <p><img alt="PIO Train" src="/images/demo/tapster/pio-train-7edffad4.png"/></p><p>Using the --driver-memory option to limit the memory used by Apache PredictionIO (incubating). Without this Apache PredictionIO can consume too much memory leading to a crash. You can adjust the 4g up or down depending on your system specs.</p><p>You can set up a job to periodically retrain the engine so the model is updated with the latest dataset.</p><h3 id='deploy-model' class='header-anchors'>Deploy Model</h3><p>You can deploy the model with: <code>$ pio deploy</code> from the <code>tapster-episode-similar</code> directory.</p><p>At this point, you have an demo app with data and a Apache PredictionIO (incubating) server with a trained model all setup. Next, we will connect the two so you can log the live interaction (likes) events into Apache PredictionIO (incubating) event server and query the engine server for recommendation.</p><h2 id='connect-demo-app-wit
 h-apache-predictionio' class='header-anchors'>Connect Demo app with Apache PredictionIO</h2><h3 id='overview' class='header-anchors'>Overview</h3><p>On a high level the application keeps a record of each like and dislike. It uses jQuery to send an array of both likes and dislikes to the server on each click. The server then queries Apache PredictionIO for a similar episode which is relayed to jQuery and displayed to the user.</p><p>Data flow:</p> <ul> <li>The user likes an episode.</li> <li>Tapster sends the &quot;Like&quot; event to Apache PredictionIO event server.</li> <li>Tapster queries Apache PredictionIO engine with all the episodes the user has rated (likes and dislikes) in this session.</li> <li>Apache PredictionIO returns 1 recommended episode.</li> </ul> <h3 id='javascript' class='header-anchors'>JavaScript</h3><p>All the important code lives in <code>app/assets/javascripts/application.js</code> <a href="https://github.com/PredictionIO/Demo-Tapster/blob/master/app/assets/
 javascripts/application.js">View on GitHub</a></p><p>Most of this file is just handlers for click things, displaying the loading dialog and other such things.</p><p>The most important function is to query the Rails server for results from Apache PredictionIO.</p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1
+</pre></td></tr></tbody></table> </div> <p><img alt="PIO Train" src="/images/demo/tapster/pio-train-7edffad4.png"/></p><p>Using the --driver-memory option to limit the memory used by Apache PredictionIO. Without this Apache PredictionIO can consume too much memory leading to a crash. You can adjust the 4g up or down depending on your system specs.</p><p>You can set up a job to periodically retrain the engine so the model is updated with the latest dataset.</p><h3 id='deploy-model' class='header-anchors'>Deploy Model</h3><p>You can deploy the model with: <code>$ pio deploy</code> from the <code>tapster-episode-similar</code> directory.</p><p>At this point, you have an demo app with data and a Apache PredictionIO server with a trained model all setup. Next, we will connect the two so you can log the live interaction (likes) events into Apache PredictionIO event server and query the engine server for recommendation.</p><h2 id='connect-demo-app-with-apache-predictionio' class='header-an
 chors'>Connect Demo app with Apache PredictionIO</h2><h3 id='overview' class='header-anchors'>Overview</h3><p>On a high level the application keeps a record of each like and dislike. It uses jQuery to send an array of both likes and dislikes to the server on each click. The server then queries Apache PredictionIO for a similar episode which is relayed to jQuery and displayed to the user.</p><p>Data flow:</p> <ul> <li>The user likes an episode.</li> <li>Tapster sends the &quot;Like&quot; event to Apache PredictionIO event server.</li> <li>Tapster queries Apache PredictionIO engine with all the episodes the user has rated (likes and dislikes) in this session.</li> <li>Apache PredictionIO returns 1 recommended episode.</li> </ul> <h3 id='javascript' class='header-anchors'>JavaScript</h3><p>All the important code lives in <code>app/assets/javascripts/application.js</code> <a href="https://github.com/PredictionIO/Demo-Tapster/blob/master/app/assets/javascripts/application.js">View on Git
 Hub</a></p><p>Most of this file is just handlers for click things, displaying the loading dialog and other such things.</p><p>The most important function is to query the Rails server for results from Apache PredictionIO.</p><div class="highlight shell"><table style="border-spacing: 0"><tbody><tr><td class="gutter gl" style="text-align: right"><pre class="lineno">1
 2
 3
 4
@@ -261,7 +261,7 @@ queryPIO: <span class="k">function</span><span class="o">()</span> <span class="
 
   render json: @episode
 end
-</pre></td></tr></tbody></table> </div> <p>On the first line we make a connection to Apache PredictionIO. You will need to set the <code>PIO_ENGINE_URL</code>. This can be done in the <code>.env</code> file. The default URL is: <a href="http://localhost:8000">http://localhost:8000</a>.</p><p>Next we decode the JSON sent from the browser.</p><p>After that we check to see if the user has liked anything yet. If not we just return a random episode.</p><p>If the user has likes then we can send that data to Apache PredictionIO (incubating) event server.</p><p>We also blacklist the dislikes so that they are not returned.</p><p>With our response from Apache PredictionIO it’s just a matter of looking it up in the database and rendering that object as JSON.</p><p>Once the response is sent to the browser JavaScript is used to replace the existing comic and hide the loading message.</p><p>Thats it. You’re done! If Ruby is not your language of choice check out our other <a href="http://predi
 ctionio.apache.org/sdk/">SDKs</a> and remember you can always interact with the Event Server though it’s native JSON API.</p><h2 id='links' class='header-anchors'>Links</h2><p>Source code is on GitHub at: <a href="https://github.com/PredictionIO/Demo-Tapster">github.com/PredictionIO/Demo-Tapster</a></p><h2 id='conclusion' class='header-anchors'>Conclusion</h2><p>Love this tutorial and Apache PredictionIO? Both are open source (Apache 2 License). <a href="https://github.com/PredictionIO/Demo-Tapster">Fork</a> this demo and build upon it. If you produce something cool shoot us an email and we will link to it from here.</p><p>Found a typo? Think something should be explained better? This tutorial (and all our other documenation) live in the main repo <a href="https://github.com/apache/incubator-predictionio/blob/livedoc/docs/manual/source/demo/tapster.html.md">here</a>. Our documentation is in the <code>livedoc</code> branch. Find out how to contribute documentation at <a href="http:
 //predictionio.apache.org/community/contribute-documentation/">http://predictionio.apache.org/community/contribute-documentation/</a>].</p><p>We &hearts; pull requests!</p></div></div></div></div><footer><div class="container"><div class="seperator"></div><div class="row"><div class="col-md-6 footer-link-column"><div class="footer-link-column-row"><h4>Community</h4><ul><li><a href="//predictionio.apache.org/install/" target="blank">Download</a></li><li><a href="//predictionio.apache.org/" target="blank">Docs</a></li><li><a href="//github.com/apache/incubator-predictionio" target="blank">GitHub</a></li><li><a href="mailto:user-subscribe@predictionio.apache.org" target="blank">Subscribe to User Mailing List</a></li><li><a href="//stackoverflow.com/questions/tagged/predictionio" target="blank">Stackoverflow</a></li></ul></div></div><div class="col-md-6 footer-link-column"><div class="footer-link-column-row"><h4>Contribute</h4><ul><li><a href="//predictionio.apache.org/community/contrib
 ute-code/" target="blank">Contribute</a></li><li><a href="//github.com/apache/incubator-predictionio" target="blank">Source Code</a></li><li><a href="//issues.apache.org/jira/browse/PIO" target="blank">Bug Tracker</a></li><li><a href="mailto:dev-subscribe@predictionio.apache.org" target="blank">Subscribe to Development Mailing List</a></li></ul></div></div></div><div class="row"><div class="col-md-12 footer-link-column"><p>Apache PredictionIO, PredictionIO, Apache, the Apache feather logo, and the Apache PredictionIO project logo are either registered trademarks or trademarks of The Apache Software Foundation in the United States and other countries.</p><p>All other marks mentioned may be trademarks or registered trademarks of their respective owners.</p></div></div></div><div id="footer-bottom"><div class="container"><div class="row"><div class="col-md-12"><div id="footer-logo-wrapper"><img alt="PredictionIO" src="/images/logos/logo-white-d1e9c6e6.png"/><span>®</span></div><div id
 ="social-icons-wrapper"><a class="github-button" href="https://github.com/apache/incubator-predictionio" data-style="mega" data-count-href="/apache/incubator-predictionio/stargazers" data-count-api="/repos/apache/incubator-predictionio#stargazers_count" data-count-aria-label="# stargazers on GitHub" aria-label="Star apache/incubator-predictionio on GitHub">Star</a> <a class="github-button" href="https://github.com/apache/incubator-predictionio/fork" data-icon="octicon-git-branch" data-style="mega" data-count-href="/apache/incubator-predictionio/network" data-count-api="/repos/apache/incubator-predictionio#forks_count" data-count-aria-label="# forks on GitHub" aria-label="Fork apache/incubator-predictionio on GitHub">Fork</a> <script id="github-bjs" async="" defer="" src="https://buttons.github.io/buttons.js"></script><a href="https://twitter.com/predictionio" target="blank"><img alt="PredictionIO on Twitter" src="/images/icons/twitter-ea9dc152.png"/></a> <a href="https://www.faceboo
 k.com/predictionio" target="blank"><img alt="PredictionIO on Facebook" src="/images/icons/facebook-5c57939c.png"/></a> </div></div></div></div></div></footer></div><script>(function(w,d,t,u,n,s,e){w['SwiftypeObject']=n;w[n]=w[n]||function(){
+</pre></td></tr></tbody></table> </div> <p>On the first line we make a connection to Apache PredictionIO. You will need to set the <code>PIO_ENGINE_URL</code>. This can be done in the <code>.env</code> file. The default URL is: <a href="http://localhost:8000">http://localhost:8000</a>.</p><p>Next we decode the JSON sent from the browser.</p><p>After that we check to see if the user has liked anything yet. If not we just return a random episode.</p><p>If the user has likes then we can send that data to Apache PredictionIO event server.</p><p>We also blacklist the dislikes so that they are not returned.</p><p>With our response from Apache PredictionIO it’s just a matter of looking it up in the database and rendering that object as JSON.</p><p>Once the response is sent to the browser JavaScript is used to replace the existing comic and hide the loading message.</p><p>Thats it. You’re done! If Ruby is not your language of choice check out our other <a href="http://predictionio.apach
 e.org/sdk/">SDKs</a> and remember you can always interact with the Event Server though it’s native JSON API.</p><h2 id='links' class='header-anchors'>Links</h2><p>Source code is on GitHub at: <a href="https://github.com/PredictionIO/Demo-Tapster">github.com/PredictionIO/Demo-Tapster</a></p><h2 id='conclusion' class='header-anchors'>Conclusion</h2><p>Love this tutorial and Apache PredictionIO? Both are open source (Apache 2 License). <a href="https://github.com/PredictionIO/Demo-Tapster">Fork</a> this demo and build upon it. If you produce something cool shoot us an email and we will link to it from here.</p><p>Found a typo? Think something should be explained better? This tutorial (and all our other documenation) live in the main repo <a href="https://github.com/apache/predictionio/blob/livedoc/docs/manual/source/demo/tapster.html.md">here</a>. Our documentation is in the <code>livedoc</code> branch. Find out how to contribute documentation at <a href="http://predictionio.apache.o
 rg/community/contribute-documentation/">http://predictionio.apache.org/community/contribute-documentation/</a>].</p><p>We &hearts; pull requests!</p></div></div></div></div><footer><div class="container"><div class="seperator"></div><div class="row"><div class="col-md-6 footer-link-column"><div class="footer-link-column-row"><h4>Community</h4><ul><li><a href="//predictionio.apache.org/install/" target="blank">Download</a></li><li><a href="//predictionio.apache.org/" target="blank">Docs</a></li><li><a href="//github.com/apache/predictionio" target="blank">GitHub</a></li><li><a href="mailto:user-subscribe@predictionio.apache.org" target="blank">Subscribe to User Mailing List</a></li><li><a href="//stackoverflow.com/questions/tagged/predictionio" target="blank">Stackoverflow</a></li></ul></div></div><div class="col-md-6 footer-link-column"><div class="footer-link-column-row"><h4>Contribute</h4><ul><li><a href="//predictionio.apache.org/community/contribute-code/" target="blank">Contrib
 ute</a></li><li><a href="//github.com/apache/predictionio" target="blank">Source Code</a></li><li><a href="//issues.apache.org/jira/browse/PIO" target="blank">Bug Tracker</a></li><li><a href="mailto:dev-subscribe@predictionio.apache.org" target="blank">Subscribe to Development Mailing List</a></li></ul></div></div></div><div class="row"><div class="col-md-12 footer-link-column"><p>Apache PredictionIO, PredictionIO, Apache, the Apache feather logo, and the Apache PredictionIO project logo are either registered trademarks or trademarks of The Apache Software Foundation in the United States and other countries.</p><p>All other marks mentioned may be trademarks or registered trademarks of their respective owners.</p></div></div></div><div id="footer-bottom"><div class="container"><div class="row"><div class="col-md-12"><div id="footer-logo-wrapper"><img alt="PredictionIO" src="/images/logos/logo-white-d1e9c6e6.png"/><span>®</span></div><div id="social-icons-wrapper"><a class="github-bu
 tton" href="https://github.com/apache/predictionio" data-style="mega" data-count-href="/apache/predictionio/stargazers" data-count-api="/repos/apache/predictionio#stargazers_count" data-count-aria-label="# stargazers on GitHub" aria-label="Star apache/predictionio on GitHub">Star</a> <a class="github-button" href="https://github.com/apache/predictionio/fork" data-icon="octicon-git-branch" data-style="mega" data-count-href="/apache/predictionio/network" data-count-api="/repos/apache/predictionio#forks_count" data-count-aria-label="# forks on GitHub" aria-label="Fork apache/predictionio on GitHub">Fork</a> <script id="github-bjs" async="" defer="" src="https://buttons.github.io/buttons.js"></script><a href="https://twitter.com/predictionio" target="blank"><img alt="PredictionIO on Twitter" src="/images/icons/twitter-ea9dc152.png"/></a> <a href="https://www.facebook.com/predictionio" target="blank"><img alt="PredictionIO on Facebook" src="/images/icons/facebook-5c57939c.png"/></a> </di
 v></div></div></div></div></footer></div><script>(function(w,d,t,u,n,s,e){w['SwiftypeObject']=n;w[n]=w[n]||function(){
 (w[n].q=w[n].q||[]).push(arguments);};s=d.createElement(t);
 e=d.getElementsByTagName(t)[0];s.async=1;s.src=u;e.parentNode.insertBefore(s,e);
 })(window,document,'script','//s.swiftypecdn.com/install/v1/st.js','_st');