New Weblocks tutorial: widgets

Weblocks is a web framework, created circa 2007, that allows to
write dynamic web applications in full Lisp, without a line of
Javascript. It is based on so called widgets, that are rendered
server-side and updated on the client, and it was also based on
continuations (they were removed in this fork, at least for now). It
was quietly being forgotten but it is being fixed, refactored,
documented and simplified by Alexander “svetlyak40wt” since a year or
so.

I rewrote the quickstart to show the use of widgets, the heart of
Weblocks, Alexander proof-read and here we are:

Weblocks is now the easiest to get started with, the one “really
isomorphic” (bluring the line between server and client code), the
most elegant (to me) and one of the two, with Seaside, that allow for
REPL-driven development.

For what I tested, Heliom is a hell to install, it seems a hell to
deploy, and it is bloated with specific Ocaml syntax that is always
upcoming in new compiler versions.

Karax seems promising, it was recently used to rewrite the
Nim forum. It has currently zero docs
(not even a quickstart ;) ) and Nim’s ecosystem isn’t near as large as
CL’s. (and, well, no REPL, no Lisp)

Nagare is actually based on Stackless Python. Looking at the code of
the successfull Kansha Trello clone, it
actually includes inline Javascript. And personnally, I’m running away from Python so…

Quickstart

warning

This version of Weblocks is not in Quicklisp yet. To

install it you need to clone the repository somewhere where ASDF
will find it, for example, to the ~/common-lisp/ directory.

No weblocks/session:init method defined.
Please define a method weblocks.session:init to initialize a session.
It could be something simple, like this one:
(defmethod weblocks/session:init ((app tasks))
"Hello world!")
Read more in the documentaion.

It means that you didn’t write any code for your application. Let’s do
it now and make an application which outputs a list of tasks.

In the end, we’ll build the mandatory TODO-list app:

The Task widget

This code defines a task widget, the building block of our application.
defwidget is similar to Common Lisp’s defclass, in fact it is only a
wrapper around it. It takes a name, a list of super-classes (here ())
and a list of slot definitions.

This second point is really important because it allows Weblocks to
render necessary parts of the page on the server and to inject it into
the HTML DOM in the browser. Here it rerenders the root widget, but we
can as well update a specific task widget, as we’ll do soon.

We also took care of defining add-task inline, as a closure, for it to
be thread safe.

Another block in our new version of render of a task-list is the form:

We defined a small helper to toggle the done attribute, and we’ve
modified our task rendering function by adding a code to render a
checkbox with an anonymous lisp function, attached to its onclick
attribute.

The function make-js-action returns a Javascript code, which calls
back a lisp lambda function when evaluated in the browser. And because
toggle updates a Task widget, Weblocks returns on this callback a new
prerendered HTML for this one task only.