Gulp Angular Browserify Boilerplate
Gulp, Angular and Browserify are all very wonderful tools for the modern hacker. They each make our lives better. Using them together let's us get a lot of stuff done with fewer lines of code.
I couldn't find any easy to understand implementations of the 3 of them combined. So I made this.
This template should help you get going with your next hackathon project on the front-end.
Features
- Browserify Built-in
- Easy Building Process (Using Gulp)
- Sass to CSS integration
- Lemonade Responsive Design included
- SASS examples for teaching purposes.
- Easy NPM plugin integration
Prerequisites
- Node.js & NPM
- Command Line Tools
- Mac OS X: Xcode (or OS X 10.9 Mavericks:
xcode-select --install
) - Windows: Visual Studio
- Ubuntu:
sudo apt-get install build-essential
- Fedora:
sudo yum groupinstall "Development Tools"
- OpenSUSE:
sudo zypper install --type pattern devel_basis
- Mac OS X: Xcode (or OS X 10.9 Mavericks:
Getting Started
# Get the latest snapshot
$ git clone --depth=1 https://github.com/kivo360/GABS.git yourproject
$ cd yourproject
$ git remote rm origin
# Install NPM dependencies.
$ npm install #May require sudo access
$ gulp
Useful Resources
Great Design Resources
- Code Guide - Standards for developing flexible, durable, and sustainable HTML and CSS.
- Bootsnipp - Code snippets for Bootstrap.
- UIBox - Curated HTML, CSS, JS, UI components.
- Bootstrap Zero - Free Bootstrap templates themes.
- Google Bootstrap - Google-styled for Bootstrap.
- Font Awesome Icons - It's already part of the Hackathon Starter, so use this page as a reference.
- Colors - A nicer color palette for the web.
- Creative Button Styles - awesome button styles.
- Creative Link Effects - Beautiful link effects in CSS. Medium
- Scroll Effect - Fade in/out header background image as you scroll.
- GeoPattern - SVG background pattern generator.
- Trianglify - SVG low-poly background pattern generator.