Google Git
Sign in
apache / aurora-website / refs/heads/asf-site / . / content / documentation / latest / development / ui / index.html
blob: 29c60e201171badf17f3f80da12d1acbb0a86db1 [file] [log] [blame]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Apache Aurora</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link href="/assets/css/main.css" rel="stylesheet">
<!-- Analytics -->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-45879646-1']);
_gaq.push(['_setDomainName', 'apache.org']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
<div class="container-fluid section-header">
<div class="container">
<div class="nav nav-bar">
<a href="/"><img src="/assets/img/aurora_logo_dkbkg.svg" width="300" alt="Transparent Apache Aurora logo with dark background"/></a>
<ul class="nav navbar-nav navbar-right">
<li><a href="/documentation/latest/">Documentation</a></li>
<li><a href="/community/">Community</a></li>
<li><a href="/downloads/">Downloads</a></li>
<li><a href="/blog/">Blog</a></li>
</ul>
</div>
</div>
</div>
<div class="container-fluid">
<div class="container content">
<div class="col-md-12 documentation">
<h5 class="page-header text-uppercase">Documentation
<select onChange="window.location.href='/documentation/' + this.value + '/development/ui/'"
value="latest">
<option value="0.22.0"
>
0.22.0
(latest)
</option>
<option value="0.21.0"
>
0.21.0
</option>
<option value="0.20.0"
>
0.20.0
</option>
<option value="0.19.1"
>
0.19.1
</option>
<option value="0.19.0"
>
0.19.0
</option>
<option value="0.18.1"
>
0.18.1
</option>
<option value="0.18.0"
>
0.18.0
</option>
<option value="0.17.0"
>
0.17.0
</option>
<option value="0.16.0"
>
0.16.0
</option>
<option value="0.15.0"
>
0.15.0
</option>
<option value="0.14.0"
>
0.14.0
</option>
<option value="0.13.0"
>
0.13.0
</option>
<option value="0.12.0"
>
0.12.0
</option>
<option value="0.11.0"
>
0.11.0
</option>
<option value="0.10.0"
>
0.10.0
</option>
<option value="0.9.0"
>
0.9.0
</option>
<option value="0.8.0"
>
0.8.0
</option>
<option value="0.7.0-incubating"
>
0.7.0-incubating
</option>
<option value="0.6.0-incubating"
>
0.6.0-incubating
</option>
<option value="0.5.0-incubating"
>
0.5.0-incubating
</option>
</select>
</h5>
<h1 id="developing-the-aurora-scheduler-ui">Developing the Aurora Scheduler UI</h1>
<h2 id="installing-bower-optional">Installing bower (optional)</h2>
<p>Third party JS libraries used in Aurora (located at 3rdparty/javascript/bower_components) are
managed by bower, a JS dependency manager. Bower is only required if you plan to add, remove or
update JS libraries. Bower can be installed using the following command:</p>
<pre class="highlight plaintext"><code>npm install -g bower
</code></pre>
<p>Bower depends on node.js and npm. The easiest way to install node on a mac is via brew:</p>
<pre class="highlight plaintext"><code>brew install node
</code></pre>
<p>For more node.js installation options refer to <a href="https://github.com/joyent/node/wiki/Installation">https://github.com/joyent/node/wiki/Installation</a>.</p>
<p>More info on installing and using bower can be found at: <a href="http://bower.io/">http://bower.io/</a>. Once installed, you can
use the following commands to view and modify the bower repo at
3rdparty/javascript/bower_components</p>
<pre class="highlight plaintext"><code>bower list
bower install &lt;library name&gt;
bower remove &lt;library name&gt;
bower update &lt;library name&gt;
bower help
</code></pre>
<h2 id="faster-iteration-in-vagrant">Faster Iteration in Vagrant</h2>
<p>The scheduler serves UI assets from the classpath. For production deployments this means the assets
are served from within a jar. However, for faster development iteration, the vagrant image is
configured to add the <code>scheduler</code> subtree of <code>/vagrant/dist/resources/main</code> to the head of
<code>CLASSPATH</code>. This path is configured as a shared filesystem to the path on the host system where
your Aurora repository lives. This means that any updates under <code>dist/resources/main/scheduler</code> in
your checkout will be reflected immediately in the UI served from within the vagrant image.</p>
<p>The one caveat to this is that this path is under <code>dist</code> not <code>src</code>. This is because the assets must
be processed by gradle before they can be served. So, unfortunately, you cannot just save your local
changes and see them reflected in the UI, you must first run <code>./gradlew processResources</code>. This is
less than ideal, but better than having to restart the scheduler after every change. Additionally,
gradle makes this process somewhat easier with the use of the <code>--continuous</code> flag. If you run:
<code>./gradlew processResources --continuous</code> gradle will monitor the filesystem for changes and run the
task automatically as necessary. This doesn&rsquo;t quite provide hot-reload capabilities, but it does
allow for &lt;5s from save to changes being visibile in the UI with no further action required on the
part of the developer.</p>
</div>
</div>
</div>
<div class="container-fluid section-footer buffer">
<div class="container">
<div class="row">
<div class="col-md-2 col-md-offset-1"><h3>Quick Links</h3>
<ul>
<li><a href="/downloads/">Downloads</a></li>
<li><a href="/community/">Mailing Lists</a></li>
<li><a href="http://issues.apache.org/jira/browse/AURORA">Issue Tracking</a></li>
<li><a href="/documentation/latest/contributing/">How To Contribute</a></li>
</ul>
</div>
<div class="col-md-2"><h3>The ASF</h3>
<ul>
<li><a href="http://www.apache.org/licenses/">License</a></li>
<li><a href="http://www.apache.org/foundation/sponsorship.html">Sponsorship</a></li>
<li><a href="http://www.apache.org/foundation/thanks.html">Thanks</a></li>
<li><a href="http://www.apache.org/security/">Security</a></li>
</ul>
</div>
<div class="col-md-6">
<p class="disclaimer">&copy; 2014-2017 <a href="http://www.apache.org/">Apache Software Foundation</a>. Licensed under the <a href="http://www.apache.org/licenses/">Apache License v2.0</a>. The <a href="https://www.flickr.com/photos/trondk/12706051375/">Aurora Borealis IX photo</a> displayed on the homepage is available under a <a href="https://creativecommons.org/licenses/by-nc-nd/2.0/">Creative Commons BY-NC-ND 2.0 license</a>. Apache, Apache Aurora, and the Apache feather logo are trademarks of The Apache Software Foundation.</p>
</div>
</div>
</div>
</body>
</html>