To build the project, execute
./node_modules/bin/brunch build in the project
directory. The results of the build are output to the
A production build should append the command option
/node_modules/bin/brunch build --optimize to produce a production deployment.
During development, to continuously rebuild the project on every change,
./node_modules/bin/brunch watch. To run the simple http development
./node_modules/bin/brunch watch --server. You can
visit http://localhost:3333/develop.html to load your app.
git-flow workflow supportConfigure
$ cd my-app $ git flow init Which branch should be used for bringing forth production releases? - master Branch name for production releases: [master] Branch name for "next release" development: [develop] How to name your supporting branch prefixes? Feature branches? [feature/] Release branches? [release/] Hotfix branches? [hotfix/] Support branches? [support/] Version tag prefix? 
- There is no such thing as architectural guidelines.
- Controllers are responsible for interacting with model objects; a view should not directly interact with model objects.
- Views are responsible for handling the DOM, not the controller. If the controller needs to walk the view hierarchy, you have sinned.
- Views communicate with the controller, not directly with the model objects.
- View template context is automatically bound to its controller.
- The router coordinates application state and transtitions between states.
- Consider creating custom Ember.Components instead of views where you can minimize dependencies on the context (e.g., controller).
- Verify your code using JSHint. JSHint is available as a editor/IDE plugin.
- Indent using soft tabs set at 2 spaces. Continuation indents should be set to 4 spaces.
- Use the strict mode pragma liberally (i.e.,
- For the model, view, and controller, implement corresponding unit tests in the matching sub-directory of the
- The unit tests use the TDD expect assertion style. Unfortunately, the BDD/should assertion style is not compatible with IE.
config.coffee karma.conf.js package.json README.md /app/ assets/ index.html development.html img/ glyphicons-halflings-white.png glyphicons-halflings.png scripts/ ember.js ember.min.js components/ index.js controllers/ index.js models/ index.js routes/ index.js map.js styles/ components/ application.styl development.styl templates/ components/ about.hbs application.hbs views/ index.js app.js initialize.js /test/ assets/ test/ index.html scripts/ jquery.min.js load-tests.js test-browser.js controllers/ models/ vendor/ scripts/ chai-1.6.1.js chai-as-promised-3.3.1.js mocha-1.11.0.js sinon-1.7.1.js sinon-chai-2.4.0.js styles/ mocha-1.11.0.css views/ /vendor/ scripts/ bootstrap.js handlebars.js styles/ bootstrap.css
config.coffeecontains your app configuration. This is where you configure what Plugins / Languages to use and what rules are applied to them.
app/and subdirectories (excluding
app/assetscontains images / static files. The contents of the directory are copied to
public/without any modification.
app/views/index.jsare loaded in
initialize.jsand are responsible for loading their respective classes.
- Pre-compiled templates in
app/templates/are automatically registered in Ember.TEMPLATES.
- Component templates are placed in
app/templates/componentsand are automatically registered in Ember.TEMPLATES.
test/contains unit tests.
vendor/contains all third-party code. The code wouldn’t be wrapped in modules, it would be loaded directly into the browser.
The generated output is placed in the
public/ (by default) directory when
brunch build or
brunch watch is executed.
Behavior and Logic
jQuery is used by Ember to simplify DOM interaction. The application uses jQuery primarily for Ajax interactions with the remote resource servers.
Layout and Styles
Application specific styles are written using the Stylus language and pre-processor. Twitter Bootstrap is used to provide the application a default style for common elements. Handlebars wraps the HTML layout and integrate with the logic programming in the Ember JS framework.
Stylus is an expressive language that generates CSS. Stylus provides simplified selector expressions; variables and interpolation, operators, functions, and mixins.
Nib is a library of pre-built Stylus mixins, utilities, components, and gradient image generation.
Unit and integration tests are placed in the
test directory. To run the tests interactively in the browser:
brunch watch --serverin your project directory.
- Visit http://localhost:3333/test in your browser.
To run headless tests, install and use karma.
Start the karma server
$ ./node_modules/.bin/karma start karma.conf.js --browsers Chrome,Firefox
Execute one run of the test suite
$ ./node_modules/.bin/karma run
- Chai is a BDD / TDD assertion library support assert, expect, and should matchers.
- Sinon-Chai extends Chai with assertions for the Sinon.JS mocking library.