generator-footwork

FootworkJS skeleton application generator.

For more info please visit the official site: http://footworkjs.com

Installation

1. Verify that Yeoman is installed

npm install -g yo

2. Install this generator

npm install -g generator-footwork

3. Ensure that Gulp is installed. If you need to install it, use the following command:

npm install -g gulp

4. Ensure that Bower is installed. If you need to install it, use the following command:

npm install -g bower

5. Create a new project folder and move into it in the terminal

mkdir YOUR_PROJECT_NAME
cd YOUR_PROJECT_NAME

6. Execute the following command

yo footwork

Building the CSS and JS and/or watching for changes

Out of the box, this application will not require the javascript to be re-built every time you change it because it loads them by default in their uncombined forms. The CSS however needs to be recompiled after each change. To build these do one of the following:

# Compile the LESS code into CSS (outputs to css/app.css)
gulp build-css

# Compile and minify the JS code (outputs to scripts/main-build.js)
gulp build-js

# Do both CSS and JS compilations (the default task)
gulp

# Watch the CSS and Javascript files for changes and recompile as needed
gulp watch

# Watch the CSS files for changes and recompile as needed
gulp watch-css

# Watch the Javascript files for changes and recompile as needed
gulp watch-js

Running this application

If you do not have a webserver ready to host this application, then you can use the included static file server. To run that do the following:

gulp webserver

You can now access the site at: http://localhost:8000 (or whatever host you have it running on, this assumes localhost)

Running Unit Tests

The included test runner is Karma, to run the unit tests you can either:

Run them via Karma directly (recommended). Note that you need to have Karma CLI installed:

# If you need to install Karma CLI, use the following command
sudo npm install -g karma-cli

# Once Karma CLI is installed, you can run the tests with:
karma start

Run them manually via Gulp:

# Run the unit tests under /tests
gulp tests

Run them automatically with a watch task which runs the tests everytime a change is detected:

gulp watch-tests

Run them automatically with a watch task which compiles everything and runs the tests everytime a change is detected:

# Watch the Javascript files for changes, rebuild and run tests as needed
gulp watch-and-test

NOTE: If you get a 'No binary for PhantomJS browser on your platform' error, do the following:

sudo npm install -g phantomjs
export PHANTOMJS_BIN=`which phantomjs`

License

MIT © Jonathan Newman