Introduction To Haskell

Lecture 11

Snap and XMonad: Haskell in the Real World

Using These Slides

Every slide has a secret note.

  • On Chrome: press F12, then click Console
  • On IE: press F12, then click Console
  • On Firefox: Ctrl+Shift+k

Shortcut Keys:

, PgDn, n, j next slide
, PgUp, p, k prev slide
Esc enables ctrl+f globally

Web Framework

A web application framework is a software framework that is designed to support the development of dynamic websites, web applications and web services.

Examples of Web Frameworks


$ cabal update
$ cabal install snap

Snap installs in ~/.cabal/bin

Add that directory to your Path so you easily use snap.
On unix-like systems, you do this by editing ~/.bashrc

# add this line somewhere near the end:
# naturally, change "binroot" to your username


Set up Snap

You're ready to start using Snap

$ mkdir myWebsite
$ cd myWebsite
$ snap init barebones

We now have two folders and a .cabal file

Compile it

The barebones project compiles out of the box.

Just do:

cabal install

Your project installs in ~/.cabal/bin

Run it

Run ~/.cabal/bin/myWebsite from the terminal

$ myWebsite

You are now running a webserver on port 8000

Open up your web browser and go to localhost:8000 to see your website!

(You can change the port by running myWebsite -p 1234)

Explore the site/code

-- from Main.hs
site :: Snap ()
site =
    ifTop (writeBS "hello world") <|>
    route [ ("foo", writeBS "bar")
          , ("echo/:echoparam", echoHandler)
          ] <|>
    dir "static" (serveDirectory ".")

What happens when you visit these endpoints?

  • http://localhost:8000/foo
  • http://localhost:8000/echo/hi
  • http://localhost:8000/blah

What's going on?

  • If landing on root page, display "hello world"

  • If landing on /foo, display "bar"

  • If landing on /echo/:stuff, display :stuff

  • If user lands on /static/something.pdf, display /static/something.pdf

  • Otherwise, display a 404 error page

Take a Deeper Look

site :: Snap ()
site =
    ifTop (writeBS "hello world") <|>
    route [ ("foo", writeBS "bar")
          , ("echo/:echoparam", echoHandler)
          ] <|>
    dir "static" (serveDirectory ".")

<|> is a fancy if-statement.

It checks the left side and does the action, otherwise does the action on the right side.

route is an effecient mapping of endpoint to action

It's run-time is O(ln n)


Time to see how real websites are made!

Start working in a new folder, myRealWebsite

$ mkdir myRealWebsite
$ cd myRealWebsite

Now, don't install with barebones. Instead do:

$ snap init

Compile and Run it

$ cabal install

$ myRealWebsite

Explore your website at localhost:8000

Heist Templating

Snap uses Heist, a website templating engine.

Find base.tpl in myRealWebsite/snaplets/heist/templates/

You can see how this file is a "template", and <apply-content/> substitutes in for something else.

Snap Programming

All code lives in the src/ folder.

Open Site.hs and examine the app function.

Play around with Snap.

Make an endpoint /fac/:num that returns the factorial of the :num.


Let's shift gears and talk about another popular Haskell program

XMonad is a window manager that tiles windows automatically

(And it's written in Haskell!)

The Word

Check out what people are saying

See some screenshots

Install and Config

After you install XMonad, you can configure the look and feel in a xmonad.hs file.

Here is mine


Haskell in the Wild