Mojito is completely written in ES6 (ECMAScript 6) which is the newest newest version of the ECMAScript standard. We suggest you to also use ES6. To make sure this new peace of technology runs on every browser we use a ES6 to ES5 compiler called Babel.

Mojito is available as a bower component. Bower is a package manager mainly used for web projects and can be installed via npm: npm install -g bower

When bower is ready on your computer you can install mojito with the command: bower install --save-dev mojito

There are may ways you can setup you mojito, but we suggest the following two:

The Netural Generator has Mojito built in. Just answer the question if you want to use Mojito with yes ;)

After you have installed Mojito, create the following in you scripts folder:

• a file called mojitoSetup.js
• a folder called controllers where all your Mojito Controller are in.

To build your ES6 application have a look at mojitos gulp build using babel and browserify

Now import mojitoSetup in your regular JavaScript file (eg. main.js)

import mojitoSetup from './mojitoSetup';

| scripts  
| -- main.js  
| -- mojitoSetup.js  
| -- controllers  
| -- -- YourFirstController.js  

In your mojitoSetup.js you need the following code:
First, import Mojito like that. Eventually you have to adjust the path to your mojito installation

import Mojito from '../../bower_components/mojito/lib/main';

After that you are able to configure some Mojito options. To use shorthand syntax in your HTML for example.

Mojito.ENV.HTMLDATA_SHORTHAND = true;

So your setup file should look like that:

/*
 *  Import Mojito
 */
import Mojito from '../../bower_components/mojito/lib/main';

/*
 *  Use shorthand syntax for data attributes
 */
Mojito.ENV.HTMLDATA_SHORTHAND = true;

/*
 *  Import and register Controller here
 */

Now your are ready to create the first controller

→ Next: Controller
← Previous: Home