Sinatra and Arbre ♥️

Recently, I needed to create a small, temporary web application for testing purposes. I definitely didn't want to deal with Rails for this purpose. In fact, it was small enough that I just wanted to have everything in one file. So:

Sinatra for the framework ✅

But what about templates?

Wouldn't it be nice if I could just define the DOM in Ruby? Then I remembered that ActiveAdmin has something like that. I wondered if perhaps there was some gem that they used for defining the DOM in Ruby. It turns out it was part of ActiveAdmin, but the authors extracted that functionality into its own gem, Arbre. Sweet!

Using these two gems together, a dynamic Ruby web application is as easy as this:

require'sinatra'require'arbre'get'/'doArbre::Context.newdohtmldobody(style: 'background-color: #DDF')doh2"What time is it?"parado"It is #{Time.now}"endendendendend

Most of the "tag" methods are just what you'd exepct, h1, a, img, etc. They made the paragraph tag para because p would be confusing as it is usually an alias for puts. Here's our application:

That's pretty exciting, right? But can we do more? Sure we can!

Arbre Components

You can do most of what you want just using the tag methods. But let's say you have some common pattern. For example, there's no radio_button method, because that's really just an input tag with the type radio. But if you want a few of them, and you want them all to have labels, creating a component is handy, and super easy. You just extend Arbre::Component like this:

That's it!

Great solution for building truly ambitious web applications? No. But for something small and quick, it is does the trick, and it is fairly elegant. It doesn't feel all that much different from writing HAML.