intro⌗

Lisp is possibly one of the most powerful languages to ever grace the software engineering field. With Lisp’s power comes the ability to create DSLs(Domain-Specific Languages).

Since Lisp is pretty much a collection of lists that is later turned into machine code, you could turn Lisp into pretty much any other language. Today, you’ll learn how to turn Lisp code into HTML.

prerequisites⌗

  • A Common Lisp Implementation installed on your system, such as SBCL or ECL.
  • Quick Lisp: A Library manager for Common Lisp
  • CL-WHO: The underlying library to transform Lisp into HTML

cl-who⌗

Type in the following commands to load and prepare cl-who for consumption:

; load cl-who
(ql:quickload :cl-who)
; make cl-who output html5
(setf (cl-who:html-mode) :html5)

Now, you are ready to go to.

syntax⌗

All elements are basically a list starting with a keyword that represent the element name, and a couple of keywords representing the attributes, and finally text or a list representing the content of the element.

Or, more practically:

(:h1 "Hello World")
;<h1>Hello World</h1>
(:p (:strong "Wow I am bold"))
;<p><strong>Wow I am bold</strong></p>
(:div :style "background-color: red" "I have a red background color")
;<div style="backgrund-color: red">I have a red background color</div>
(:p "Paragraph" (:h1 "Heading"))
;<p>Paragraph<h1> Heading</h1></p>

printing html⌗

To actually print out the html, use with-html-output-to-string:

; you have to use "cl-who:with-html-output-to-string" because it is in the package "cl-who"
(cl-who:with-html-output-to-string (*standard-output*) (:h1 "Hello World"))
; prints: <h1>Hello World</h1>
; to include the HTML5 DOCTYPE HTML element, replace the first list with "(*standard-output* nil :prologue t)"
(cl-who:with-html-output-to-string (*standard-output* nil :prologue t) (:h1 "Hello World"))
; prints: <!DOCTYPE HTML><h1>Hello World</h1>

; to return a string instead of printing out the output, copy the following snippet...
(defparameter str (make-array '(0) :element-type 'base-char
                                   :fill-pointer 0 :adjustable t))
(with-output-to-string (out str)
	(cl-who:with-html-output-to-string (out nil :prologue t) (:h1 "Hello World")))
; returns <!DOCTYPE HTML><h1>Hello World</h1>

function call⌗

Since with-html-output-to-string is a macro, you could call functions in the middle of the list. This can enable you to create powerful generated pages.

(cl-who:with-html-output-to-string (*standard-output* nil :prologue t) (:p (cl-who:str (+ 10 15))))
; prints: <!DOCTYPE html><p>25</p>

; this can be used to output generate components dynamically. for example, you could create a multiplication table:
(defparameter mul-limit 10)
(cl-who:with-html-output-to-string (*standard-output* nil :prologue t)
 (:html
  (:body :style "background-color: blue"
   (:h1 (cl-who:str (format nil "Multiplication table to ~a" mul-limit)))
   (loop for x from 1 to mul-limit do 
    (cl-who:htm (:div
     (loop for y from 1 to mul-limit do (cl-who:htm 
      (:span (cl-who:str 
             (concatenate 'string (write-to-string (* x y)) " ")))))))))))

That would display the following:

conculsion⌗

cl-who enables you to create very powerful pages. You could create dynamiccomponents and call them however you’d like. With cl-who the possiblities are endless.