Skip to content

Instantly share code, notes, and snippets.

@srquinn21

srquinn21/Makefile

Last active December 15, 2020 16:19
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save srquinn21/fa9dd13d1f1efbda6423 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save srquinn21/fa9dd13d1f1efbda6423 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. srquinn21 revised this gist Dec 15, 2020. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,10 +1,10 @@
    ##Makefiles vs. Grunt/Gulp
    ## Makefiles vs. Grunt/Gulp

    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp for frontend development.
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practice this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem and Just Work™.

    ###Usage
    ### Usage
    First copy the above Makefile to the root of your project and save as "Makefile". If you don't have `watch(1)` installed:
    ```
    $ git clone https://github.com/tj/watch.git /tmp
  2. Sean R. Quinn revised this gist Mar 25, 2015. 2 changed files with 64 additions and 71 deletions.
    133 changes: 63 additions & 70 deletions Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -2,97 +2,90 @@
    # Environment/Configuration
    #==========================================================

    # For project consistency, its better to depend on npm binaries loaded locally than
    # globally, so we add .node_modules/.bin to the path for shorthand references. This
    # means you should add any binaries you need to "devDependencies" in package.json.
    # For project consistency, its better to depend on npm binaries loaded locally than
    # globally, so we add .node_modules/.bin to the path for shorthand references. This
    # means you should add any binaries you need to "devDependencies" in package.json.
    export PATH := ./node_modules/.bin/:$(PATH)

    # Since we depend on node already, we can use it in a mini shell script to automatically
    # pull in the name and version from package.json. The name will default to "app" if not set.
    NAME ?= $(shell node -e "console.log(require('./package.json').name || 'app');")
    VERSION = $(shell node -e "console.log(require('./package.json').version);")

    # Here we configure the names of our project's directories. Feel free to
    # overload for your own setup. You'll need to follow the convention that there
    # are "main.js" and "main.less" files in the root of the SRC directory.
    DIR ?= .
    SRC ?= ./src
    SRC_STATIC ?= $(SRC)/assets
    DEST ?= ./dist
    DEST_JS ?= $(DEST)/js
    DEST_CSS ?= $(DEST)/css

    # Here set some options for our binaries
    BROWSERIFY_OPTS ?= "-t [hbsfy -e html]"
    UGLIFY_OPTS ?= ""

    #==========================================================
    # Livereload
    #==========================================================

    # http://github.com/mklabs/make-livereload
    # make-livereload uses the tiny-lr server written in node and curl for
    # triggering changes.
    LIVERELOAD_DIR ?= $(DEST)
    include ./node_modules/make-livereload/index.mk

    #==========================================================
    # Default
    #==========================================================

    default: build
    # Pull in the name and version from package.json. The name will default to "app" if not set.
    NAME = $(shell node -e "console.log(require('./package.json').name || 'app');")
    VERSION = $(shell node -e "console.log(require('./package.json').version);")

    # Base directories
    BUILD_DIR = build
    DIST_DIR = dist
    SRC_DIR = src
    LIVERELOAD_DIR = $(BUILD_DIR)

    # Browserify
    JS_SRC = $(SRC_DIR)
    JS_ENTRY = $(JS_SRC)/app.js
    JS_BUNDLE = $(BUILD_DIR)/$(NAME).js
    JS_DIST = $(DIST_DIR)/$(NAME).js
    BROWSERIFY_OPTS = -t brfs --full-path=false
    SCRIPTS = $(shell find $(JS_SRC) -type f -name '*.js')

    # LESS
    CSS_SRC = $(SRC_DIR)/styles
    CSS_ENTRY = $(CSS_SRC)/main.less
    CSS_BUNDLE = $(BUILD_DIR)/$(NAME).css
    STYLES = $(shell find $(CSS_SRC) -type f -name '*.less')

    # Tests
    TEST_SRC = test/specs
    TEST_BUNDLE = $(BUILD_DIR)/$(NAME).tests.js
    TESTS = $(shell find $(TEST_SRC) -type f -name '*.test.js')

    #==========================================================
    # Phony targets
    #==========================================================

    .PHONY: clean compress develop static build
    .PHONY: publish clean develop test

    #==========================================================
    # Tasks
    #==========================================================

    # Build files for distribution
    publish: $(JS_DIST) $(STYLES)
    cp -R $(CSS_SRC) $(DIST_DIR)/less

    # Clean the build directory
    clean:
    rm -rf $(DEST)/*

    # Build all dynamic assets
    build: static $(DEST_JS)/$(NAME).js $(DEST_CSS)/$(NAME).css

    # Copy over all static assets
    static: $(wildcard, $(SRC_STATIC)/*, $(SRC_STATIC)/**/*)
    mkdir -p $(DEST) $(DEST_JS) $(DEST_CSS)
    cp -av $(SRC_STATIC)/* $(DEST)/

    # Minify built assets
    compress: build $(DEST_JS)/$(NAME).min.js $(DEST_CSS)/$(NAME).min.css

    rm -rf $(BUILD_DIR)

    # Startup web server and LiveReload server.
    develop: build
    $(MAKE) livereload
    serve ./dist &
    develop: $(BUILD_DIR) $(CSS_BUNDLE) livereload
    watchify $(BROWSERIFY_OPTS) $(JS_ENTRY) -o $(JS_BUNDLE) &
    watchify $(BROWSERIFY_OPTS) $(TESTS) -o $(TEST_BUNDLE) &
    serve --livereload --pushstate /admin ./public ./ &
    watch $(MAKE) --quiet reload

    #==========================================================
    # JS Build Targets
    # Build Targets
    #==========================================================

    # Local javascript build
    $(DEST_JS)/$(NAME).js: $(SRC)/main.js $(wildcard $(SRC)/*.js $(SRC)/**/*.js)
    browserify $(BROSERIFY_OPTS) $(SRC)/main.js > $(DEST_JS)/$(NAME).js
    # Build directory
    $(BUILD_DIR):
    mkdir -p $@

    # Distribution directory
    $(DIST_DIR):
    mkdir -p $@

    # Concat and minify scripts
    $(DEST_JS)/$(NAME).min.js: $(DEST_JS)/$(NAME).js
    cat $(DEST_JS)/$(NAME).js | uglifyjs $(UGLIFY_OPTS) -o $(DEST_JS)/$(NAME).min.js
    # Build LESS files
    $(CSS_BUNDLE): $(BUILD_DIR) $(STYLES)
    lessc $(CSS_ENTRY) > $@

    # Build scripts for distribution
    $(JS_DIST): $(DIST_DIR) $(SCRIPTS)
    browserify $(BROWSERIFY_OPTS) $(JS_ENTRY) -o $@

    #==========================================================
    # CSS Build Targets
    # Includes
    #==========================================================

    # Compile LESS files
    $(DEST_CSS)/$(NAME).css: $(SRC)/main.less $(wildcard $(SRC)/*.less, $(SRC)/**/*.less)
    lessc $(SRC)/main.less > $(DEST_CSS)/$(NAME).css

    # Minify CSS
    $(DEST_CSS)/$(NAME).min.css: $(DEST_CSS)/$(NAME).css
    csso $(DEST_CSS)/$(NAME).css > $(DEST_CSS)/$(NAME).min.css
    # http://github.com/jibsales/make-livereload
    # make-livereload uses the tiny-lr server written in node and curl for
    # triggering changes.
    include ./node_modules/make-livereload/index.mk
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -15,6 +15,6 @@ $ sudo make install
    ```
    Then simply run:
    ```
    $ npm install --save-dev make-livereload browserify less csso serve uglify-js
    $ npm install --save-dev {{list deps here}}
    $ make develop
    ```
  3. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -69,9 +69,9 @@ compress: build $(DEST_JS)/$(NAME).min.js $(DEST_CSS)/$(NAME).min.css

    # Startup web server and LiveReload server.
    develop: build
    make livereload
    $(MAKE) livereload
    serve ./dist &
    watch make --quiet reload
    watch $(MAKE) --quiet reload

    #==========================================================
    # JS Build Targets
  4. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -2,7 +2,7 @@

    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp for frontend development.
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practice this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem.
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practice this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem and Just Work™.

    ###Usage
    First copy the above Makefile to the root of your project and save as "Makefile". If you don't have `watch(1)` installed:
  5. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 2 additions and 0 deletions.
    2 changes: 2 additions & 0 deletions README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -10,6 +10,8 @@ First copy the above Makefile to the root of your project and save as "Makefile"
    $ git clone https://github.com/tj/watch.git /tmp
    $ cd /tmp/watch
    $ make install
    or
    $ sudo make install
    ```
    Then simply run:
    ```
  6. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -9,7 +9,7 @@ First copy the above Makefile to the root of your project and save as "Makefile"
    ```
    $ git clone https://github.com/tj/watch.git /tmp
    $ cd /tmp/watch
    # make install
    $ make install
    ```
    Then simply run:
    ```
  7. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 7 additions and 1 deletion.
    8 changes: 7 additions & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -5,7 +5,13 @@
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practice this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem.

    ###Usage
    First copy the above Makefile to the root of your project and save as "Makefile". Then simply run:
    First copy the above Makefile to the root of your project and save as "Makefile". If you don't have `watch(1)` installed:
    ```
    $ git clone https://github.com/tj/watch.git /tmp
    $ cd /tmp/watch
    # make install
    ```
    Then simply run:
    ```
    $ npm install --save-dev make-livereload browserify less csso serve uglify-js
    $ make develop
  8. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -14,7 +14,7 @@ VERSION = $(shell node -e "console.log(require('./package.json').version);")

    # Here we configure the names of our project's directories. Feel free to
    # overload for your own setup. You'll need to follow the convention that there
    # is a "main.js" and "main.less" files in the root of the SRC directory.
    # are "main.js" and "main.less" files in the root of the SRC directory.
    DIR ?= .
    SRC ?= ./src
    SRC_STATIC ?= $(SRC)/assets
  9. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -24,6 +24,7 @@ DEST_CSS ?= $(DEST)/css

    # Here set some options for our binaries
    BROWSERIFY_OPTS ?= "-t [hbsfy -e html]"
    UGLIFY_OPTS ?= ""

    #==========================================================
    # Livereload
    @@ -82,7 +83,7 @@ $(DEST_JS)/$(NAME).js: $(SRC)/main.js $(wildcard $(SRC)/*.js $(SRC)/**/*.js)

    # Concat and minify scripts
    $(DEST_JS)/$(NAME).min.js: $(DEST_JS)/$(NAME).js
    cat $(DEST_JS)/$(NAME).js | uglifyjs -o $(DEST_JS)/$(NAME).min.js
    cat $(DEST_JS)/$(NAME).js | uglifyjs $(UGLIFY_OPTS) -o $(DEST_JS)/$(NAME).min.js

    #==========================================================
    # CSS Build Targets
  10. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 0 additions and 2 deletions.
    2 changes: 0 additions & 2 deletions Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -16,10 +16,8 @@ VERSION = $(shell node -e "console.log(require('./package.json').version);")
    # overload for your own setup. You'll need to follow the convention that there
    # is a "main.js" and "main.less" files in the root of the SRC directory.
    DIR ?= .

    SRC ?= ./src
    SRC_STATIC ?= $(SRC)/assets

    DEST ?= ./dist
    DEST_JS ?= $(DEST)/js
    DEST_CSS ?= $(DEST)/css
  11. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -13,8 +13,8 @@ NAME ?= $(shell node -e "console.log(require('./package.json').name || 'app');")
    VERSION = $(shell node -e "console.log(require('./package.json').version);")

    # Here we configure the names of our project's directories. Feel free to
    # overload for your own setup. You'll need to follow the convention that the
    # SRC folder contains "main.js" and "main.less" files.
    # overload for your own setup. You'll need to follow the convention that there
    # is a "main.js" and "main.less" files in the root of the SRC directory.
    DIR ?= .

    SRC ?= ./src
  12. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 34 additions and 21 deletions.
    55 changes: 34 additions & 21 deletions Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -1,27 +1,40 @@
    #==========================================================
    # Environment
    # Environment/Configuration
    #==========================================================

    # For project consistency, its better to depend on npm binaries loaded locally than
    # globally, so we add .node_modules/.bin to the path for shorthand references. This
    # means you should add any binaries you need to "devDependencies" in package.json.
    export PATH := ./node_modules/.bin/:$(PATH)

    # Since we depend on node already, we can use its binary plus package.json to
    # automatically pull in the name and version
    # Since we depend on node already, we can use it in a mini shell script to automatically
    # pull in the name and version from package.json. The name will default to "app" if not set.
    NAME ?= $(shell node -e "console.log(require('./package.json').name || 'app');")
    VERSION = $(shell node -e "console.log(require('./package.json').version);")

    # Here we configure the names of our project's directories. Feel free to
    # overload for your own setup. You'll need to follow the convention that the
    # SRC folder contains "main.js" and "main.less" files.
    DIR ?= .

    SRC ?= ./src
    SRC_STATIC ?= $(SRC)/assets

    DEST ?= ./dist
    DEST_JS ?= $(DEST)/js
    DEST_CSS ?= $(DEST)/css

    # Here set some options for our binaries
    BROWSERIFY_OPTS ?= "-t [hbsfy -e html]"

    #==========================================================
    # Livereload
    #==========================================================

    # http://github.com/mklabs/make-livereload
    # make-livereload uses the tiny-lr server written in node and curl for
    # triggering changes. You'll want to overload the two variables below

    DIR ?= .
    LIVERELOAD_DIR ?= ./dist
    # triggering changes.
    LIVERELOAD_DIR ?= $(DEST)
    include ./node_modules/make-livereload/index.mk

    #==========================================================
    @@ -42,18 +55,18 @@ default: build

    # Clean the build directory
    clean:
    rm -rf build/*
    rm -rf $(DEST)/*

    # Build all dynamic assets
    build: static dist/js/$(NAME).js dist/css/$(NAME).css
    build: static $(DEST_JS)/$(NAME).js $(DEST_CSS)/$(NAME).css

    # Copy over all static assets
    static: $(wildcard src/assets/*)
    mkdir -p dist dist/js dist/css
    cp -av src/assets/* dist/
    static: $(wildcard, $(SRC_STATIC)/*, $(SRC_STATIC)/**/*)
    mkdir -p $(DEST) $(DEST_JS) $(DEST_CSS)
    cp -av $(SRC_STATIC)/* $(DEST)/

    # Minify built assets
    compress: dist/css/$(NAME).min.css dist/js/$(NAME).min.js
    compress: build $(DEST_JS)/$(NAME).min.js $(DEST_CSS)/$(NAME).min.css

    # Startup web server and LiveReload server.
    develop: build
    @@ -66,21 +79,21 @@ develop: build
    #==========================================================

    # Local javascript build
    dist/js/$(NAME).js: src/main.js $(wildcard src/*.js src/**/*.js)
    browserify -t [hbsfy -e html] src/main.js > dist/js/$(NAME).js
    $(DEST_JS)/$(NAME).js: $(SRC)/main.js $(wildcard $(SRC)/*.js $(SRC)/**/*.js)
    browserify $(BROSERIFY_OPTS) $(SRC)/main.js > $(DEST_JS)/$(NAME).js

    # Concat and minify scripts
    dist/js/$(NAME).min.js: dist/js/$(NAME).js
    cat dist/js/$(NAME).js | uglifyjs -o dist/js/$(NAME).min.js
    $(DEST_JS)/$(NAME).min.js: $(DEST_JS)/$(NAME).js
    cat $(DEST_JS)/$(NAME).js | uglifyjs -o $(DEST_JS)/$(NAME).min.js

    #==========================================================
    # CSS Build Targets
    #==========================================================

    # Compile LESS files
    dist/css/$(NAME).css: src/main.less $(wildcard src/*.less, src/**/*.less)
    lessc src/main.less > dist/css/$(NAME).css
    $(DEST_CSS)/$(NAME).css: $(SRC)/main.less $(wildcard $(SRC)/*.less, $(SRC)/**/*.less)
    lessc $(SRC)/main.less > $(DEST_CSS)/$(NAME).css

    # Minify CSS
    dist/css/$(NAME).min.css: dist/css/$(NAME).css
    csso dist/css/$(NAME).css > dist/css/$(NAME).min.css
    $(DEST_CSS)/$(NAME).min.css: $(DEST_CSS)/$(NAME).css
    csso $(DEST_CSS)/$(NAME).css > $(DEST_CSS)/$(NAME).min.css
  13. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -7,6 +7,6 @@ The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki
    ###Usage
    First copy the above Makefile to the root of your project and save as "Makefile". Then simply run:
    ```
    $ npm install --save make-livereload browserify less csso serve uglify-js
    $ npm install --save-dev make-livereload browserify less csso serve uglify-js
    $ make develop
    ```
  14. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -7,6 +7,6 @@ The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki
    ###Usage
    First copy the above Makefile to the root of your project and save as "Makefile". Then simply run:
    ```
    $ npm install
    $ npm install --save make-livereload browserify less csso serve uglify-js
    $ make develop
    ```
  15. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -5,8 +5,8 @@
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practice this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem.

    ###Usage
    First copy the above Makefile to the root of your project and save as "Makefile". Then simply run:
    ```
    $ git clone
    $ npm install
    $ make develop
    ```
  16. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -6,6 +6,7 @@ The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki

    ###Usage
    ```
    $ git clone
    $ npm install
    $ make develop
    ```
  17. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -70,7 +70,7 @@ dist/js/$(NAME).js: src/main.js $(wildcard src/*.js src/**/*.js)
    browserify -t [hbsfy -e html] src/main.js > dist/js/$(NAME).js

    # Concat and minify scripts
    dist/js/$(NAME).min.js: dist/js/vendor.js dist/js/$(NAME).js
    dist/js/$(NAME).min.js: dist/js/$(NAME).js
    cat dist/js/$(NAME).js | uglifyjs -o dist/js/$(NAME).min.js

    #==========================================================
  18. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -2,7 +2,7 @@

    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp for frontend development.
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practice this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem. Refusing to learn is just laziness and laziness will get you nowhere in life.
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practice this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem.

    ###Usage
    ```
  19. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -2,7 +2,7 @@

    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp for frontend development.
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practices this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem. Refusing to learn is just laziness and laziness will get you nowhere in life.
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practice this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem. Refusing to learn is just laziness and laziness will get you nowhere in life.

    ###Usage
    ```
  20. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 2 additions and 0 deletions.
    2 changes: 2 additions & 0 deletions README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,5 @@
    ##Makefiles vs. Grunt/Gulp

    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp for frontend development.
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practices this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem. Refusing to learn is just laziness and laziness will get you nowhere in life.
  21. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 3 additions and 1 deletion.
    4 changes: 3 additions & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,6 @@
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp for frontend development. The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practices this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem. Refusing to learn is just laziness and laziness will get you nowhere in life.
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp for frontend development.
    The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practices this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem. Refusing to learn is just laziness and laziness will get you nowhere in life.

    ###Usage
    ```
  22. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 4 additions and 4 deletions.
    8 changes: 4 additions & 4 deletions Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -9,7 +9,7 @@ export PATH := ./node_modules/.bin/:$(PATH)

    # Since we depend on node already, we can use its binary plus package.json to
    # automatically pull in the name and version
    NAME = $(shell node -e "console.log(require('./package.json').name || 'app');")
    NAME ?= $(shell node -e "console.log(require('./package.json').name || 'app');")
    VERSION = $(shell node -e "console.log(require('./package.json').version);")

    #==========================================================
    @@ -18,10 +18,10 @@ VERSION = $(shell node -e "console.log(require('./package.json').version);")

    # http://github.com/mklabs/make-livereload
    # make-livereload uses the tiny-lr server written in node and curl for
    # triggering changes. You'll want to overload the two variable below
    # triggering changes. You'll want to overload the two variables below

    DIR = .
    LIVERELOAD_DIR = ./dist
    DIR ?= .
    LIVERELOAD_DIR ?= ./dist
    include ./node_modules/make-livereload/index.mk

    #==========================================================
  23. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp. The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practices this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem. Refusing to learn is just laziness and laziness will get you nowhere in life.
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp for frontend development. The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practices this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem. Refusing to learn is just laziness and laziness will get you nowhere in life.
    ###Usage
    ```
  24. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp. The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practice this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system.
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp. The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practices this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system. Bash and Makefiles can be intimidating to learn at first, but once learned can be a powerful utility belt that can solve nearly any problem. Refusing to learn is just laziness and laziness will get you nowhere in life.
    ###Usage
    ```
  25. Sean R. Quinn revised this gist Dec 6, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp. Tooling is a matter of preference but in my experience, the amount of boilerplate and plugin glue required by Grubt/Gulp is entirely too much overhead for project maintenance. The beauty of node.js is that the Unix philosophy is at its core. Grunt/Gulp is merely a wrapper for the lazy — it took but a couple of hours with the GNU Make documentation to pull off the above.
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp. The beauty of node.js is that the [Unix philosophy](http://en.wikipedia.org/wiki/Unix_philosophy) is at its core. While Grunt/Gulp practice this philosophy with small cores and an extendable plugin system, the amount of boilerplate and glue code needed to wrap common CLI tools adds too much maintenance and complexity to a build system.
    ###Usage
    ```
  26. Sean R. Quinn revised this gist Dec 5, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp. Tooling is a matter of preference but in my experience, the amount of boilerplate and plugin glue required by Grubt/Gulp is entirely too much overhead for project maintenance. The beauty of node.js is that the Unix philosophy is at its core — Grunt/Gulp is merely a wrapper for the lazy. It took but a couple of hours with the GNU Make documentation to pull off the above.
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp. Tooling is a matter of preference but in my experience, the amount of boilerplate and plugin glue required by Grubt/Gulp is entirely too much overhead for project maintenance. The beauty of node.js is that the Unix philosophy is at its core. Grunt/Gulp is merely a wrapper for the lazy — it took but a couple of hours with the GNU Make documentation to pull off the above.
    ###Usage
    ```
  27. Sean R. Quinn revised this gist Dec 5, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp. Tooling is a matter of preference but in my experience, the amount of boilerplate and plugin glue required by Grubt/Gulp is entirely too much overhead for project maintenance.
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp. Tooling is a matter of preference but in my experience, the amount of boilerplate and plugin glue required by Grubt/Gulp is entirely too much overhead for project maintenance. The beauty of node.js is that the Unix philosophy is at its core — Grunt/Gulp is merely a wrapper for the lazy. It took but a couple of hours with the GNU Make documentation to pull off the above.
    ###Usage
    ```
  28. Sean R. Quinn revised this gist Dec 5, 2014. 1 changed file with 2 additions and 0 deletions.
    2 changes: 2 additions & 0 deletions README.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,5 @@
    > The above is meant to demonstrate why Makefiles can be just as powerful (if not more) than Grunt/Gulp. Tooling is a matter of preference but in my experience, the amount of boilerplate and plugin glue required by Grubt/Gulp is entirely too much overhead for project maintenance.
    ###Usage
    ```
    $ npm install
  29. Sean R. Quinn revised this gist Dec 5, 2014. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -3,7 +3,8 @@
    #==========================================================

    # For project consistency, its better to depend on npm binaries loaded locally than
    # globally, so we add .node_modules/.bin to the path for shorthand references.
    # globally, so we add .node_modules/.bin to the path for shorthand references. This
    # means you should add any binaries you need to "devDependencies" in package.json.
    export PATH := ./node_modules/.bin/:$(PATH)

    # Since we depend on node already, we can use its binary plus package.json to
  30. Sean R. Quinn revised this gist Dec 5, 2014. 1 changed file with 4 additions and 5 deletions.
    9 changes: 4 additions & 5 deletions Makefile
    View file
    Original file line number Diff line number Diff line change
    @@ -2,13 +2,12 @@
    # Environment
    #==========================================================

    # For consistency, its better to depend on binaries loaded
    # locally than globally, so we add .node_modules/.bin to
    # the path for shorthand references.
    # For project consistency, its better to depend on npm binaries loaded locally than
    # globally, so we add .node_modules/.bin to the path for shorthand references.
    export PATH := ./node_modules/.bin/:$(PATH)

    # Since we depend on node already, we can use its binary plus
    # package.json to automatically pull in the name and version
    # Since we depend on node already, we can use its binary plus package.json to
    # automatically pull in the name and version
    NAME = $(shell node -e "console.log(require('./package.json').name || 'app');")
    VERSION = $(shell node -e "console.log(require('./package.json').version);")