Because web development doesn't need to be a pain.
- Install the project in just three commands (see "Developing" below).
- Use Handlebars.js to keep our HTML organized into templates and partials.
- Use SCSS to keep our CSS organized into logical components.
- Use Autoprefixer to automatically insert browser prefixes where necessary to handle cross browser compatibility.
All with one command from the terminal:
Install npm. Then, install gulp:
npm install -g gulp # May require `sudo`
npm install # One time gem install scss_lint # One time gulp serve
If you want to use this repo for your next project, make sure to make the following changes:
data.yml, filling in the HTML metadata associated with your site.
- Remove the
.gitfolder, so that you start from a fresh commit history.
README.mdto your preference.
An overview of Gulp commands available:
Builds the site into the
dist directory. This includes:
- SCSS w/ linting, sourcemaps and autoprefixing
- JS linting and uglification
- Handlebars to HTML
This is used for distributing an optimized version of the site (for deployment). It includes everything from
gulp build as well as:
- SCSS minification
- CSS / JS inline-sourcing
Watchs for changes in local files and rebuilds parts of the site as necessary, into the
gulp watch in the background, and serves the
dist directory at
localhost:3000 with automatic reloading using Browsersync.