How To: Create a new Lift App

First Steps

This tutorial will get you started on a new Lift project. Lift projects are created using Maven Archetypes, so make sure you have Maven 2 version 2.0.9 or greater installed and working.

So let’s generate a new Lift project. We have a couple archetypes to chose from, but for this example we will use lift-archetype-basic which will supply us with some extras such as a default derby database, User model, and basic stylings. If you’d prefer a clean slate starting out, try lift-archetype-blank.


mvn archetype:create -U  \
 -DarchetypeGroupId=net.liftweb                             \
 -DarchetypeArtifactId=lift-archetype-basic                 \
 -DarchetypeVersion=1.0                            \
 -DremoteRepositories=http://scala-tools.org/repo-releases  \
 -DgroupId=com.liftcode.hello -DartifactId=hello-lift

The skeleton of your new project has been created. Now jump in and start jetty to test it out

$ cd hello-lift/
$ mvn install jetty:run

Looking at http://localhost:8080/, you’ll see your new generated app. Let’s add a page.

Adding a new static page

Lift is a view-first web framework, meaning that when a request comes in, by default lift tries to find the proper view template to satisfy the request. View templates are stored in src/main/webapp/. Let’s create a new page viewable at /test

test.html:

<html xmlns="http://www.w3.org/1999/xhtml">

<body>

  Hello Friends!

</body>

</html>

Notes:

you can also store your pages in sub folders of src/main/webapp/. See Organizing your pages?
don’t forget the attribute xmlns="http://www.w3.org/1999/xhtml". Without it, the xml content of page will be displayed.

Adding the new page to our SiteMap

For a page to be seen in a Lift app, it must be added to the project’s SiteMap?. SiteMap? allows you to define permissions for pages. All new projects come with a default SiteMap? in Boot? that can be optionally removed.

Create a new Menu object and append it to your sitemap in the Boot.boot method like so:

src/main/scala/bootstrap/liftweb/Boot.scala (partial boot method):



val entries = Menu(Loc(“Home”, List(“index”), “Home”)) :: 

       Menu(Loc(“Test”, List(“test”), “Test Page”)) :: User.sitemap

Recompile and run the server with “mvn jetty:run”

Now take a look at http://localhost:8080/test and see your new page. Pretty basic, yes? Let’s make it look like the rest of your app’s pages.

Using lift:surround

Lift apps come with a basic wrapper template found in src/main/webapp/templates-hidden/default.html. Let’s use it for our new page.

test.html:

<lift:surround with=“default” at="content">

  Hello Friends!

</lift:surround>

Note: The default template will surround “Hello Friends” with <html> <head> and <body> tags, so we don’t have to worry about supplying our own in test.html.

Look again at http://localhost:8080/test and you’ll see the green Lift template.

Using lift:snippet

If you want more than static content in your document, you can place snippets in the template. A lift:snippet will call your Scala code and place the returned content in place of the lift:snippet

test.html:

<lift:surround with=“default” at="content">

  Hello <lift:Friends.show />!

</lift:surround>

src/main/scala/net/liftweb/hello/snippet/Friends.scala



package net.liftweb.hello.snippet
class Friends {

  def show = <span>Friends</span>

}

Run mvn jetty:run for your project again and look at http://localhost:8080/test again and notice that ‘Friends’ is now styled per your Friends.show method.

lift:snippet can do much more than just this which we will show in future HowTos. For now, look through the snippet packages in the bundled example apps to look for ideas.

Last edited by dpp, Wed Jul 29 17:20:01 -0700 2009

Home | Edit | New

Versions:

How To: Create a new Lift App

First Steps

Adding a new static page

Adding the new page to our SiteMap

Using lift:surround

Using lift:snippet

Pages