Front End Development - mdoroudi/TraceHealth GitHub Wiki
Setup
Install Node
brew install node
Install npm
if this command doesn't work, download the script from http://npmjs.org/install.sh and run sh on it.
curl http://npmjs.org/install.sh | sh
http://howtonode.org/05896bb828f0d7e9251dd5b4cfd72350896990bd/introduction-to-npm
Install bower
npm install -g bower
Site Dependency Installation
External dependencies are managed using bower. Running the following command to take care of everything
bower install
Technologies
HTML
We generate HTML pages using haml, and haml_coffee_assets for client-side templates. Static pages that can be viewed without a login (about, team, security, etc) should be served by Rails and so written in haml. These pages should be saved in /app/views in the normal fashion for Rails. Information about writing and including client-side templates will be included in the Javascript section.
CSS
Stylesheets are generated using SCSS. SCSS files live in /app/assets/stylesheets. To have a stylesheet included in the application, make sure to import it in the main stylesheet file, application.css.scss
Javascript
Code Architecture
The front end of the application is organized using Backbone.js. Modular development is done through RequireJS. To configure RequireJS, edit /config/requirejs.yml. Note: after editing requriejs.yml, the development server needs to be restarted before the changes take affect (the auto-reload won't catch the change).
Testing
Jasmine is used for testing. To run tests, go to localhost:3000/jamsine in your web browser. Dependencies that exist only for testing should be configured in specRunner.coffee, not requirejs.yml.