An easier workflow for faster better stronger websites
CSS JavaScript HTML
Latest commit ec52a01 Dec 18, 2015 @mrmrs Merge pull request #4 from chrisblum/patch-1
small typo
Permalink
Failed to load latest commit information.
css New compiled css. Mar 15, 2015
js Update gulp to move production js to min directory. Mar 11, 2014
sass Add blank styles file to more quickly start styling. Mar 15, 2015
.gitignore Update included modules. Just normalize and debug partial. Dec 16, 2014
README.md small typo Oct 30, 2015
gulpfile.js Update order of chained methods for spitting out file size with prope… Mar 15, 2015
index.html Ref trim.css in production. Mar 15, 2015
package.json

README.md

TRIM

Work in progress. Under active development. Pull requests welcome.

Wut

Running a simple dev environment and readying assets for production should be super easy and trivial. This is an attempt at a basic template for faster performing websites. Performance matters, but we shouldn't have to constantly pick low-hanging fruit. It should be as easy as hitting a button. Hopefully this can become that button.

Getting started

Set up the project by cloning the repo, navigating into it, then installing the necessary dependencies by running:

git clone git@github:mrmrs/trim.git
cd trim
npm install -g gulp browser-sync
npm install .

To run the development environment

Once you've run npm install just run this very complicated command in your terminal to start gulp

npm start

This will watch the sass directory and do the following on file change: • Compile scss files down to css/trim.css • Run autoprefixer on css/trim.css (this allows you to keep vendor prefixes out of your css) • Run csslint and spit the output to your terminal window where you are running gulp • Run an instance of browser-sync. With the chrome and safari extensions, you can see changes in the browser without hitting refresh

If you are including js - you'll still need to change the references in your html to the minified files.

Sass

Trim comes with a number of simple css utilities that you might find helpful. More documentation later.

TODO

  • Show how to dictate order of js when compiling