You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@zeppelin.apache.org by zj...@apache.org on 2020/12/24 14:36:06 UTC

svn commit: r1884775 [8/49] - in /zeppelin/site/docs: 0.9.0-SNAPSHOT/ 0.9.0/ 0.9.0/assets/ 0.9.0/assets/themes/ 0.9.0/assets/themes/zeppelin/ 0.9.0/assets/themes/zeppelin/bootstrap/ 0.9.0/assets/themes/zeppelin/bootstrap/css/ 0.9.0/assets/themes/zeppel...

Added: zeppelin/site/docs/0.9.0/development/helium/overview.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.9.0/development/helium/overview.html?rev=1884775&view=auto
==============================================================================
--- zeppelin/site/docs/0.9.0/development/helium/overview.html (added)
+++ zeppelin/site/docs/0.9.0/development/helium/overview.html Thu Dec 24 14:36:01 2020
@@ -0,0 +1,326 @@
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>Apache Zeppelin 0.9.0 Documentation: Helium</title>
+    <meta name="description" content="">
+    <meta name="author" content="The Apache Software Foundation">
+
+    <!-- Enable responsive viewport -->
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
+    <!--[if lt IE 9]>
+    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+
+    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
+
+    <!-- Le styles -->
+    <link href="/docs/0.9.0/assets/themes/zeppelin/bootstrap/css/bootstrap.css" rel="stylesheet">
+    <link href="/docs/0.9.0/assets/themes/zeppelin/css/style.css?body=1" rel="stylesheet" type="text/css">
+    <link href="/docs/0.9.0/assets/themes/zeppelin/css/syntax.css" rel="stylesheet"  type="text/css" media="screen" /> 
+    <!-- Le fav and touch icons -->
+    <!-- Update these with your own images
+    <link rel="shortcut icon" href="images/favicon.ico">
+    <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
+    <link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
+    <link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
+    -->
+
+    <!-- Js -->
+    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/bootstrap/js/bootstrap.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/docs.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/anchor.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/toc.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/lunr.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/search.js"></script>    
+
+    <!-- atom & rss feed -->
+    <link href="/docs/0.9.0/atom.xml" type="application/atom+xml" rel="alternate" title="Sitewide ATOM Feed">
+    <link href="/docs/0.9.0/rss.xml" type="application/rss+xml" rel="alternate" title="Sitewide RSS Feed">
+  </head>
+
+  <body>
+    
+        <div id="menu" class="navbar navbar-inverse navbar-fixed-top" role="navigation">
+      <div class="container navbar-container">
+        <div class="navbar-header">
+          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+            <span class="sr-only">Toggle navigation</span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+          </button>
+          <div class="navbar-brand">
+            <a class="navbar-brand-main" href="http://zeppelin.apache.org">
+              <img src="/docs/0.9.0/assets/themes/zeppelin/img/zeppelin_logo.png" width="50"
+                   style="margin-top: -2px;" alt="I'm zeppelin">
+              <span style="margin-left: 5px; font-size: 27px;">Zeppelin</span>
+              <a class="navbar-brand-version" href="/docs/0.9.0"
+                 style="font-size: 15px; color: white;"> 0.9.0
+              </a>
+            </a>
+          </div>
+        </div>
+        <nav class="navbar-collapse collapse" role="navigation">
+          <ul class="nav navbar-nav">
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Quick Start <b class="caret"></b></a>
+              <ul class="dropdown-menu">
+                <li class="title"><span>Getting Started</span></li>
+                <li><a href="/docs/0.9.0/quickstart/install.html">Install</a></li>
+                <li><a href="/docs/0.9.0/quickstart/explore_ui.html">Explore UI</a></li>
+                <li><a href="/docs/0.9.0/quickstart/tutorial.html">Tutorial</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Run Mode</span></li>
+                <li><a href="/docs/0.9.0/quickstart/kubernetes.html">Kubernetes</a></li>
+                <li><a href="/docs/0.9.0/quickstart/docker.html">Docker</a></li>
+                <li><a href="/docs/0.9.0/quickstart/yarn.html">Yarn</a></li>
+                <li role="separator" class="divider"></li>
+                <li><a href="/docs/0.9.0/quickstart/spark_with_zeppelin.html">Spark with Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/quickstart/sql_with_zeppelin.html">SQL with Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/quickstart/python_with_zeppelin.html">Python with Zeppelin</a></li>
+              </ul>
+            </li>
+
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Usage<b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu">
+                <li class="title"><span>Dynamic Form</span></li>
+                <li><a href="/docs/0.9.0/usage/dynamic_form/intro.html">What is Dynamic Form?</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Display System</span></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#text">Text Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#html">HTML Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#table">Table Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#network">Network Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/angular_backend.html">Angular Display using Backend API</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/angular_frontend.html">Angular Display using Frontend API</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Interpreter</span></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/overview.html">Overview</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/interpreter_binding_mode.html">Interpreter Binding Mode</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/user_impersonation.html">User Impersonation</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/dependency_management.html">Dependency Management</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/installation.html">Installing Interpreters</a></li>
+                <!--<li><a href="/docs/0.9.0/usage/interpreter/dynamic_loading.html">Dynamic Interpreter Loading (Experimental)</a></li>-->
+                <li><a href="/docs/0.9.0/usage/interpreter/execution_hooks.html">Execution Hooks (Experimental)</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Other Features</span></li>
+                <li><a href="/docs/0.9.0/usage/other_features/publishing_paragraphs.html">Publishing Paragraphs</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/personalized_mode.html">Personalized Mode</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/customizing_homepage.html">Customizing Zeppelin Homepage</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/notebook_actions.html">Notebook Actions</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/cron_scheduler.html">Cron Scheduler</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/zeppelin_context.html">Zeppelin Context</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>REST API</span></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/interpreter.html">Interpreter API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/zeppelin_server.html">Zeppelin Server API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/notebook.html">Notebook API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/notebook_repository.html">Notebook Repository API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/configuration.html">Configuration API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/credential.html">Credential API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/helium.html">Helium API</a></li>
+              </ul>
+            </li>
+
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Setup<b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu">
+                <li class="title"><span>Basics</span></li>
+                <li><a href="/docs/0.9.0/setup/basics/how_to_build.html">How to Build Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/setup/basics/hadoop_integration.html">Hadoop Integration</a></li>
+                <li><a href="/docs/0.9.0/setup/basics/multi_user_support.html">Multi-user Support</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Deployment</span></li>
+                <!--<li><a href="/docs/0.9.0/setup/deployment/docker.html">Docker Image for Zeppelin</a></li>-->
+                <li><a href="/docs/0.9.0/setup/deployment/spark_cluster_mode.html#spark-standalone-mode">Spark Cluster Mode: Standalone</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/spark_cluster_mode.html#spark-on-yarn-mode">Spark Cluster Mode: YARN</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/spark_cluster_mode.html#spark-on-mesos-mode">Spark Cluster Mode: Mesos</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/flink_and_spark_cluster.html">Zeppelin with Flink, Spark Cluster</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/cdh.html">Zeppelin on CDH</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/virtual_machine.html">Zeppelin on VM: Vagrant</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Security</span></li>
+                <li><a href="/docs/0.9.0/setup/security/authentication_nginx.html">HTTP Basic Auth using NGINX</a></li>
+                <li><a href="/docs/0.9.0/setup/security/shiro_authentication.html">Shiro Authentication</a></li>
+                <li><a href="/docs/0.9.0/setup/security/notebook_authorization.html">Notebook Authorization</a></li>
+                <li><a href="/docs/0.9.0/setup/security/datasource_authorization.html">Data Source Authorization</a></li>
+                <li><a href="/docs/0.9.0/setup/security/http_security_headers.html">HTTP Security Headers</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Notebook Storage</span></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-local-git-repository">Git Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-s3">S3 Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-azure">Azure Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-oss">OSS Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-zeppelinhub">ZeppelinHub Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-mongodb">MongoDB Storage</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Operation</span></li>
+                <li><a href="/docs/0.9.0/setup/operation/configuration.html">Configuration</a></li>
+                <li><a href="/docs/0.9.0/setup/operation/proxy_setting.html">Proxy Setting</a></li>
+                <li><a href="/docs/0.9.0/setup/operation/upgrading.html">Upgrading</a></li>
+                <li><a href="/docs/0.9.0/setup/operation/trouble_shooting.html">Trouble Shooting</a></li>
+              </ul>
+            </li>
+
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Interpreter <b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu">
+                <li class="title"><span>Interpreters</span></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/overview.html">Overview</a></li>
+                <li role="separator" class="divider"></li>
+                <li><a href="/docs/0.9.0/interpreter/spark.html">Spark</a></li>
+                <li><a href="/docs/0.9.0/interpreter/jdbc.html">JDBC</a></li>
+                <li><a href="/docs/0.9.0/interpreter/python.html">Python</a></li>
+                <li><a href="/docs/0.9.0/interpreter/r.html">R</a></li>
+                <li role="separator" class="divider"></li>
+                <li><a href="/docs/0.9.0/interpreter/alluxio.html">Alluxio</a></li>
+                <li><a href="/docs/0.9.0/interpreter/beam.html">Beam</a></li>
+                <li><a href="/docs/0.9.0/interpreter/bigquery.html">BigQuery</a></li>
+                <li><a href="/docs/0.9.0/interpreter/cassandra.html">Cassandra</a></li>
+                <li><a href="/docs/0.9.0/interpreter/elasticsearch.html">Elasticsearch</a></li>
+                <li><a href="/docs/0.9.0/interpreter/flink.html">Flink</a></li>
+                <li><a href="/docs/0.9.0/interpreter/geode.html">Geode</a></li>
+                <li><a href="/docs/0.9.0/interpreter/groovy.html">Groovy</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hazelcastjet.html">Hazelcast Jet</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hbase.html">HBase</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hdfs.html">HDFS</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hive.html">Hive</a></li>
+                <li><a href="/docs/0.9.0/interpreter/ignite.html">Ignite</a></li>
+                <li><a href="/docs/0.9.0/interpreter/java.html">Java</a></li>
+                <li><a href="/docs/0.9.0/interpreter/jupyter.html">Jupyter</a></li>
+                <li><a href="/docs/0.9.0/interpreter/kotlin.html">Kotlin</a></li>
+                <li><a href="/docs/0.9.0/interpreter/kylin.html">Kylin</a></li>
+                <li><a href="/docs/0.9.0/interpreter/lens.html">Lens</a></li>
+                <li><a href="/docs/0.9.0/interpreter/livy.html">Livy</a></li>
+                <li><a href="/docs/0.9.0/interpreter/markdown.html">Markdown</a></li>
+                <li><a href="/docs/0.9.0/interpreter/mongodb.html">MongoDB</a></li>
+                <li><a href="/docs/0.9.0/interpreter/neo4j.html">Neo4j</a></li>
+                <li><a href="/docs/0.9.0/interpreter/pig.html">Pig</a></li>
+                <li><a href="/docs/0.9.0/interpreter/postgresql.html">Postgresql, HAWQ</a></li>
+                <li><a href="/docs/0.9.0/interpreter/scalding.html">Scalding</a></li>
+                <li><a href="/docs/0.9.0/interpreter/scio.html">Scio</a></li>
+                <li><a href="/docs/0.9.0/interpreter/shell.html">Shell</a></li>
+                <li><a href="/docs/0.9.0/interpreter/sparql.html">Sparql</a></li>
+                <li><a href="/docs/0.9.0/interpreter/submarine.html">Submarine</a></li>
+              </ul>
+            </li>
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">More<b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu" style="right: 0; left: auto;">
+                <li class="title"><span>Extending Zeppelin</span></li>
+                <li><a href="/docs/0.9.0/development/writing_zeppelin_interpreter.html">Writing Zeppelin Interpreter</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Helium (Experimental)</span></li>
+                <li><a href="/docs/0.9.0/development/helium/overview.html">Overview</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_application.html">Writing Helium Application</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_spell.html">Writing Helium Spell</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_visualization_basic.html">Writing Helium Visualization: Basics</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_visualization_transformation.html">Writing Helium Visualization: Transformation</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Contributing to Zeppelin</span></li>
+                <li><a href="/docs/0.9.0/setup/basics/how_to_build.html">How to Build Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/development/contribution/useful_developer_tools.html">Useful Developer Tools</a></li>
+                <li><a href="/docs/0.9.0/development/contribution/how_to_contribute_code.html">How to Contribute (code)</a></li>
+                <li><a href="/docs/0.9.0/development/contribution/how_to_contribute_website.html">How to Contribute (website)</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>External Resources</span></li>
+                <li><a target="_blank" href="https://zeppelin.apache.org/community.html">Mailing List</a></li>
+                <li><a target="_blank" href="https://cwiki.apache.org/confluence/display/ZEPPELIN/Zeppelin+Home">Apache Zeppelin Wiki</a></li>
+                <li><a target="_blank" href="http://stackoverflow.com/questions/tagged/apache-zeppelin">Stackoverflow Questions about Zeppelin</a></li>
+              </ul>
+            </li>
+            <li>
+              <a href="/docs/0.9.0/search.html" class="nav-search-link">
+                <span class="fa fa-search nav-search-icon"></span>
+              </a>
+            </li>
+          </ul>
+        </nav><!--/.navbar-collapse -->
+      </div>
+    </div>
+
+
+
+    <div class="content">
+      
+<!--<div class="hero-unit Helium">
+  <h1></h1>
+</div>
+-->
+
+<div class="row">
+  <div class="col-md-12">
+    <!--
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<h1>Helium Overview</h1>
+
+<div id="toc"></div>
+
+<h2>What is Helium?</h2>
+
+<p>Helium is a plugin system that can extend Zeppelin a lot. 
+For example, you can write <a href="./writing_spell.html">custom display system</a> or 
+install already published one in <a href="http://zeppelin.apache.org/helium_packages.html">Helium Online Registry</a>. </p>
+
+<p>Currently, Helium supports 4 types of package.</p>
+
+<ul>
+<li><a href="./writing_visualization_basic.html">Helium Visualization</a>: Adding a new chart type</li>
+<li><a href="./writing_spell.html">Helium Spell</a>: Adding new interpreter, display system running on browser</li>
+<li><a href="./writing_application.html">Helium Application</a> </li>
+<li><a href="../writing_zeppelin_interpreter.html">Helium Interpreter</a>: Adding a new custom interpreter</li>
+</ul>
+
+<h2>Configuration</h2>
+
+<p>Zeppelin ships with several builtin helium plugins which is located in $ZEPPELIN_HOME/heliums. If you want to try more types of heliums plugins,
+you can configure <code>zeppelin.helium.registry</code> to be <code>helium,https://s3.amazonaws.com/helium-package/helium.json</code> in zeppelin-site.xml. <code>https://s3.amazonaws.com/helium-package/helium.json</code> will be updated regularly.</p>
+
+  </div>
+</div>
+
+
+      <hr>
+      <footer>
+        <!-- <p>&copy; 2020 The Apache Software Foundation</p>-->
+      </footer>
+    </div>
+
+    
+
+
+  <script type="text/javascript">
+  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+  ga('create', 'UA-45176241-5', 'zeppelin.apache.org');
+  ga('require', 'linkid', 'linkid.js');
+  ga('send', 'pageview');
+
+</script>
+
+
+
+  </body>
+</html>
+

Propchange: zeppelin/site/docs/0.9.0/development/helium/overview.html
------------------------------------------------------------------------------
    svn:executable = *

Added: zeppelin/site/docs/0.9.0/development/helium/writing_application.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.9.0/development/helium/writing_application.html?rev=1884775&view=auto
==============================================================================
--- zeppelin/site/docs/0.9.0/development/helium/writing_application.html (added)
+++ zeppelin/site/docs/0.9.0/development/helium/writing_application.html Thu Dec 24 14:36:01 2020
@@ -0,0 +1,432 @@
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>Apache Zeppelin 0.9.0 Documentation: Writing a new Helium Application</title>
+    <meta name="description" content="Apache Zeppelin Application is a package that runs on Interpreter process and displays it's output inside of the notebook. Make your own Application in Apache Zeppelin is quite easy.">
+    <meta name="author" content="The Apache Software Foundation">
+
+    <!-- Enable responsive viewport -->
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
+    <!--[if lt IE 9]>
+    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+
+    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
+
+    <!-- Le styles -->
+    <link href="/docs/0.9.0/assets/themes/zeppelin/bootstrap/css/bootstrap.css" rel="stylesheet">
+    <link href="/docs/0.9.0/assets/themes/zeppelin/css/style.css?body=1" rel="stylesheet" type="text/css">
+    <link href="/docs/0.9.0/assets/themes/zeppelin/css/syntax.css" rel="stylesheet"  type="text/css" media="screen" /> 
+    <!-- Le fav and touch icons -->
+    <!-- Update these with your own images
+    <link rel="shortcut icon" href="images/favicon.ico">
+    <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
+    <link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
+    <link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
+    -->
+
+    <!-- Js -->
+    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/bootstrap/js/bootstrap.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/docs.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/anchor.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/toc.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/lunr.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/search.js"></script>    
+
+    <!-- atom & rss feed -->
+    <link href="/docs/0.9.0/atom.xml" type="application/atom+xml" rel="alternate" title="Sitewide ATOM Feed">
+    <link href="/docs/0.9.0/rss.xml" type="application/rss+xml" rel="alternate" title="Sitewide RSS Feed">
+  </head>
+
+  <body>
+    
+        <div id="menu" class="navbar navbar-inverse navbar-fixed-top" role="navigation">
+      <div class="container navbar-container">
+        <div class="navbar-header">
+          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+            <span class="sr-only">Toggle navigation</span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+          </button>
+          <div class="navbar-brand">
+            <a class="navbar-brand-main" href="http://zeppelin.apache.org">
+              <img src="/docs/0.9.0/assets/themes/zeppelin/img/zeppelin_logo.png" width="50"
+                   style="margin-top: -2px;" alt="I'm zeppelin">
+              <span style="margin-left: 5px; font-size: 27px;">Zeppelin</span>
+              <a class="navbar-brand-version" href="/docs/0.9.0"
+                 style="font-size: 15px; color: white;"> 0.9.0
+              </a>
+            </a>
+          </div>
+        </div>
+        <nav class="navbar-collapse collapse" role="navigation">
+          <ul class="nav navbar-nav">
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Quick Start <b class="caret"></b></a>
+              <ul class="dropdown-menu">
+                <li class="title"><span>Getting Started</span></li>
+                <li><a href="/docs/0.9.0/quickstart/install.html">Install</a></li>
+                <li><a href="/docs/0.9.0/quickstart/explore_ui.html">Explore UI</a></li>
+                <li><a href="/docs/0.9.0/quickstart/tutorial.html">Tutorial</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Run Mode</span></li>
+                <li><a href="/docs/0.9.0/quickstart/kubernetes.html">Kubernetes</a></li>
+                <li><a href="/docs/0.9.0/quickstart/docker.html">Docker</a></li>
+                <li><a href="/docs/0.9.0/quickstart/yarn.html">Yarn</a></li>
+                <li role="separator" class="divider"></li>
+                <li><a href="/docs/0.9.0/quickstart/spark_with_zeppelin.html">Spark with Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/quickstart/sql_with_zeppelin.html">SQL with Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/quickstart/python_with_zeppelin.html">Python with Zeppelin</a></li>
+              </ul>
+            </li>
+
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Usage<b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu">
+                <li class="title"><span>Dynamic Form</span></li>
+                <li><a href="/docs/0.9.0/usage/dynamic_form/intro.html">What is Dynamic Form?</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Display System</span></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#text">Text Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#html">HTML Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#table">Table Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#network">Network Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/angular_backend.html">Angular Display using Backend API</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/angular_frontend.html">Angular Display using Frontend API</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Interpreter</span></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/overview.html">Overview</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/interpreter_binding_mode.html">Interpreter Binding Mode</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/user_impersonation.html">User Impersonation</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/dependency_management.html">Dependency Management</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/installation.html">Installing Interpreters</a></li>
+                <!--<li><a href="/docs/0.9.0/usage/interpreter/dynamic_loading.html">Dynamic Interpreter Loading (Experimental)</a></li>-->
+                <li><a href="/docs/0.9.0/usage/interpreter/execution_hooks.html">Execution Hooks (Experimental)</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Other Features</span></li>
+                <li><a href="/docs/0.9.0/usage/other_features/publishing_paragraphs.html">Publishing Paragraphs</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/personalized_mode.html">Personalized Mode</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/customizing_homepage.html">Customizing Zeppelin Homepage</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/notebook_actions.html">Notebook Actions</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/cron_scheduler.html">Cron Scheduler</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/zeppelin_context.html">Zeppelin Context</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>REST API</span></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/interpreter.html">Interpreter API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/zeppelin_server.html">Zeppelin Server API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/notebook.html">Notebook API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/notebook_repository.html">Notebook Repository API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/configuration.html">Configuration API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/credential.html">Credential API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/helium.html">Helium API</a></li>
+              </ul>
+            </li>
+
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Setup<b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu">
+                <li class="title"><span>Basics</span></li>
+                <li><a href="/docs/0.9.0/setup/basics/how_to_build.html">How to Build Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/setup/basics/hadoop_integration.html">Hadoop Integration</a></li>
+                <li><a href="/docs/0.9.0/setup/basics/multi_user_support.html">Multi-user Support</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Deployment</span></li>
+                <!--<li><a href="/docs/0.9.0/setup/deployment/docker.html">Docker Image for Zeppelin</a></li>-->
+                <li><a href="/docs/0.9.0/setup/deployment/spark_cluster_mode.html#spark-standalone-mode">Spark Cluster Mode: Standalone</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/spark_cluster_mode.html#spark-on-yarn-mode">Spark Cluster Mode: YARN</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/spark_cluster_mode.html#spark-on-mesos-mode">Spark Cluster Mode: Mesos</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/flink_and_spark_cluster.html">Zeppelin with Flink, Spark Cluster</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/cdh.html">Zeppelin on CDH</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/virtual_machine.html">Zeppelin on VM: Vagrant</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Security</span></li>
+                <li><a href="/docs/0.9.0/setup/security/authentication_nginx.html">HTTP Basic Auth using NGINX</a></li>
+                <li><a href="/docs/0.9.0/setup/security/shiro_authentication.html">Shiro Authentication</a></li>
+                <li><a href="/docs/0.9.0/setup/security/notebook_authorization.html">Notebook Authorization</a></li>
+                <li><a href="/docs/0.9.0/setup/security/datasource_authorization.html">Data Source Authorization</a></li>
+                <li><a href="/docs/0.9.0/setup/security/http_security_headers.html">HTTP Security Headers</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Notebook Storage</span></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-local-git-repository">Git Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-s3">S3 Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-azure">Azure Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-oss">OSS Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-zeppelinhub">ZeppelinHub Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-mongodb">MongoDB Storage</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Operation</span></li>
+                <li><a href="/docs/0.9.0/setup/operation/configuration.html">Configuration</a></li>
+                <li><a href="/docs/0.9.0/setup/operation/proxy_setting.html">Proxy Setting</a></li>
+                <li><a href="/docs/0.9.0/setup/operation/upgrading.html">Upgrading</a></li>
+                <li><a href="/docs/0.9.0/setup/operation/trouble_shooting.html">Trouble Shooting</a></li>
+              </ul>
+            </li>
+
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Interpreter <b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu">
+                <li class="title"><span>Interpreters</span></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/overview.html">Overview</a></li>
+                <li role="separator" class="divider"></li>
+                <li><a href="/docs/0.9.0/interpreter/spark.html">Spark</a></li>
+                <li><a href="/docs/0.9.0/interpreter/jdbc.html">JDBC</a></li>
+                <li><a href="/docs/0.9.0/interpreter/python.html">Python</a></li>
+                <li><a href="/docs/0.9.0/interpreter/r.html">R</a></li>
+                <li role="separator" class="divider"></li>
+                <li><a href="/docs/0.9.0/interpreter/alluxio.html">Alluxio</a></li>
+                <li><a href="/docs/0.9.0/interpreter/beam.html">Beam</a></li>
+                <li><a href="/docs/0.9.0/interpreter/bigquery.html">BigQuery</a></li>
+                <li><a href="/docs/0.9.0/interpreter/cassandra.html">Cassandra</a></li>
+                <li><a href="/docs/0.9.0/interpreter/elasticsearch.html">Elasticsearch</a></li>
+                <li><a href="/docs/0.9.0/interpreter/flink.html">Flink</a></li>
+                <li><a href="/docs/0.9.0/interpreter/geode.html">Geode</a></li>
+                <li><a href="/docs/0.9.0/interpreter/groovy.html">Groovy</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hazelcastjet.html">Hazelcast Jet</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hbase.html">HBase</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hdfs.html">HDFS</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hive.html">Hive</a></li>
+                <li><a href="/docs/0.9.0/interpreter/ignite.html">Ignite</a></li>
+                <li><a href="/docs/0.9.0/interpreter/java.html">Java</a></li>
+                <li><a href="/docs/0.9.0/interpreter/jupyter.html">Jupyter</a></li>
+                <li><a href="/docs/0.9.0/interpreter/kotlin.html">Kotlin</a></li>
+                <li><a href="/docs/0.9.0/interpreter/kylin.html">Kylin</a></li>
+                <li><a href="/docs/0.9.0/interpreter/lens.html">Lens</a></li>
+                <li><a href="/docs/0.9.0/interpreter/livy.html">Livy</a></li>
+                <li><a href="/docs/0.9.0/interpreter/markdown.html">Markdown</a></li>
+                <li><a href="/docs/0.9.0/interpreter/mongodb.html">MongoDB</a></li>
+                <li><a href="/docs/0.9.0/interpreter/neo4j.html">Neo4j</a></li>
+                <li><a href="/docs/0.9.0/interpreter/pig.html">Pig</a></li>
+                <li><a href="/docs/0.9.0/interpreter/postgresql.html">Postgresql, HAWQ</a></li>
+                <li><a href="/docs/0.9.0/interpreter/scalding.html">Scalding</a></li>
+                <li><a href="/docs/0.9.0/interpreter/scio.html">Scio</a></li>
+                <li><a href="/docs/0.9.0/interpreter/shell.html">Shell</a></li>
+                <li><a href="/docs/0.9.0/interpreter/sparql.html">Sparql</a></li>
+                <li><a href="/docs/0.9.0/interpreter/submarine.html">Submarine</a></li>
+              </ul>
+            </li>
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">More<b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu" style="right: 0; left: auto;">
+                <li class="title"><span>Extending Zeppelin</span></li>
+                <li><a href="/docs/0.9.0/development/writing_zeppelin_interpreter.html">Writing Zeppelin Interpreter</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Helium (Experimental)</span></li>
+                <li><a href="/docs/0.9.0/development/helium/overview.html">Overview</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_application.html">Writing Helium Application</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_spell.html">Writing Helium Spell</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_visualization_basic.html">Writing Helium Visualization: Basics</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_visualization_transformation.html">Writing Helium Visualization: Transformation</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Contributing to Zeppelin</span></li>
+                <li><a href="/docs/0.9.0/setup/basics/how_to_build.html">How to Build Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/development/contribution/useful_developer_tools.html">Useful Developer Tools</a></li>
+                <li><a href="/docs/0.9.0/development/contribution/how_to_contribute_code.html">How to Contribute (code)</a></li>
+                <li><a href="/docs/0.9.0/development/contribution/how_to_contribute_website.html">How to Contribute (website)</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>External Resources</span></li>
+                <li><a target="_blank" href="https://zeppelin.apache.org/community.html">Mailing List</a></li>
+                <li><a target="_blank" href="https://cwiki.apache.org/confluence/display/ZEPPELIN/Zeppelin+Home">Apache Zeppelin Wiki</a></li>
+                <li><a target="_blank" href="http://stackoverflow.com/questions/tagged/apache-zeppelin">Stackoverflow Questions about Zeppelin</a></li>
+              </ul>
+            </li>
+            <li>
+              <a href="/docs/0.9.0/search.html" class="nav-search-link">
+                <span class="fa fa-search nav-search-icon"></span>
+              </a>
+            </li>
+          </ul>
+        </nav><!--/.navbar-collapse -->
+      </div>
+    </div>
+
+
+
+    <div class="content">
+      
+<!--<div class="hero-unit Writing a new Helium Application">
+  <h1></h1>
+</div>
+-->
+
+<div class="row">
+  <div class="col-md-12">
+    <!--
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<h1>Writing a new Application</h1>
+
+<div id="toc"></div>
+
+<h2>What is Apache Zeppelin Application</h2>
+
+<p>Apache Zeppelin Application is a package that runs on Interpreter process and displays it&#39;s output inside of the notebook. While application runs on Interpreter process, it&#39;s able to access resources provided by Interpreter through ResourcePool. Output is always rendered by AngularDisplaySystem. Therefore application provides all the possiblities of making interactive graphical application that uses data and processing power of any Interpreter.</p>
+
+<h2>Make your own Application</h2>
+
+<p>Writing Application means extending <code>org.apache.zeppelin.helium.Application</code>. You can use your favorite IDE and language while Java class files are packaged into jar. <code>Application</code> class looks like</p>
+<div class="highlight"><pre><code class="java language-java" data-lang="java"><span class="cm">/**</span>
+<span class="cm"> * Constructor. Invoked when application is loaded</span>
+<span class="cm"> */</span>
+<span class="kd">public</span> <span class="nf">Application</span><span class="o">(</span><span class="n">ApplicationContext</span> <span class="n">context</span><span class="o">);</span>
+
+<span class="cm">/**</span>
+<span class="cm"> * Invoked when there&#39;re (possible) updates in required resource set.</span>
+<span class="cm"> * i.e. invoked after application load and after paragraph finishes.</span>
+<span class="cm"> */</span>
+<span class="kd">public</span> <span class="kd">abstract</span> <span class="kt">void</span> <span class="nf">run</span><span class="o">(</span><span class="n">ResourceSet</span> <span class="n">args</span><span class="o">);</span>
+
+<span class="cm">/**</span>
+<span class="cm"> * Invoked before application unload.</span>
+<span class="cm"> * Application is automatically unloaded with paragraph/notebook removal</span>
+<span class="cm"> */</span>
+<span class="kd">public</span> <span class="kd">abstract</span> <span class="kt">void</span> <span class="nf">unload</span><span class="o">();</span>
+</code></pre></div>
+<p>You can check example applications under <a href="https://github.com/apache/incubator-zeppelin/tree/master/zeppelin-examples">./zeppelin-examples</a> directory.</p>
+
+<h2>Development mode</h2>
+
+<p>In the development mode, you can run your Application in your IDE as a normal java application and see the result inside of Zeppelin notebook.</p>
+
+<p><code>org.apache.zeppelin.helium.ZeppelinApplicationDevServer</code> can run Zeppelin Application in development mode.</p>
+<div class="highlight"><pre><code class="java language-java" data-lang="java"><span class="c1">// entry point for development mode</span>
+<span class="kd">public</span> <span class="kd">static</span> <span class="kt">void</span> <span class="nf">main</span><span class="o">(</span><span class="n">String</span><span class="o">[]</span> <span class="n">args</span><span class="o">)</span> <span class="kd">throws</span> <span class="n">Exception</span> <span class="o">{</span>
+
+  <span class="c1">// add resources for development mode</span>
+  <span class="n">LocalResourcePool</span> <span class="n">pool</span> <span class="o">=</span> <span class="k">new</span> <span class="n">LocalResourcePool</span><span class="o">(</span><span class="s">&quot;dev&quot;</span><span class="o">);</span>
+  <span class="n">pool</span><span class="o">.</span><span class="na">put</span><span class="o">(</span><span class="s">&quot;date&quot;</span><span class="o">,</span> <span class="k">new</span> <span class="n">Date</span><span class="o">());</span>
+
+  <span class="c1">// run application in devlopment mode with given resource</span>
+  <span class="c1">// in this case, Clock.class.getName() will be the application class name  </span>
+  <span class="n">org</span><span class="o">.</span><span class="na">apache</span><span class="o">.</span><span class="na">zeppelin</span><span class="o">.</span><span class="na">helium</span><span class="o">.</span><span class="na">ZeppelinApplicationDevServer</span> <span class="n">devServer</span> <span class="o">=</span> <span class="k">new</span> <span class="n">org</span><span class="o">.</span><span class="na">apache</span><span class="o">.</span><span class="na">zeppelin</span><span class="o">.</span><span class="na">helium</span><span class="o">.</span><span class="na">ZeppelinApplicationDevServer</span><span class="o">(</span>
+    <span class="n">Clock</span><span class="o">.</span><span class="na">class</span><span class="o">.</span><span class="na">getName</span><span class="o">(),</span> <span class="n">pool</span><span class="o">.</span><span class="na">getAll</span><span class="o">());</span>
+
+  <span class="c1">// start development mode</span>
+  <span class="n">devServer</span><span class="o">.</span><span class="na">start</span><span class="o">();</span>
+  <span class="n">devServer</span><span class="o">.</span><span class="na">join</span><span class="o">();</span>
+<span class="o">}</span>
+</code></pre></div>
+<p>In the Zeppelin notebook, run <code>%dev run</code> will connect to application running in development mode.</p>
+
+<h2>Package file</h2>
+
+<p>Package file is a json file that provides information about the application.
+Json file contains the following information</p>
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="p">{</span>
+  <span class="nt">&quot;name&quot;</span> <span class="p">:</span> <span class="s2">&quot;[organization].[name]&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;description&quot;</span> <span class="p">:</span> <span class="s2">&quot;Description&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;artifact&quot;</span> <span class="p">:</span> <span class="s2">&quot;groupId:artifactId:version&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;className&quot;</span> <span class="p">:</span> <span class="s2">&quot;your.package.name.YourApplicationClass&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;resources&quot;</span> <span class="p">:</span> <span class="p">[</span>
+    <span class="p">[</span><span class="s2">&quot;resource.name&quot;</span><span class="p">,</span> <span class="s2">&quot;:resource.class.name&quot;</span><span class="p">],</span>
+    <span class="p">[</span><span class="s2">&quot;alternative.resource.name&quot;</span><span class="p">,</span> <span class="s2">&quot;:alternative.class.name&quot;</span><span class="p">]</span>
+  <span class="p">],</span>
+  <span class="nt">&quot;icon&quot;</span> <span class="p">:</span> <span class="s2">&quot;&lt;i class=&#39;icon&#39;&gt;&lt;/i&gt;&quot;</span>
+<span class="p">}</span>
+</code></pre></div>
+<h4>name</h4>
+
+<p>Name is a string in <code>[group].[name]</code> format.
+<code>[group]</code> and <code>[name]</code> allow only <code>[A-Za-z0-9_]</code>.
+Group is normally the name of an organization who creates this application.</p>
+
+<h4>description</h4>
+
+<p>A short description about the application</p>
+
+<h4>artifact</h4>
+
+<p>Location of the jar artifact.
+<code>&quot;groupId:artifactId:version&quot;</code> will load artifact from maven repository.
+If jar exists in the local filesystem, absolute/relative can be used.</p>
+
+<p>e.g.</p>
+
+<p>When artifact exists in Maven repository</p>
+<div class="highlight"><pre><code class="text language-text" data-lang="text">artifact: &quot;org.apache.zeppelin:zeppelin-examples:0.6.0&quot;
+</code></pre></div>
+<p>When artifact exists in the local filesystem</p>
+<div class="highlight"><pre><code class="text language-text" data-lang="text">artifact: &quot;zeppelin-example/target/zeppelin-example-0.6.0.jar&quot;
+</code></pre></div>
+<h4>className</h4>
+
+<p>Entry point. Class that extends <code>org.apache.zeppelin.helium.Application</code></p>
+
+<h4>resources</h4>
+
+<p>Two dimensional array that defines required resources by name or by className. Helium Application launcher will compare resources in the ResourcePool with the information in this field and suggest application only when all required resources are available in the ResourcePool.</p>
+
+<p>Resouce name is a string which will be compared with the name of objects in the ResourcePool. className is a string with &quot;:&quot; prepended, which will be compared with className of the objects in the ResourcePool.</p>
+
+<p>Application may require two or more resources. Required resources can be listed inside of the json array. For example, if the application requires object &quot;name1&quot;, &quot;name2&quot; and &quot;className1&quot; type of object to run, resources field can be</p>
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="err">resources:</span> <span class="p">[</span>
+  <span class="p">[</span> <span class="s2">&quot;name1&quot;</span><span class="p">,</span> <span class="s2">&quot;name2&quot;</span><span class="p">,</span> <span class="s2">&quot;:className1&quot;</span><span class="p">,</span> <span class="err">...</span><span class="p">]</span>
+<span class="p">]</span>
+</code></pre></div>
+<p>If Application can handle alternative combination of required resources, alternative set can be listed as below.</p>
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="err">resources:</span> <span class="p">[</span>
+  <span class="p">[</span> <span class="s2">&quot;name&quot;</span><span class="p">,</span> <span class="s2">&quot;:className&quot;</span><span class="p">],</span>
+  <span class="p">[</span> <span class="s2">&quot;altName&quot;</span><span class="p">,</span> <span class="s2">&quot;:altClassName1&quot;</span><span class="p">],</span>
+  <span class="err">...</span>
+<span class="p">]</span>
+</code></pre></div>
+<p>Easier way to understand this scheme is</p>
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="err">resources:</span> <span class="p">[</span>
+   <span class="p">[</span> <span class="err">&#39;resource&#39;</span> <span class="err">AND</span> <span class="err">&#39;resource&#39;</span> <span class="err">AND</span> <span class="err">...</span> <span class="p">]</span> <span class="err">OR</span>
+   <span class="p">[</span> <span class="err">&#39;resource&#39;</span> <span class="err">AND</span> <span class="err">&#39;resource&#39;</span> <span class="err">AND</span> <span class="err">...</span> <span class="p">]</span> <span class="err">OR</span>
+   <span class="err">...</span>
+<span class="p">]</span>
+</code></pre></div>
+<h4>icon</h4>
+
+<p>Icon to be used on the application button. String in this field will be rendered as a HTML tag.</p>
+
+<p>e.g.</p>
+<div class="highlight"><pre><code class="text language-text" data-lang="text">icon: &quot;&lt;i class=&#39;fa fa-clock-o&#39;&gt;&lt;/i&gt;&quot;
+</code></pre></div>
+  </div>
+</div>
+
+
+      <hr>
+      <footer>
+        <!-- <p>&copy; 2020 The Apache Software Foundation</p>-->
+      </footer>
+    </div>
+
+    
+
+
+  <script type="text/javascript">
+  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+  ga('create', 'UA-45176241-5', 'zeppelin.apache.org');
+  ga('require', 'linkid', 'linkid.js');
+  ga('send', 'pageview');
+
+</script>
+
+
+
+  </body>
+</html>
+

Propchange: zeppelin/site/docs/0.9.0/development/helium/writing_application.html
------------------------------------------------------------------------------
    svn:executable = *

Added: zeppelin/site/docs/0.9.0/development/helium/writing_spell.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.9.0/development/helium/writing_spell.html?rev=1884775&view=auto
==============================================================================
--- zeppelin/site/docs/0.9.0/development/helium/writing_spell.html (added)
+++ zeppelin/site/docs/0.9.0/development/helium/writing_spell.html Thu Dec 24 14:36:01 2020
@@ -0,0 +1,491 @@
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>Apache Zeppelin 0.9.0 Documentation: Writing a new Helium Spell</title>
+    <meta name="description" content="Spell is a kind of interpreter that runs on browser not on backend. So, technically it's the frontend interpreter. ">
+    <meta name="author" content="The Apache Software Foundation">
+
+    <!-- Enable responsive viewport -->
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
+    <!--[if lt IE 9]>
+    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+
+    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
+
+    <!-- Le styles -->
+    <link href="/docs/0.9.0/assets/themes/zeppelin/bootstrap/css/bootstrap.css" rel="stylesheet">
+    <link href="/docs/0.9.0/assets/themes/zeppelin/css/style.css?body=1" rel="stylesheet" type="text/css">
+    <link href="/docs/0.9.0/assets/themes/zeppelin/css/syntax.css" rel="stylesheet"  type="text/css" media="screen" /> 
+    <!-- Le fav and touch icons -->
+    <!-- Update these with your own images
+    <link rel="shortcut icon" href="images/favicon.ico">
+    <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
+    <link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
+    <link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
+    -->
+
+    <!-- Js -->
+    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/bootstrap/js/bootstrap.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/docs.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/anchor.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/toc.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/lunr.min.js"></script>
+    <script src="/docs/0.9.0/assets/themes/zeppelin/js/search.js"></script>    
+
+    <!-- atom & rss feed -->
+    <link href="/docs/0.9.0/atom.xml" type="application/atom+xml" rel="alternate" title="Sitewide ATOM Feed">
+    <link href="/docs/0.9.0/rss.xml" type="application/rss+xml" rel="alternate" title="Sitewide RSS Feed">
+  </head>
+
+  <body>
+    
+        <div id="menu" class="navbar navbar-inverse navbar-fixed-top" role="navigation">
+      <div class="container navbar-container">
+        <div class="navbar-header">
+          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+            <span class="sr-only">Toggle navigation</span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+          </button>
+          <div class="navbar-brand">
+            <a class="navbar-brand-main" href="http://zeppelin.apache.org">
+              <img src="/docs/0.9.0/assets/themes/zeppelin/img/zeppelin_logo.png" width="50"
+                   style="margin-top: -2px;" alt="I'm zeppelin">
+              <span style="margin-left: 5px; font-size: 27px;">Zeppelin</span>
+              <a class="navbar-brand-version" href="/docs/0.9.0"
+                 style="font-size: 15px; color: white;"> 0.9.0
+              </a>
+            </a>
+          </div>
+        </div>
+        <nav class="navbar-collapse collapse" role="navigation">
+          <ul class="nav navbar-nav">
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Quick Start <b class="caret"></b></a>
+              <ul class="dropdown-menu">
+                <li class="title"><span>Getting Started</span></li>
+                <li><a href="/docs/0.9.0/quickstart/install.html">Install</a></li>
+                <li><a href="/docs/0.9.0/quickstart/explore_ui.html">Explore UI</a></li>
+                <li><a href="/docs/0.9.0/quickstart/tutorial.html">Tutorial</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Run Mode</span></li>
+                <li><a href="/docs/0.9.0/quickstart/kubernetes.html">Kubernetes</a></li>
+                <li><a href="/docs/0.9.0/quickstart/docker.html">Docker</a></li>
+                <li><a href="/docs/0.9.0/quickstart/yarn.html">Yarn</a></li>
+                <li role="separator" class="divider"></li>
+                <li><a href="/docs/0.9.0/quickstart/spark_with_zeppelin.html">Spark with Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/quickstart/sql_with_zeppelin.html">SQL with Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/quickstart/python_with_zeppelin.html">Python with Zeppelin</a></li>
+              </ul>
+            </li>
+
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Usage<b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu">
+                <li class="title"><span>Dynamic Form</span></li>
+                <li><a href="/docs/0.9.0/usage/dynamic_form/intro.html">What is Dynamic Form?</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Display System</span></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#text">Text Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#html">HTML Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#table">Table Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/basic.html#network">Network Display</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/angular_backend.html">Angular Display using Backend API</a></li>
+                <li><a href="/docs/0.9.0/usage/display_system/angular_frontend.html">Angular Display using Frontend API</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Interpreter</span></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/overview.html">Overview</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/interpreter_binding_mode.html">Interpreter Binding Mode</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/user_impersonation.html">User Impersonation</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/dependency_management.html">Dependency Management</a></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/installation.html">Installing Interpreters</a></li>
+                <!--<li><a href="/docs/0.9.0/usage/interpreter/dynamic_loading.html">Dynamic Interpreter Loading (Experimental)</a></li>-->
+                <li><a href="/docs/0.9.0/usage/interpreter/execution_hooks.html">Execution Hooks (Experimental)</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Other Features</span></li>
+                <li><a href="/docs/0.9.0/usage/other_features/publishing_paragraphs.html">Publishing Paragraphs</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/personalized_mode.html">Personalized Mode</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/customizing_homepage.html">Customizing Zeppelin Homepage</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/notebook_actions.html">Notebook Actions</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/cron_scheduler.html">Cron Scheduler</a></li>
+                <li><a href="/docs/0.9.0/usage/other_features/zeppelin_context.html">Zeppelin Context</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>REST API</span></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/interpreter.html">Interpreter API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/zeppelin_server.html">Zeppelin Server API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/notebook.html">Notebook API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/notebook_repository.html">Notebook Repository API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/configuration.html">Configuration API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/credential.html">Credential API</a></li>
+                <li><a href="/docs/0.9.0/usage/rest_api/helium.html">Helium API</a></li>
+              </ul>
+            </li>
+
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Setup<b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu">
+                <li class="title"><span>Basics</span></li>
+                <li><a href="/docs/0.9.0/setup/basics/how_to_build.html">How to Build Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/setup/basics/hadoop_integration.html">Hadoop Integration</a></li>
+                <li><a href="/docs/0.9.0/setup/basics/multi_user_support.html">Multi-user Support</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Deployment</span></li>
+                <!--<li><a href="/docs/0.9.0/setup/deployment/docker.html">Docker Image for Zeppelin</a></li>-->
+                <li><a href="/docs/0.9.0/setup/deployment/spark_cluster_mode.html#spark-standalone-mode">Spark Cluster Mode: Standalone</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/spark_cluster_mode.html#spark-on-yarn-mode">Spark Cluster Mode: YARN</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/spark_cluster_mode.html#spark-on-mesos-mode">Spark Cluster Mode: Mesos</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/flink_and_spark_cluster.html">Zeppelin with Flink, Spark Cluster</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/cdh.html">Zeppelin on CDH</a></li>
+                <li><a href="/docs/0.9.0/setup/deployment/virtual_machine.html">Zeppelin on VM: Vagrant</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Security</span></li>
+                <li><a href="/docs/0.9.0/setup/security/authentication_nginx.html">HTTP Basic Auth using NGINX</a></li>
+                <li><a href="/docs/0.9.0/setup/security/shiro_authentication.html">Shiro Authentication</a></li>
+                <li><a href="/docs/0.9.0/setup/security/notebook_authorization.html">Notebook Authorization</a></li>
+                <li><a href="/docs/0.9.0/setup/security/datasource_authorization.html">Data Source Authorization</a></li>
+                <li><a href="/docs/0.9.0/setup/security/http_security_headers.html">HTTP Security Headers</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Notebook Storage</span></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-local-git-repository">Git Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-s3">S3 Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-azure">Azure Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-oss">OSS Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-zeppelinhub">ZeppelinHub Storage</a></li>
+                <li><a href="/docs/0.9.0/setup/storage/storage.html#notebook-storage-in-mongodb">MongoDB Storage</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Operation</span></li>
+                <li><a href="/docs/0.9.0/setup/operation/configuration.html">Configuration</a></li>
+                <li><a href="/docs/0.9.0/setup/operation/proxy_setting.html">Proxy Setting</a></li>
+                <li><a href="/docs/0.9.0/setup/operation/upgrading.html">Upgrading</a></li>
+                <li><a href="/docs/0.9.0/setup/operation/trouble_shooting.html">Trouble Shooting</a></li>
+              </ul>
+            </li>
+
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">Interpreter <b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu">
+                <li class="title"><span>Interpreters</span></li>
+                <li><a href="/docs/0.9.0/usage/interpreter/overview.html">Overview</a></li>
+                <li role="separator" class="divider"></li>
+                <li><a href="/docs/0.9.0/interpreter/spark.html">Spark</a></li>
+                <li><a href="/docs/0.9.0/interpreter/jdbc.html">JDBC</a></li>
+                <li><a href="/docs/0.9.0/interpreter/python.html">Python</a></li>
+                <li><a href="/docs/0.9.0/interpreter/r.html">R</a></li>
+                <li role="separator" class="divider"></li>
+                <li><a href="/docs/0.9.0/interpreter/alluxio.html">Alluxio</a></li>
+                <li><a href="/docs/0.9.0/interpreter/beam.html">Beam</a></li>
+                <li><a href="/docs/0.9.0/interpreter/bigquery.html">BigQuery</a></li>
+                <li><a href="/docs/0.9.0/interpreter/cassandra.html">Cassandra</a></li>
+                <li><a href="/docs/0.9.0/interpreter/elasticsearch.html">Elasticsearch</a></li>
+                <li><a href="/docs/0.9.0/interpreter/flink.html">Flink</a></li>
+                <li><a href="/docs/0.9.0/interpreter/geode.html">Geode</a></li>
+                <li><a href="/docs/0.9.0/interpreter/groovy.html">Groovy</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hazelcastjet.html">Hazelcast Jet</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hbase.html">HBase</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hdfs.html">HDFS</a></li>
+                <li><a href="/docs/0.9.0/interpreter/hive.html">Hive</a></li>
+                <li><a href="/docs/0.9.0/interpreter/ignite.html">Ignite</a></li>
+                <li><a href="/docs/0.9.0/interpreter/java.html">Java</a></li>
+                <li><a href="/docs/0.9.0/interpreter/jupyter.html">Jupyter</a></li>
+                <li><a href="/docs/0.9.0/interpreter/kotlin.html">Kotlin</a></li>
+                <li><a href="/docs/0.9.0/interpreter/kylin.html">Kylin</a></li>
+                <li><a href="/docs/0.9.0/interpreter/lens.html">Lens</a></li>
+                <li><a href="/docs/0.9.0/interpreter/livy.html">Livy</a></li>
+                <li><a href="/docs/0.9.0/interpreter/markdown.html">Markdown</a></li>
+                <li><a href="/docs/0.9.0/interpreter/mongodb.html">MongoDB</a></li>
+                <li><a href="/docs/0.9.0/interpreter/neo4j.html">Neo4j</a></li>
+                <li><a href="/docs/0.9.0/interpreter/pig.html">Pig</a></li>
+                <li><a href="/docs/0.9.0/interpreter/postgresql.html">Postgresql, HAWQ</a></li>
+                <li><a href="/docs/0.9.0/interpreter/scalding.html">Scalding</a></li>
+                <li><a href="/docs/0.9.0/interpreter/scio.html">Scio</a></li>
+                <li><a href="/docs/0.9.0/interpreter/shell.html">Shell</a></li>
+                <li><a href="/docs/0.9.0/interpreter/sparql.html">Sparql</a></li>
+                <li><a href="/docs/0.9.0/interpreter/submarine.html">Submarine</a></li>
+              </ul>
+            </li>
+            <li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">More<b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu" style="right: 0; left: auto;">
+                <li class="title"><span>Extending Zeppelin</span></li>
+                <li><a href="/docs/0.9.0/development/writing_zeppelin_interpreter.html">Writing Zeppelin Interpreter</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Helium (Experimental)</span></li>
+                <li><a href="/docs/0.9.0/development/helium/overview.html">Overview</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_application.html">Writing Helium Application</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_spell.html">Writing Helium Spell</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_visualization_basic.html">Writing Helium Visualization: Basics</a></li>
+                <li><a href="/docs/0.9.0/development/helium/writing_visualization_transformation.html">Writing Helium Visualization: Transformation</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>Contributing to Zeppelin</span></li>
+                <li><a href="/docs/0.9.0/setup/basics/how_to_build.html">How to Build Zeppelin</a></li>
+                <li><a href="/docs/0.9.0/development/contribution/useful_developer_tools.html">Useful Developer Tools</a></li>
+                <li><a href="/docs/0.9.0/development/contribution/how_to_contribute_code.html">How to Contribute (code)</a></li>
+                <li><a href="/docs/0.9.0/development/contribution/how_to_contribute_website.html">How to Contribute (website)</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span>External Resources</span></li>
+                <li><a target="_blank" href="https://zeppelin.apache.org/community.html">Mailing List</a></li>
+                <li><a target="_blank" href="https://cwiki.apache.org/confluence/display/ZEPPELIN/Zeppelin+Home">Apache Zeppelin Wiki</a></li>
+                <li><a target="_blank" href="http://stackoverflow.com/questions/tagged/apache-zeppelin">Stackoverflow Questions about Zeppelin</a></li>
+              </ul>
+            </li>
+            <li>
+              <a href="/docs/0.9.0/search.html" class="nav-search-link">
+                <span class="fa fa-search nav-search-icon"></span>
+              </a>
+            </li>
+          </ul>
+        </nav><!--/.navbar-collapse -->
+      </div>
+    </div>
+
+
+
+    <div class="content">
+      
+<!--<div class="hero-unit Writing a new Helium Spell">
+  <h1></h1>
+</div>
+-->
+
+<div class="row">
+  <div class="col-md-12">
+    <!--
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<h1>Writing a new Spell</h1>
+
+<div id="toc"></div>
+
+<h2>What is Apache Zeppelin Spell</h2>
+
+<p>Spell is a kind of interpreter that runs on browser not on backend. So, technically it&#39;s the frontend interpreter.
+It can provide many benefits.</p>
+
+<ul>
+<li>Spell is pluggable frontend interpreter. So it can be installed and removed easily using helium registry.</li>
+<li>Every spell is written in javascript. It means you can use existing javascript libraries whatever you want.</li>
+<li>Spell runs on browser like display system (<code>%html</code>, <code>%table</code>). In other words, every spell can be used as display system as well.</li>
+</ul>
+
+<h2>How it works</h2>
+
+<p>Helium Spell works like <a href="./writing_visualization_basic.html">Helium Visualization</a>.</p>
+
+<ul>
+<li>Every helium packages are loaded from central (online) registry or local registry</li>
+<li>You can see loaded packages in <code>/helium</code> page.</li>
+<li>When you enable a spell, it&#39;s built from server and sent to client</li>
+<li>Finally it will be loaded into browser.</li>
+</ul>
+
+<h2>How to use spell</h2>
+
+<h3>1. Enabling</h3>
+
+<p>Find a spell what you want to use in <code>/helium</code> package and click <code>Enable</code> button.</p>
+
+<p><img class="img-responsive" style="width:70%" src="/docs/0.9.0/assets/themes/zeppelin/img/docs-img/writing_spell_registered.png" /></p>
+
+<h3>2. Using</h3>
+
+<p>Spell works like an interpreter. Use the <code>MAGIC</code> value to execute spell in a note. (you might need to refresh after enabling)
+For example, Use <code>%echo</code> for the Echo Spell.</p>
+
+<p><img class="img-responsive" style="width:70%" src="/docs/0.9.0/assets/themes/zeppelin/img/docs-img/writing_spell_using.gif" /></p>
+
+<h2>Write a new Spell</h2>
+
+<p>Making a new spell is similar to <a href="./writing_visualization_basic.html#write-new-visualization">Helium Visualization#write-new-visualization</a>.</p>
+
+<ul>
+<li>Add framework dependency called zeppelin-spell into <code>package.json</code></li>
+<li>Write code using framework</li>
+<li>Publish your spell to <a href="%22https://www.npmjs.com/%22">npm</a></li>
+</ul>
+
+<h3>1. Create a npm package</h3>
+
+<p>Create a <a href="https://docs.npmjs.com/files/package.json">package.json</a> in new directory for spell.</p>
+
+<ul>
+<li>You have to add a framework called <code>zeppelin-spell</code> as a dependency to create spell (<a href="https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/spell">zeppelin-spell</a>)</li>
+<li>Also, you can add any dependencies you want to utilise.</li>
+</ul>
+
+<p>Here&#39;s an example</p>
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="p">{</span>
+  <span class="nt">&quot;name&quot;</span><span class="p">:</span> <span class="s2">&quot;zeppelin-echo-spell&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;description&quot;</span><span class="p">:</span> <span class="s2">&quot;Zeppelin Echo Spell (example)&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;version&quot;</span><span class="p">:</span> <span class="s2">&quot;1.0.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;main&quot;</span><span class="p">:</span> <span class="s2">&quot;index&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;author&quot;</span><span class="p">:</span> <span class="s2">&quot;&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;license&quot;</span><span class="p">:</span> <span class="s2">&quot;Apache-2.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;dependencies&quot;</span><span class="p">:</span> <span class="p">{</span>
+    <span class="nt">&quot;zeppelin-spell&quot;</span><span class="p">:</span> <span class="s2">&quot;*&quot;</span>
+  <span class="p">},</span>
+  <span class="nt">&quot;helium&quot;</span><span class="p">:</span> <span class="p">{</span>
+    <span class="nt">&quot;icon&quot;</span> <span class="p">:</span> <span class="s2">&quot;&lt;i class=&#39;fa fa-repeat&#39;&gt;&lt;/i&gt;&quot;</span><span class="p">,</span>
+    <span class="nt">&quot;spell&quot;</span><span class="p">:</span> <span class="p">{</span>
+      <span class="nt">&quot;magic&quot;</span><span class="p">:</span> <span class="s2">&quot;%echo&quot;</span><span class="p">,</span>
+      <span class="nt">&quot;usage&quot;</span><span class="p">:</span> <span class="s2">&quot;%echo &lt;TEXT&gt;&quot;</span>
+    <span class="p">}</span>
+  <span class="p">}</span>
+<span class="p">}</span>
+</code></pre></div>
+<h3>2. Write spell using framework</h3>
+
+<p>Here are some examples you can refer</p>
+
+<ul>
+<li><a href="https://github.com/apache/zeppelin/blob/master/zeppelin-examples/zeppelin-example-spell-echo/index.js">Echo Spell</a></li>
+<li><a href="https://github.com/apache/zeppelin/blob/master/zeppelin-examples/zeppelin-example-spell-markdown/index.js">Markdown Spell: Using library</a></li>
+<li><a href="https://github.com/apache/zeppelin/blob/master/zeppelin-examples/zeppelin-example-spell-flowchart/index.js">Flowchart Spell: Using DOM</a></li>
+<li><a href="https://github.com/apache/zeppelin/blob/master/zeppelin-examples/zeppelin-example-spell-translator/index.js">Google Translation API Spell: Using API (returning promise)</a></li>
+</ul>
+
+<p>Now, you need to write code to create spell which processing text.</p>
+<div class="highlight"><pre><code class="js language-js" data-lang="js"><span class="kr">import</span> <span class="p">{</span>
+    <span class="nx">SpellBase</span><span class="p">,</span>
+    <span class="nx">SpellResult</span><span class="p">,</span>
+    <span class="nx">DefaultDisplayType</span><span class="p">,</span>
+<span class="p">}</span> <span class="nx">from</span> <span class="s1">&#39;zeppelin-spell&#39;</span><span class="p">;</span>
+
+<span class="kr">export</span> <span class="k">default</span> <span class="kr">class</span> <span class="nx">EchoSpell</span> <span class="kr">extends</span> <span class="nx">SpellBase</span> <span class="p">{</span>
+    <span class="nx">constructor</span><span class="p">()</span> <span class="p">{</span>
+        <span class="cm">/** pass magic to super class&#39;s constructor parameter */</span>
+        <span class="kr">super</span><span class="p">(</span><span class="s2">&quot;%echo&quot;</span><span class="p">);</span>
+    <span class="p">}</span>
+
+    <span class="nx">interpret</span><span class="p">(</span><span class="nx">paragraphText</span><span class="p">)</span> <span class="p">{</span>
+        <span class="kr">const</span> <span class="nx">processed</span> <span class="o">=</span> <span class="nx">paragraphText</span> <span class="o">+</span> <span class="s1">&#39;!&#39;</span><span class="p">;</span>
+
+        <span class="cm">/**</span>
+<span class="cm">         * should return `SpellResult` which including `data` and `type`</span>
+<span class="cm">         * default type is `TEXT` if you don&#39;t specify.  </span>
+<span class="cm">         */</span>
+        <span class="k">return</span> <span class="k">new</span> <span class="nx">SpellResult</span><span class="p">(</span><span class="nx">processed</span><span class="p">);</span>
+    <span class="p">}</span>
+<span class="p">}</span>
+</code></pre></div>
+<p>Here is another example. Let&#39;s say we want to create markdown spell. First of all, we should add a dependency for markdown in package.json</p>
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="err">//</span> <span class="err">package.json</span>
+ <span class="s2">&quot;dependencies&quot;</span><span class="err">:</span> <span class="p">{</span>
+    <span class="nt">&quot;markdown&quot;</span><span class="p">:</span> <span class="s2">&quot;0.5.0&quot;</span><span class="p">,</span>
+    <span class="nt">&quot;zeppelin-spell&quot;</span><span class="p">:</span> <span class="s2">&quot;*&quot;</span>
+  <span class="p">}</span><span class="err">,</span>
+</code></pre></div>
+<p>And here is spell code.</p>
+<div class="highlight"><pre><code class="js language-js" data-lang="js"><span class="kr">import</span> <span class="p">{</span>
+    <span class="nx">SpellBase</span><span class="p">,</span>
+    <span class="nx">SpellResult</span><span class="p">,</span>
+    <span class="nx">DefaultDisplayType</span><span class="p">,</span>
+<span class="p">}</span> <span class="nx">from</span> <span class="s1">&#39;zeppelin-spell&#39;</span><span class="p">;</span>
+
+<span class="kr">import</span> <span class="nx">md</span> <span class="nx">from</span> <span class="s1">&#39;markdown&#39;</span><span class="p">;</span>
+
+<span class="kr">const</span> <span class="nx">markdown</span> <span class="o">=</span> <span class="nx">md</span><span class="p">.</span><span class="nx">markdown</span><span class="p">;</span>
+
+<span class="kr">export</span> <span class="k">default</span> <span class="kr">class</span> <span class="nx">MarkdownSpell</span> <span class="kr">extends</span> <span class="nx">SpellBase</span> <span class="p">{</span>
+    <span class="nx">constructor</span><span class="p">()</span> <span class="p">{</span>
+        <span class="kr">super</span><span class="p">(</span><span class="s2">&quot;%markdown&quot;</span><span class="p">);</span>
+    <span class="p">}</span>
+
+    <span class="nx">interpret</span><span class="p">(</span><span class="nx">paragraphText</span><span class="p">)</span> <span class="p">{</span>
+        <span class="kr">const</span> <span class="nx">parsed</span> <span class="o">=</span> <span class="nx">markdown</span><span class="p">.</span><span class="nx">toHTML</span><span class="p">(</span><span class="nx">paragraphText</span><span class="p">);</span>
+
+        <span class="cm">/**</span>
+<span class="cm">         * specify `DefaultDisplayType.HTML` since `parsed` will contain DOM</span>
+<span class="cm">         * otherwise it will be rendered as `DefaultDisplayType.TEXT` (default)</span>
+<span class="cm">         */</span>
+        <span class="k">return</span> <span class="k">new</span> <span class="nx">SpellResult</span><span class="p">(</span><span class="nx">parsed</span><span class="p">,</span> <span class="nx">DefaultDisplayType</span><span class="p">.</span><span class="nx">HTML</span><span class="p">);</span>
+    <span class="p">}</span>
+<span class="p">}</span>
+</code></pre></div>
+<ul>
+<li>You might want to manipulate DOM directly (e.g google d3.js), then refer <a href="https://github.com/apache/zeppelin/blob/master/zeppelin-examples/zeppelin-example-spell-flowchart/index.js">Flowchart Spell</a></li>
+<li>You might want to return promise not string (e.g API call), then refer <a href="https://github.com/apache/zeppelin/blob/master/zeppelin-examples/zeppelin-example-spell-translator/index.js">Google Translation API Spell</a></li>
+</ul>
+
+<h3>3. Create <strong>Helium package file</strong> for local deployment</h3>
+
+<p>You don&#39;t want to publish your package every time you make a change in your spell. Zeppelin provides local deploy.
+The only thing you need to do is creating a <strong>Helium Package file</strong> (JSON) for local deploy.
+It&#39;s automatically created when you publish to npm repository but in local case, you should make it by yourself.</p>
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="p">{</span>
+  <span class="nt">&quot;type&quot;</span> <span class="p">:</span> <span class="s2">&quot;SPELL&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;name&quot;</span> <span class="p">:</span> <span class="s2">&quot;zeppelin-echo-spell&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;version&quot;</span><span class="p">:</span> <span class="s2">&quot;1.0.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;description&quot;</span> <span class="p">:</span> <span class="s2">&quot;Return just what receive (example)&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;artifact&quot;</span> <span class="p">:</span> <span class="s2">&quot;./zeppelin-examples/zeppelin-example-spell-echo&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;license&quot;</span> <span class="p">:</span> <span class="s2">&quot;Apache-2.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;spell&quot;</span><span class="p">:</span> <span class="p">{</span>
+    <span class="nt">&quot;magic&quot;</span><span class="p">:</span> <span class="s2">&quot;%echo&quot;</span><span class="p">,</span>
+    <span class="nt">&quot;usage&quot;</span><span class="p">:</span> <span class="s2">&quot;%echo &lt;TEXT&gt;&quot;</span>
+  <span class="p">}</span>
+<span class="p">}</span>
+</code></pre></div>
+<ul>
+<li>Place this file in your local registry directory (default <code>$ZEPPELIN_HOME/helium</code>).</li>
+<li><code>type</code> should be <code>SPELL</code></li>
+<li>Make sure that <code>artifact</code> should be same as your spell directory.</li>
+<li>You can get information about other fields in <a href="./writing_visualization_basic.html#3-create-helium-package-file-and-locally-deploy">Helium Visualization#3-create-helium-package-file-and-locally-deploy</a>.</li>
+</ul>
+
+<h3>4. Run in dev mode</h3>
+<div class="highlight"><pre><code class="bash language-bash" data-lang="bash"><span class="nb">cd </span>zeppelin-web
+yarn run dev:helium
+</code></pre></div>
+<p>You can browse localhost:9000. Every time refresh your browser, Zeppelin will rebuild your spell and reload changes.</p>
+
+<h3>5. Publish your spell to the npm repository</h3>
+
+<p>See <a href="https://docs.npmjs.com/getting-started/publishing-npm-packages">Publishing npm packages</a></p>
+
+  </div>
+</div>
+
+
+      <hr>
+      <footer>
+        <!-- <p>&copy; 2020 The Apache Software Foundation</p>-->
+      </footer>
+    </div>
+
+    
+
+
+  <script type="text/javascript">
+  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+  ga('create', 'UA-45176241-5', 'zeppelin.apache.org');
+  ga('require', 'linkid', 'linkid.js');
+  ga('send', 'pageview');
+
+</script>
+
+
+
+  </body>
+</html>
+

Propchange: zeppelin/site/docs/0.9.0/development/helium/writing_spell.html
------------------------------------------------------------------------------
    svn:executable = *