A step-by-step guide on how to create a simple, but feature complete, Bed Nap web application.

If you want to write a web application in Fantom then no doubt you're thinking of using the BedSheet framework. But to make full use of BedSheet you also need to know:

  • how IoC works,
  • how to write efan templates,
  • how to componentise them with efanXtra and Pillow,
  • how to cache assets with ColdFeet,
  • how to test the app with Bounce,
  • how to... a whole lot more!

Phew! That list can look quite daunting! But fear not...

This tutorial is a series of articles that will show you, step-by-step, how to create a simple but feature complete web application. The aim is to introduce technologies and libraries one at a time so you can see the natural evolution of the web suite.

The final product will be an online visitor book for an imaginary hotel. You can play with the web application at Bed Nap Hotel.

The tutorial chapters are:

  1. My First BedSheet Web Application!

    We start by creating a simple web application with just 3 small text files that serves up a single static web page.

  2. Bed Nap in F4

    As I tend to do all my Fantom development in the F4 IDE by Xored, this article guides you through how to use it with the Bed Nap application.

  3. Generating Dynamic Content - Adding an IoC Service

    We turn our boring static page into an exciting dynamic one by generating HTML with data from an IoC service.

  4. IDs and ValueEncoders - Adding a View Page

    We add a view page to the Bed Nap app and look at how request URL information is converted into meaningful objects.

  5. Testing with Bounce

    How to test the Bed Nap Web Application with the dedicated Bounce library.

  6. Templating with efan

    Here we convert the Fantom code that generates the HTML markup into efan templates and introduce the concept of components.

  7. Components with efanXtra

    Next we convert the efan templates into efanXtra components, deleting a lot of boilerplate code along the way.

  8. Page Routing with Pillow

    How to use Pillow to automatically route request URLs to efanXtra components.

The full source code for each article is available as a separate branch of the Bed Nap Tutorial Bitbucket Repository.

Have fun!



Discuss