Zeppelin WebApplication is using AngularJS as main Framework, and Grunt and Bower as helpers.
So you might want to get familiar with it. Here is a good start (There is obviously plenty more ressources to learn)
But don't worry, JSHint will make you remember it for the most part.
There is also a rule of No JQuery except in directives, If you want to include a library, please search for its angularJS directive first and if it doesn't exist, make one :)
src folder: Contains the Source code for Zeppelin WebApplicationdist folder: Contains the compiled code after using grunt buildThe src folder is organized as such:
The code is now organized in a component type of architecture, where everything is logically grouped.
In order to understand what is contained inside the .js files without opening it, we use some name conventions:
When we talk about Component architecture, we think about grouping files together in a logical way.
A component can then be made of multiple files like .html, .css or any other file type mentioned above.
Related components can be grouped as sub-component as long as they are used in that component only.
Contains the application app.js and page related components.
The only resctiction being that a component in the app folder is not used anywhere else
The components folder is here to contains any reusable component (used more than once)
Fonts files and their css are mixed together in the fonts folder
As we do not use yeoman to generate controllers or other type of files with this new structure, we need to do some includes manually in index.html in order to use dev mode and compile correctly.
.js files needs to be injected between the tag <!-- build:js({.tmp,src}) scripts/scripts.js --><!-- build:css(.tmp) styles/main.css -->bower install <plugin> --save
The file index.html will automatically update with the new bower_component
Example: ./bower install angular-nvd3
You should find that line in the index.html file
<script src="bower_components/angular-nvd3/dist/angular-nvd3.js"></script>