Yeoman generator for Express, Marionette and Backbone with AMD
app/ --> client side files
/bower_components --> bower installs
/images
/scripts
/styles --> scss files
/templates --> handlebar templates
server/ --> node server files
test/ --> unittesting
First make sure you have MongoDB, Node, Npm, Yeoman, Bower and Grunt installed.
Install mongoDB with:
$ brew install mongodb
Or visit http://www.mongodb.org/
Visit nodejs.org to install node and NPM
Install phantomJS with:
$ brew install phantomjs
Or visit http://phantomjs.org/
To install Yeoman, Bower and Grunt run:
$ npm install -g yo grunt-cli bower
Install mocha-phantomjs:
$ npm install -g mocha-phantomjs
Install mocha generator:
$ npm install (-g) generator-mocha-amd
Install marionette generator
$ npm install (-g) generator-marionette
To bootstrap a new project simply run:
$ yo marionette
You have option to include the full express server OR just the marionette generators with a minimal server to develop and run test. No SASS/CSS in the latter.
To start the app run:
$ grunt
The biggest change in this release is the automatic unit test generation as part of the marionette-generator. The Marionette generator calls upon the mocha-amd generator. The default grunt task will automatically run all unit test files via phantom JS. You can also use the browser at localhost:1234/test. Test file generation looks something like the following:
The generator is most useful using the --create-all flag. In the example:
$ yo marionette:compositeview peopleview --itemview personview --create-all
You will get the following files:
You can generate routers too with
$ yo marionette:router router-name
To add a Backbone model to the project use the model generator like this
$ yo marionette:model model-name
Or to inherit from an existing model
$ yo marionette:model model-name --inherit model-name
To add a Backbone collection to the project use collection generator
$ yo marionette:collection collection-name
You can link the collection with an existent model
$ yo marionette:collection collection-name model-name
Or may be you want to create both, model and collection on one step
$ yo marionette:collection collection-name --model model-name --create-all
Or you may want to inherit from another collection
$ yo marionette:collection collection-name --model model-name --inherit collection-name --create-all
Backbone works with view definitions, to create one use this command. It is recommended to use Marionette views instead of the standard Backbone view
$ yo marionette:view view-name
Create a Marionette ItemView and link to an existing template at location templates/[template-location]
$ yo marionette:itemview view-name
You may want to inherit from another itemview
$ yo marionette:itemview view-name --inherit view-name
Or maybe you want to create both, itemView and template on one step
$ yo marionette:itemview view-name --create-all
Create a Marionette CollectionView that is associated to an existing itemview
$ yo marionette:collectionview view-name --itemview itemview-name
Or inherit from another collectionview
$ yo marionette:collectionview view-name --itemview itemview-name --inherit view-name
Or maybe you want to create both, itemview (with template) and collectionview.
$ yo marionette:collectionview view-name --itemview itemview-name --create-all
Create a Marionette CompositeView
$ yo marionette:compositeview view-name --itemview itemview-name
Or inherit from another CompositeView
$ yo marionette:compositeview view-name --itemview itemview-name --inherit view-name
Or maybe you want to create all, itemview and compositeview and both templates.
$ yo marionette:compositeview view-name --itemview itemview-name --create-all
Create a Marionette Region
$ yo marionette:region region-name
Or inherit from another Region
$ yo marionette:region region-name --inherit region-name
Create a Marionette Layout and link to an existing template at location templates/[template-location]
$ yo marionette:layout layout-name
Or inherit from another layout
$ yo marionette:layout layout-name --inherit layout-name
Or maybe you want to create both, Layout and template on one step
$ yo marionette:layout layout-name --create-all
Create a Marionette Controller
$ yo marionette:controller controller-name
Or inherit from another Controller
$ yo marionette:controller controller-name --inherit controller-name
Create a handle bars tmpl
$ yo marionette:tmpl tmpl-name --tmplLocation tmpl-location