Introducing Harp

After ten months, sixty releases, and countless re-evaluations of the API, I am extremely proud to introduce Harp, a new kind of static web server that has built-in preprocessing. I encourage you to give it a try.

Why another static web server?

We already have extremely reliable open source static web servers of which NGINX is the obvious gold standard. Yet there is a paradigm shift happening in the way that front-end's are being built that I feel warrants a different type of static server. I can't imagine NGINX or Apache will focus on these trends, here is what I'm seeing...

Modern Web Languages - Languages that compile to HTML/CSS/JS are becoming quite useful and they are maturing very quickly. It has become clear that languages such as Jade, LESS, and CoffeeScript are here to stay and Markdown has become common place when writing content for the web. Regardless of your opinion, people are gravitating towards these tools at an alarming rate and you are likely at a disadvantage if you are not using any of them.

Angular and Backbone - Front-end JavaScript frameworks are now a staple in our tool chain and interest in AngularJS is absolutely exploding. Take a look at the uptake of AngularJS compared to Ruby on Rails in 2005, looks familiar, doesn't it?

The following graph is taken form google trends (units are relative to each other)

Bootstrap Mania - Bootstrap has been much more a cultural shift than a technical shift, but it's a significant one. Bootstrap's adoption rate is like nothing we have seen before. Seemingly overnight everyone started using it. As of this writing Bootstrap is the most watched open source library on Github with over 59k stars . Bootstrap, which is written with LESS has helped bring CSS precompilers to the forefront. Foundation (written in SASS) is a similar library that many prefer over Bootstrap. Topcoat, a more performance focused modular approach and is written with Stylus. It too shows a lot of promise.

Advent of BaaS - The obvious question with building front-end applications is where does the state live? Fortunately there are many services solving this problem. Parse, Firebase, Kinvey, to name a few. Even Dropbox has entered the space with their Datastore API. We also have open-source initiatives such as Hood.ie, TogetherJS, and Helios which all look promising. The most astonishing thing is how incredibly powerful these services are. MVPs will be shipping faster than ever.

The next generation of developers are cutting their teeth on these front-end JavaScript and CSS frameworks and they are using Backend Services to flesh out their ideas. They don't care about LAMP, Ruby on Rails, or ExpressJS. These choices simply don't matter like they used to. The focus now is almost entirely the client.

Time will tell but it seems to me that our current offering of static web servers are not suitable for this shift.

How does Harp help?

Imagine you were choosing between PNG or JPEG for an image you wanted to serve. You would simply pick the right format for that use case because web servers support either, you need only drop the file in. That is exactly what Harp does with modern web languages. Want to use Stylus? Just name your file with a .styl extension. Prefer LESS’ syntax? Just drop in the LESS source files and go to work. Or use a combination of both, Harp doesn't care. Harp knows to compile and serve main.styl when main.css is requested, OR main.less if that file exists instead. It’s that simple.

Example

Lets say your project looks like the following...

myproject/ +- index.jade

...and your index.jade files looks like so...

!!! html head title Harp Demo body h1 Hello World

We run harp server --port 9000 in the root directory and when a request comes in for the index.html file. Harp is aware that in the event that the HTML does not exist to compile and serve the index.jade as one might expect.

BTW - Harp also generates static sites!

But don't call it a Static Site Generator. If you want to compile your application to be served by a traditional static web server, Harp has you covered. Simply run harp compile --output ../www and you have HTML/CSS/JS ready to be shipped anywhere you like.

www/ +- index.html

Here is a video with more details (jump to 6:53 to see how well Harp works with Bootstrap).

This makes Harp a great alternative to Jekyll or a worthy companion to Apache Cordova. I'm sure this will have many other unintended uses as well.

Conclusion

This is only a small part of what Harp does. It also gives you the trusted Layout/Partial paradigm and custom metadata for dynamically stitching together your site but I'll touch more on this later. Subscribe or follow to get future updates.

I hope this helps give you insight into how Harp works and the motivation for building it. I look forward to see what uses people find for it. In closing I would like to thank all the amazing developers contributing to the open source projects that make Harp possible, including contributers to Harp itself. Harp rests on your shoulders and is nothing without you. Also, special thanks to Mozilla for helping Harp find its way via the Mozilla WebFWD program. Your guidance was critical in this process.

View project on github

Discuss on Hacker News