JavaScripting

The definitive source of the best
JavaScript libraries, frameworks, and plugins.


  • ×

    Angular Js Boilerplate

    Simple AngularJS Boilerplate to kick start your new project with SASS support and Gulp watch/build tasks
    Filed under 

    • 🔾31%Overall
    • 407
    • 24.9 days
    • 🕩153
    • 👥12

    Disclaimer:

    For updated version of AngularJS-Boilerplate please use this one: https://github.com/jbutko/ExpressJS-Socket.IO-AngularJS-Boilerplate/tree/master/client It's component based, based on Angular v1.6.1 and as routing library is used Angular UI Router v1.

    AngularJS-Boilerplate

    Simple AngularJS Boilerplate to kick start your new project with SASS support and Gulp watch/build tasks

    Features

    • SASS support including sourceMaps
    • Minimal CSS styling of the view
    • Gulp watch, build and local server tasks
    • Responsive navigation
    • Owl slider directive
    • localStorage service for set, get, remove data
    • queryService $http wrapper to handle calls
    • clear folder structure
    • less than 10 request in build version
    • minified CSS and JS build files
    • google analytics snippet

    Download

    bower install angularjs-boilerplate
    

    or

    git clone https://github.com/jbutko/AngularJS-Boilerplate.git
    

    1. Setup

    npm install
    
    • install all npm and bower dependencies

    Note: If npm install fails during dependency installation it will be likely caused by gulp-imagemin. In that case remove gulp-imagemin dependency from package.json, run npm install again and then install gulp-imagemin separately with following command: npm install gulp-imagemin --save-dev

    2. Watch files

    npm start
    

    or

    gulp
    
    • all SCSS/HTML will be watched for changes and injected into browser thanks to BrowserSync

    3. Build production version

    npm run build
    

    or

    gulp build
    
    • this will process following tasks:
    • clean _build folder
    • compile SASS files, minify and uncss compiled css
    • copy and optimize images
    • minify and copy all HTML files into $templateCache
    • build index.html
    • minify and copy all JS files
    • copy fonts
    • show build folder size

    4. Start webserver without watch task

    npm run server
    

    or

    gulp server
    

    5. Start webserver from build folder

    npm run serverbuild
    

    or

    gulp server-build
    

    Contact

    Copyright (C) 2015 Jozef Butko
    www.jozefbutko.com/resume
    www.github.com/jbutko
    @jozefbutko
    Released under MIT license

    Changelog

    1.1.7

    • Install all dependencies with 'npm install' (bower included) - pull req #7 by @bbodine1
      15.05.2015

    1.1.6

    • Cleaned up the gulpfile with gulp-load-plugins - pull req #6 by @davieschoots
      26.04.2015

    1.1.5

    • added MIT License
      19.04.2015

    1.1.4

    • added minification of JS files in build task
    • added favicon
    • gulpfile.js beautify and clean up
    • added owl carousel into demo
      04.04.2015

    1.1.3

    • index.html update: added browserupgrade tag
    • index.html update: http-equiv meta tag, google analytics support
    • comments update in gulpfile.js
    • gulpfile.js formatting
    • pull request #1: removed duplicate gulp require in gulpfile.js
      04.04.2015

    1.1.2

    • package.json and gulpfile.js clean up
      02.04.2015

    1.1.1

    • opened responsive nav fix, css build .min appendix, live demo, github icons
      31.03.2015

    1.1.0

    • many improvements: responsive nav, code clean up, gulp angular templateCache support, gulp task for local server, SASS sourceMaps support
      29.03.2015

    1.0.0

    • initial release
      22.03.2015
    Show All