First install all dependencies
$ npm install
$ bower install
Then run gulp to build and watch files during development
$ gulp
Finally start the harp server from your project directory:
$ harp server
And navigate to http://localhost:9000
in your browser to preview your work:
All action happens in the public
directory, so let's have a look at its structure:
public
├── 200.jade
├── _build # main _build directory for global app stuff
│ ├── _bootstrap.less # Enable/disable Bootstrap 3 modules you need
│ ├── _mixins.less # Place to put your custom mixins
│ ├── _variables.less # Customize the Bootstrap 3 variables
│ ├── app.config.router.js # Configure the router
│ ├── app.less # Global app styles that you want Gulp to add to /public/build/css/app.css
│ ├── app.module.js # Main 'app' module
│ └── app.module.spec.js # Sample unit tests for main 'app' module
├── build # Build directory where files built by Gulp are saved
│ ├── css
│ │ ├── app.css # All .less files from _build directories are concatenated here
│ │ └── app.min.css # Minified version for production
│ └── js
│ ├── app.js # All .js files from _build directories are concatenated here
│ └── app.min.js # Minified version for production
└── components
├── footer # Example footer component
│ ├── _build # Component _build directory with files that you want Gulp to build
│ │ └── footer.less # Styles that you want to add to /public/build/css/app.css
│ └── footer.jade # Jade file will be compiled to HTML automatically
├── header # Example header component
│ ├── _build # Component _build directory with files that you want Gulp to build
│ │ └── header.less # Styles that you want to add to /public/build/css/app.css
│ └── header.jade # Jade file will be compiled to HTML automatically
└── homepage # Example homepage component
├── _build # Component _build directory with files that you want Gulp to build
│ └── homepage.routes.js # JavaScript code that you want to add to /public/build/js/app.js
└── homepage.jade # Jade file will be compiled to HTML automatically
To run unit tests:
$ gulp test
This will run all tests in public/**/_build/**/*.spec.js
.
To generate documentation:
$ gulp docs