live reload your browser on file changes

#Jive Live.js is a nice tool for refreshing assets in the browser live. However, it does this using a polling technique which fills the Chrome Dev Tools and my server logs and feels too old-school.

LiveReload is nice and all but it sends a message with the source filename to the client as if the mapping were 'styles/footer.styl' -> 'styles/footer.css' where in reality the footer.styl gets included in a main.styl and then probably put in a different folder. This meant that LR never seemed to work for me, but I liked the idea of sockets.

So I just put together Jive.

Give Jive the filenames you want it to watch over stdio. When one of these files changes, it figures out whether this file would affect html, css, or js (using the file extension). It then sends a message to the client to reload all resources of that type (html, css, or js).

The client code can be found in example/lib/jive.js


npm install -g jive
# client side code
jive client > jive.js
find -type f | jive
echo 'styles/main.styl scripts/hello.coffee' | jive

###Or it could go in a makefile

FILES=$(shell find -type f)
watch: $(FILES)
        echo $(FILES) | jive
.PHONY: watch

####Made possible by Live.js go check out http://livejs.com