Frontend is a light-weight, no-bloat frontend development framework. It’s purpose is to give developers a jumpstart utilizing Gulp to automate repetitive tasks, a variables file to quickly configure base elements and a standards-driven approach to help avoid spaghetti code while decreasing new developer ramp-up time.
If you’re viewing this at https://github.com/bmarshall511/frontend, you’re reading the documentation for the master branch. View documentation for the latest release.
Unlike other frontend frameworks like Foundation or Bootstrap, Frontend doesn’t restrict you to any one in particular. You could think of Frontend like a base framework for others like Foundation and Bootstrap. Use what you like, discard what you don’t — keeping your files well optimized.
Download the script here and include it (unless you are packaging scripts somehow else).
Navigate to the frontend directory in Terminal and run the following commands:
$ bundle installTo install gem dependencies
$ npm installTo install dependencies
$ gulp setupFor first-time setup
The following commands can be run in the frontend directory during development:
$ gulpCompiles for live environments
$ gulp compileCompiles then watches for changes to files to re-compile (useful during development)
$ gulp setupFirst-time setup (only run once or your variables will be overridden)
$ gulp variablesCreate a application variables file (only run once or your variables will be overridden)
gulp scripts-devfor development)
$ gulp compassCompiles Sass files (
gulp compass-devfor development)
$ gulp imagesMinifies images
$ gulp scss-lintLints SCSS files
$ gulp htmlminMinifies HTML documents (
gulp htmlmin-devfor development)
$ gulp uncssRemoves unused styles (needs to be configured & called, not used by default)
Check out the Contributing Guidelines.
For vulnerability reports, send an e-mail to
me at benmarshall dot me.
latesttag pointer to the latest commit
git tag -f latest
git push <remote> :refs/tags/latest
git push origin master --tags
gulp variablestask to automatically setup a application
.screen-reader-textstyles as an extendable (
$site-headerto fix variable naming conflicts.
gulp setuptask to automatically setup a application for the first time.