Web development, build stage

These are tools I'm interested in to automate the process of building a website. I grow a need for a build stage, where I compile the website resources before they are production ready.

• Build stack

  I'm comfortable using a Makefile, legacy from the C++ days, in short there is a target file, and source file, target get reproduced when source is newer. It's that simple.

  h5bp uses ant (java) though, and node.js too, will investigate later.

• CSS preprocessor

  Currently I use:

  • stylus (node.js) with the help of nib
  • compass (sass)

• Images preprocessor

  Tools I like to use:

  • ImageMagick (IM)

    Note: I don't know how to produce png-8 and png-24 yet.

    Sample code:

    
    #!/bin/sh
    for PIC in *.jpg
    do
      while true
      do
        DEST=$HOME/.tuxpaint/saved/$(date+%Y%m%d%H%M%S).png
        [ -f ${DEST} ] || break
        sleep 1
      done
      convert -strip -antialias -resize 448x376 ${PIC} ${DEST}
    done
        

    Source: tuxradar.com.

    Seems like using ImageMagick for doing "save for web" is less better than using Photoshop functionality. Source: stackoverflow.com.

    Other notable codes:

    
    -strip
    -resample 72
    -quality 80%
    +contrast
    -gravity East
    -antialias
    -format png
        

  • pngcrush

    I don't have codes yet.