##Christmas Letter
git clone git@github.com:babbagescabbages/christmas-letter.git
cd christmas-letter
npm install
npm start| Features | Tools Used |
|---|---|
| CSS | Sass (Libsass via node-sass), Autoprefixer, CSSNano, Source Maps |
| JavaScript | Babel, Webpack |
| HTML | Nunjucks, gulp-data, or bring your own |
| Images | Compression with imagemin |
| Icons | Auto-generated SVG Sprites and/or Icon Fonts |
| Fonts | Folder and .sass mixin for including WebFonts |
| Live Updating | BrowserSync, Webpack Dev Middleware, Webpack Hot Middleware |
| Production Builds | JS and CSS are uglified and minified, filename md5 hashing (reving), file size reporting, local production Express server for testing builds. |
| JS Testing | Karma, Mocha, Chai, and Sinon, Example Travis CI integration |
| Deployment | Quickly deploy public folder to gh-pages with gulp-gh-pages |
Make sure Node installed. I recommend using NVM to manage versions.
This has been tested on Node 0.12.x - 5.9.0, and should work on newer versions as well. File an issue if it doesn't!
npm installnpm start
Aliases: npm run gulp, npm run development
This is where the magic happens. The perfect front-end workflow. This runs the default gulp task, which starts compiling, watching, and live updating all our files as we change them. BrowserSync will start a server on port 3000, or do whatever you've configured it to do. You'll be able to see live changes in all connected browsers. Don't forget about the additional BrowserSync tools available on port 3001!
Why run this as an npm script? NPM scripts add ./node_modules/bin to the path when run, using the packages version installed with this project, rather than a globally installed ones. Never npm install -g and get into mis-matched version issues again. These scripts are defined in the scripts property of package.json.
npm run test:watchnpm run testnpm run production