Lakshan Perera

Punch started out as a simple static site generator, which I wrote to use in my own work. After releasing to the public, it attracted bunch of passionate early adopters, who provided some valuable feedback on how to improve it. Their feedback gave me a better perspective of what people really expect from a modern-day web publishing tool.

So in last July, I took two weeks off from my day job, to create the initial prototype for a new Punch. Then for the next two months, I spent most of my early mornings and late nights turning this concept into a reality.

Today, I present you Punch Reloaded, which I deem as a modern web publishing framework.

Problem with the web development is everything change so fast. Devices change. Browsers change. Best Practices change. The tools we use, need to change as well.

However, this rapid pace of change is not just peculiar to web development. It's been a characteristic of the computing field from its inception. If there was a system, which understood and embraced this concept of rapid change, that was Unix. Unix's followed a modular design, which allowed it to evolve with the time and needs.

Punch was inspired a lot from this Unix philosophy. The framework is composed of small self-contained modules, that's been written to do only one particular task. You can take apart everything and put together the way you want. You can easily extend the default stack to support any template engine, parser or pre-compiler you want. You can define the way you want to handle the content and layouts. You can even embed Punch within a large application.

To learn more about the possibilities, refer the sections under Customizing Punch in the Punch Guide.

By default, Punch fetches content from JSON files stored in the local file system. However, with the new modular design, you can use any backend that supports JSON, to power your Punch sites. It could be a relational database such as Postgre, a document store such as Mongo, a third-party web service or even new backend service like Firebase.

Check out this example app, which uses the Twitter API as its backend. I plan to release plugins for several popular backends in the near future. If you are interested in writing your own content handler, please check this article.

With most Content Management Systems you are stuck with a single layout for all pages in a site. But Punch makes it easy to use different layouts for different sections and pages in the site. Unlike in other frameworks, you need not to explicitly define the layout you want to use. Punch will intuitively fetch the matching layout for a page, based on the name and hierarchy.

Read this article, to learn more about the organization of layouts.

Punch offers built-in helpers for common text, list and date/time operations. They are defined in a way that can be used with any template language.

What's more interesting would be the option to define your own custom helpers. Custom helpers do have the access to request context and can be used to enhance both response header (eg. Setting cookies) and the body. You can learn more details about writing custom helpers from this article.

In these days of mobile web, performance is a key factor for kind of web site. Minifing and bundling of JS/CSS assets are regarded as common best practices to increase the performance of a site. Apart from web app frameworks like Rails, most other site management workflows doesn't adopt such practices.

However, Punch offers a smart workflow to minify and bundle assets. So you can manage the front-end code, without giving up on the clarity or performance.

With Punch, you can write CoffeeScript and LESS as you would write regular JavaScript and CSS. Make the changes in the editor and just reload the browser to see the changes. Punch will do the compiling for you.

Check this screencast, to understand how smooth the flow is:

Punch now comes with a default site structure and a hands-on tutorial to help you get started. Once you get acquainted, you can even use your own boilerplates to create new a site.

I have also rewritten the Punch Guide, to help you to peruse all the new features.

As I said before, you can extend Punch's default stack by writing plugins. It's possible to write wrappers to use any backend, template engine, parser, pre-compiler and minifier with Punch. Basically, you can use Punch as a glue code, to build your own framework.

Reading the source is probably the best way to understand what happens under the hood. Also, you can refer the specs to get a better idea on the actual behavior.

Go, Give it a try and create some kickass sites!