HowTo start a new liftwebapp

From Lift

Jump to: navigation, search

Contents

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 installed and working. You will also need to have Scala installed, preferably version 2.6 or higher.

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 org.apache.maven.plugins:maven-archetype-plugin:1.0-alpha-7:create  \
 -DarchetypeGroupId=net.liftweb                             \
 -DarchetypeArtifactId=lift-archetype-basic                 \
 -DarchetypeVersion=0.8                            \
 -DremoteRepositories=http://scala-tools.org/repo-releases  \
 -DgroupId=net.liftweb.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:

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", "/", "Home")) :: Menu(Loc("Test", "/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:snippet type="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.

Retrieved from "http://liftweb.net/index.php/HowTo_start_a_new_liftwebapp"
Personal tools