Complete Guide to Write Vaadin application in Clojure

In this article I'm going to show you how to write a simple vaadin application in clojure. Before start you need some tools. All of the tools are free downloadable.

Assume you have some basic knowledge about vaadin and clojure.

It is not necessary to use IDE(Intellij IDEA, Eclipse, Netbeans) to write the clojure code. You can use a emacs or vi editor to write the code. But using an IDE can obtain lot of advantages. 

If you'r using an IDE install the corresponding clojure plugin. 

So now if you have all the tools we can start the coding.

First step is the project creation.
  • lein new example 
Using the above command you can create the project and the following files are created.
  • project.clj
  • src
    • example/core.clj
  • test
    • example/test/core.clj
In order to develop vaadin web application we need the web.xml file. To generate the web.xml file
  • lein war
Now the above command will create the web.xml file inside the src directory.

It's all about project creation. Now you need to edit the files to create the vaadin app.

2nd Step

Edit the project.clj file

(defproject example "1.0.0-SNAPSHOT"
:description "FIXME: write description"
:dependencies [[org.clojure/clojure "1.2.1"]
[org.clojure/clojure-contrib "1.2.0"]
[com.vaadin/vaadin "6.6.0"]
[javax.servlet/servlet-api "2.5"]]

:dev-dependencies [[ "0.0.1"]]
:aot[example.vapp example.vaadin-servlet]
:war {:name "example.war"}

In order to compile the project you need the above dependencies.

3rd Step

Delete the core.clj file and create a file called vapp.clj

(ns example.vapp
:extends com.vaadin.Application
:name example.VApp
:init cjinit)
(:import (com.vaadin.ui Embedded ))
(:import (com.vaadin.terminal ThemeResource ExternalResource Sizeable))
(:import (com.vaadin.ui Alignment))

(defn -cjinit []
[[] (ref {})])

(defn -init [this]
(println "Starting vaadin application")
(let [window (com.vaadin.ui.Window. "sample clojure vaadin application")]
(.setMainWindow this window)
(.setTheme window "runo")
(let [grid (com.vaadin.ui.GridLayout. 3 3)]
(.setSpacing grid true)
(.setWidth grid "600px")
(.setHeight grid "600px")
(.addComponent window grid)
(let [nav_panel (com.vaadin.ui.Panel. "Sample Panel")]
(.setWidth nav_panel (Sizeable/SIZE_UNDEFINED) 0)
(let [form (com.vaadin.ui.FormLayout. )]
(.setMargin form true)
(let [link1 (com.vaadin.ui.Link. "Link 1" (ExternalResource. "" )) ]
(.addComponent form link1 )
(let [link2 (com.vaadin.ui.Link. "Link 2" (ExternalResource. "" )) ]
(.addComponent form link2 )
(.setContent nav_panel form)
(.addComponent grid nav_panel 1 2)

Now create the vaadin_servlet.clj in src/example directory.

(ns example.vaadin-servlet
:extends com.vaadin.terminal.gwt.server.AbstractApplicationServlet
:name example.VaadinServlet))

(defn ^Class -getApplicationClass [this]

(defn ^example.VApp -getNewApplication [this request]

Now Edit the web.xml file as follows.

  <!-- Servlet class taken from first :aot namespace -->
  <!-- Servlet is mapped to / by default  -->

Now compile the project using following command.

  • lein compile
It will download all the dependencies and compile the code.
If there is any error it gives some exceptions.

4th Step
To build the war file use the below command.
  • lein uberwar
It will create the war file that you given in the project.clj.

Copy the war file into tomcat and the start the server. 
  • localhost:8080/example 
You can see the menu button.

Reference :

1 comment:

  1. Very nice article, but appears to be a bit outdated now. lein-war has been deprecated, and from what I've seen it looks like you're supposed to use lein-ring now. I tried following the tutorial, but this little issue stopped me cold. If you get a chance, I'm sure there are lots of people out there that would appreciate an update.