A template for starting front-end projects. Webpack for require
system, build
pipeline, and development server. Boostrap and Handlebars.js included. No
front-end frameworks included.
Install with npm install
.
At the beginning of each cohort, update the versions in
package.json
by replace all versions with a glob (*
) and
running npm update --save && npm update --save-dev
. You may wish to test these
changes by deleting the node_modules
directory and running npm install
.
Fix any conflicts.
- Download this template.
- Unzip and rename the template directory.
- Empty
README.md
and fill with your own content. - Move into the new project and
git init
. - Install dependencies with
npm install
.
Dependencies are stored in package.json
.
Do not configure grunt
packages directly in the
Gruntfile.js
. Instead, store configurations in the
grunt
directory. You won't need a top-level key, since that's
generated by the Gruntfile.js
based on the filename of the configuration
object stored in the grunt
directory.
Developers should store JavaScript files in assets/scripts
.
The "manifest" or entry-point is
assets/scripts/index.js
. In general, only
application initialization goes in this file. It's normal for developers to
start putting all code in this file, but encourage them to break out different
responsibilities and use the require
syntax put references where they're
needed.
Developers should set config.apiOrigins.production
(and
config.apiOrigins.development
if it differs from the default). With
apiOrigins
set, developers may rely on config.apiOrigin
as the base for API
URLs.
Developers should store styles in assets/styles
and load them
from assets/styles/index.scss
.
Developers should use getFormFields to retrieve form data to send to an API.
To deploy a browser-template based SPA, run grunt deploy
.
Developers should run these often!
grunt nag
or justgrunt
: runs code quality analysis tools on your code and complainsgrunt reformat
: reformats all your code in a standard stylegrunt <server|serve|s>
: generates bundles, watches, and livereloadsgrunt test
: runs any automated tests, depends ongrunt build
grunt build
: place bundled styles and scripts whereindex.html
can find them
- All content is licensed under a CCBYNCSA 4.0 license.
- All software code is licensed under GNU GPLv3. For commercial use or alternative licensing, please contact legal@ga.co.