Show HN: draughtsman, a webserver for front-end devs | Hacker News Reader

Show HN: draughtsman, a webserver for front-end devs

github.com

45 pointsstdbrouw19 comments

Creator here. For the past couple of months, I've been using a tiny webserver I've dubbed draughtsman to kick up my productivity while doing HTML prototypes. It's a node.js app that provides you with transparent compilation of CoffeeScript, Stylus, Jade, HAML et cetera. And directory listings (yeah, baby!) Probably more useful for designers than for devs. It's sort of like Apache/mod_php... but for people who know better than to use PHP (I kid, I kid). MIT licensed.

I do a lot of front-end prototypes for apps and websites I may or may not want to keep on building, and because of the throwaway quality of those things I don't want to be bothered with keeping all sorts of autocompiling scripts running for CoffeeScript, SASS et cetera, and I also don't want to start a Rails or Django project (yes, I use both) just for the sake of having transparent precompilation of those assets, and I also don't want to limit myself to writing plain HTML and CSS.

A bit more information over here: http://stdout.be/2011/10/25/draughtsman/

It's maybe a couple hundred lines of code, so easy to read through if that's your thing.

Just scratching my own itch here, but I'm curious to see what you guys think.

It's a great idea, I hope I can find it in my bookmarks again when I can swing around to it. :)

Very similar to a tool I created a while back: https://github.com/ashleyw/convey

It's <100 lines of code, and really quite primitive; if you request hello.css, and that file exists, it serves that. If it doesn't exist, but hello.sass does, it'll compile and serve that instead. Same goes for .haml and .coffee files requested with .html and .js respectively. No configuration, no required file structure — just prototype as you would with just HTML/CSS…except using the compiled templates you love!

Word. Convey may be easier to get running for some people, as it's Ruby instead of node.js. Thanks for sharing.

Three things draughtsman adds on top of Convey:

* No need for projects: works in any directory.

* The ability to use JSON / YAML to populate templates; especially useful if you already have some JSON sample data you can use.

* Offline resources: makes jQuery and underscore.js available at the root, regardless of whether they're actually in that directory.

The one thing it misses that Convey has:

* The ability to save the compiled files to a directory.

Convey works in any directory too, you just run `convey` within it. The `init` command just creates a skeleton file structure to get you started.

Like the idea of using JSON to populate templates though, that's neat!

I wrote something very similar, thought not as advanced, srvr https://github.com/MatthewCallis/srvr but this looks much more complex with the awesome plugin system.

You're right, you can use it just like `srvr` and quickly get any directory up at localhost from the command line.

I figure most people will want to use it more like Apache though: set & forget & loads at startup.

Don't know if I'd call draughtsman advanced: it's too small for that. Or maybe its diminutive size is a testament to node.js its power for anything related to servers and proxies; I probably wouldn't have bothered if I had had to write a server like this in any other language.

Similar to something I have: https://github.com/charliesome/here

You just run it like `here` and optionally pass a port (uses 8080 by default) or directory (uses current directory by default)

It's written in C and has support for modules. I was planning to write a PHP module for it, but that idea never got off the ground.

It seems that everybody's written something similar. My entry is Slinky (http://github.com/mwylde/slinky) which in addition to an auto-compiling web/proxy server also includes a build tool with dependency resolution and minification for scripts and css.

It's in Ruby instead of Node and is a bit less opinionated about how a project should look like. I wrote it when I became frustrated with the options for writing rich client apps in compiled languages (HAML/SASS/CoffeeScript). It's so convenient to be able to cd to a directory and do "slinky start" and have a static file server running.

Well, I'm certainly glad of it — developing something you think nobody's ever done before always feels a bit insane, so these replies are a welcome sanity check.

We've been working on something which attempts to resolve a similar issue, but written as an XPath based implementation based on Django's template inheritance model. It's written in PHP but the idea is that as the frontend guy you never see any "logic" - the sole purpose of this is just to provide the ability to fragment out common parts of your interface.

https://github.com/iaindooley/Fragmentify

EDIT: sorry the doco is so lame at the moment - just threw it online the other day and haven't had the chance to flesh it out at all.

Another to add to the list of alternatives (this one has been serving me nicely as of late): http://middlemanapp.com / https://github.com/tdreyno/middleman

Best one in the list thus far, I must say, in terms of both features and adoption.

I like how Middleman handles layout templates, YAML front matter, dynamic pages and livereload. Dislike the idea of including Sprockets for asset management though, seems too much cruft for just prototyping. Suppose it makes sense if you want a tool that doubles as a static site generator.

Also similar: I've been using Serve for this. http://getserve.com/

http://get-serve.com/ probably. What disappoints me about Serve and some of these other tools is that they make no attempt to be agnostic about what filetypes they process: it's ERB, HAML, SASS, period. (Well, usually a few other formats too, but you get my point.) These are infrastructure tools and it's too bad that every community has to reinvent the wheel.

In the same spirit, StaticMatic2[1] is a gem for building static websites. It has a preview server, supports many many templates via Tilt, and can upload your compiled website to Amazon S3 in a single command.

[1] https://github.com/mindeavor/staticmatic2

This would be much better as Connect middleware.

You mean for the compilation? Hm, dunno, I'd rather use something like connect-assetmanager (https://github.com/mape/connect-assetmanager) for that. This is geared more at development, hence e.g. the fact that it runs at startup (by default anyway), provides listing pages and pulls in JSON data. YMMV, but would be too much magic for me in production.

So much awesome. This looks like an absolutely great example of why node.js rocks.

Reply on news.ycombinator.com