https://github.com/designyourcode/gulp-boilerplate

HTML Boilerplate with gulp support
https://github.com/designyourcode/gulp-boilerplate

Last synced: 28 days ago
JSON representation

HTML Boilerplate with gulp support

• Host: GitHub
• URL: https://github.com/designyourcode/gulp-boilerplate
• Owner: DesignyourCode
• License: mit
• Created: 2015-06-12T12:04:35.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2017-05-15T08:56:50.000Z (over 7 years ago)
• Last Synced: 2023-02-28T20:51:35.599Z (almost 2 years ago)
• Language: CSS
• Size: 71.3 KB
• Stars: 1
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Gulp Boilerplate

I can build or start working on lot of landing pages. Across most of these sites, the requirements and types of functionality are often the same.

To save myself some time I created this boilerplate, which aims to achieve the following:

 * Quick set up of folder structure. This folder structure works nicely with both simple landing pages and even bigger Angular apps.

 * Concatinating and minifying javascript into one file.

 * SASS support (this will be minified to one file).

 * Express server so you don't need to worry about installing local servers like MAMP.

 * Consistent code formatting when commit to git (by using .editorconfig).

 * Git ignore so you don't commit `node_modules`.

## Set up

**Project Setup**

1. Open the project in your favourite editor and update lines 2, 4 and 5 in the package.json file.

2. Make sure you have npm, node, gulp and sass installed on your machine.

3. Run `npm install`.

4. Run `gulp`

** Extra Benefits**

1. Install the 'livereload' plugin for your browser: Chrome, Firefox.

2. Turn 'livereload' on and start coding.

## Code

Below is useful snippets for Google Analytics tracking to help get you starter.

```

ga('send', 'event', 'category', 'action');

ga('send', 'event', 'category', 'action', 'label');

ga('send', 'event', 'category', 'action', 'label', value);  // value is a number.

```

## Useful Plugins

Below have included some of my most commons plugins:

 * jQuery Owl Carousel

 * jQuery Equal Heights

 * jQuery Validate

## Modal Windows

For modal windows I tend to use the boubon.io one. To install this, you need to run the following from your project route:

1. `gem install bourbon`

2. `cd assets/styles/scss`

3. `bourbon install`

4. You will need to `@import bourbon/bourbon';` in your SCSS file.

## Contributing

This format might not cover everyones requirements. If you think something could be improved feel free to fork and submit a pull request.