4 ms·

Could you share what tools you view as essential, please?

• idlewan 12y ago
  It all depends on your habits. If you're satisfied with pure CSS and Javascript, the only thing you really need is a build tool for concatenation, minification and gzip. And livereload. And probably normalize.css. -> I use uglifyjs and uglifycss -> I use tiny-lr for livereload (https://www.npmjs.org/package/tiny-lr https://www.npmjs.org/package/tiny-lr) -> I use a Makefile, because it's the most simple to modify and adapt. When I have several targets of the same type (ex: build.min.js and debug.min.js), I use a yaml file with a custom python script for concatenation. See gulp.js and a thousand others for alternatives, YMMV (my Makefile nowadays: https://gist.github.com/idlewan/11012492 https://gist.github.com/idlewan/11012492). Magical bit for running make every time a file changes: watch: @inotifywait -m --exclude ".*\.swp|.*~" -e moved_to,close_write -r . | \ while read; do make -s; done To get more from just CSS, you need a CSS precompiler. -> I use Stylus with the nib library (https://github.com/visionmedia/nib https://github.com/visionmedia/nib). Alternatives: LESS, SASS, and some others. You might want to add some grid and 'responsive shortcut' mixins on top. bigger($minwidth) query = "screen and (min-width: " + $minwidth + ")" @media query {block} // usage: .my-div font-size 20px +bigger(520px) font-size 30px For webapp needs, you need a template library (some people prefer using a fat framework that does everything for them, e.g. Angular). -> I use Jade (https://github.com/visionmedia/jade https://github.com/visionmedia/jade), because it runs on the server for Python, Node.js and soon Nimrod, and on the client with precompiled templates. Alternatives: Mustache and a thousand others, YMMV.