Showing posts with label eclipse. Show all posts
Showing posts with label eclipse. Show all posts

Monday, June 15, 2009

Creating FreeMarker Templates

Before we can execute a template, we have to create one.

A template is basically just an HTML file with some extra bits for making minor decisions and displaying collections of data. When we create the template we decide what kind of data we'll need, but we don't know exactly what values will be assigned. That happens later, when the servlet gives the template values for the data it needs.

For the front page, let's say that we just need to know if the user is logged in or not. Eventually we'll want their name, too, but remember that we haven't put that into the datastore yet. So we'll settle for knowing if they're logged in.

In Eclipse, right click on the war directory in your project and choose New->File. Name it something like Front.ftl. The extension must be .ftl for the FreeMarker plugin to operate on it.

Now let's copy over the HTML from the project.html file, and remove the bits we don't need. We'll end up with something like this:


<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="Omega.css">
<title>Web Application Starter Project</title>
</head>

<body>

<h1>Web Application Starter Project</h1>

<!-- Put your RPX Sign In link here -->

<!-- Put your RPX Javascript here -->
</body>
</html>


Except that you would have actually copied your RPX Sign In link and Javascript over from the project.html file.

Now picture that if the user is signed in, we want to display a Sign Out link instead of the Sign In link. Let's just go ahead and put a Sign Out link in there, just before the Sign In link.


<a href="/signout">Sign Out</a>


We don't have a signout servlet yet, but that's okay for now. We can use an if statement inside a FreeMarker template, similar to in Java. Let's pretend that we have a variable called "loggedIn" that's true if the user is logged in.

If we do something like this:


<#if loggedIn>
<!-- Put Sign Out link here -->
<#else>
<!-- Put Sign In link here -->
</#if>


Replacing, of course, the comments with the appropriate HTML, then the template will only display one of the links, depending on the value of loggedIn.

So how does the value of loggedIn get set? That's over in our front page servlet, and the next post.

Installing FreeMarker

There are two pieces to install with FreeMarker. One is the server side code needed to allow the servlets to run template files. The other is the Eclipse plugin that provides support for writing template files.

Let's start with the plugin (you remember installing all those plugins earlier, right?). Go to this page and copy the link for the version of Eclipse you have (use the Stable Updates links). Install just the FreeMarker IDE from that site.

Restart Eclipse at the end, and we'll move on to the FreeMarker server libraries. Download the latest stable version at the FreeMarker download page. Unzip the file onto your desktop, and look for lib/freemarker.jar (the rest of the zip file is documentation that you may want to keep).

Copy freemarker.jar into the war/WEB-INF/lib directory of your project in Eclipse. Right click on the file, choose Build Path->Add to Build Path.

That's it, we can now both create template files and execute them from servlets. We'll see how in the next few posts.

UPDATE: If you're using more recent versions of GAE and Freemarker than are installed in the labs (very likely if you've installed the latest versions at home), there might be a conflict between them. If you get an error message when compiling code that uses Freemarker templates about TreeNode being a restricted class, then you have the versions that are not compatible.

There's a workaround here. The workaround is to to create a TextBlock.java file in the freemarker.core package (the thread linked to gives the code you put into that file). If you got it right, you should see, under your src directory in Eclipse, a freemarker.core package (at the same level as your project.server and project.client packages).

Note that to successfully copy the code from the thread, you need to click the Read More link at the bottom of that message (since not all the code shows in the thread view). Then, after you paste the code into Eclipse, you'll get some errors because of line wrapping in the thread. Just back the offending lines onto the end of the previous line to remove the wrapping, and it'll compile.

Eventually, this will be fixed in one way or another (probably with a Freemarker update), and your version of TextBlock.java can be removed.

Tuesday, May 19, 2009

Subversion Server

Since I want to do this project as a sample that will work for anyone reading it, not just the students in my class, I'm not going to set up a local Subversion repository for the code.

Instead, I'll use a site that offers free Subversion hosting. XP-Dev.com has both free and paid modes. One of the things I liked about their free mode is that there's no limit on the number of users. So if I decide later to take on collaborators, they can get access to the code.

Another free service that looked good was Unfuddle.com. They limited their free version to just a couple of users, though, and didn't provide as much storage space.

So I created an account over at XP-Dev.com. First step there is to create a Subversion repository. It'd be helpful at this point to know what my project was going to be about, to name the repository appropriately. Since I don't, I'll just pick a working code name for the repository.

Click on Subversion in the list on the right after you're logged on to XP-Dev.com, and then click on New Repository. Put in a name of some sort and click the Save button.

The next page that shows gives you the addresses you'll need to configure Subclipse. Copy the No SSL address and start Eclipse.

Create a new project in Eclipse (File->New->Web Application Project). Name the project, and give it a package name, too (that can be the same as the project name). Make sure that it's checked to use the latest versions of GWT and App Engine. Click the Finish button.

Open Window->Open Perspective->Other..., and choose SVN Repository Exploring. In the upper left pane, choose the little icon that has a + and SVN on it to add your new repository. Paste in the URL you copied from XP-Dev.com after you created your SVN repository, and click the Finish button.

Enter your XP-Dev.com user id and password when asked. You should then see your repository listed in the upper left pane.

Now let's hook that repository up to the project you created. Get back to the Java perspective (Window->Open Perspective->Java) and right click on the name of the project in the upper left pane. Choose Team->Share Project..., choose SVN and click the Next button. Use Existing Repository Location should already be selected, and you'll see your XP-Dev repository listed. Make sure it's selected, too, and click the Next button. On the next screen it asks for the folder name, I just left the default selected and clicked Next.

On the next screen click Finish, and it'll ask if it should open the Synchronize View perspective. Click Yes, and the Team Synchronizing perspective opens. This is where you can add files to the repository so that they're under version control. To do this we right click on a file and choose Add To Version Control.

We can do the same thing from the Java perspective, by right clicking on a file and choosing Team->Add To Version Control.

Let's go ahead and add everything using the Team Synchronizing perspective. Right click on the name of the project and choose Expand All. Select all the actual files (but not the directories) by holding down the control key as you click on each file.

Be sure to select all the .jar files from war/WEB-INF/lib. You haven't written those files, but including them makes it easier to recreate the project from SVN if you have a computer or disk crash.

Right click on one of the selected files and choose Add To Version Control. Then right click on one of the files and choose Commit. You'll now be able to enter a comment to be attached to this particular version of the files in the repository. I entered "Initial version" and clicked OK.

Subclipse will now upload those files to the repository. If you log in via the web to XP-Dev.com you can browse the repository and see the files there.

We'll need to remember to add new files we create to version control, and to Commit changes to version controlled files.

More on that as we go along, and other Subversion related topics.

Installing Eclipse

The IDE I'll be using for this project is Eclipse.

For the course, the computer labs will already have Eclipse installed and configured. Most of the students will also already have Eclipse installed on their home machines and/or laptops. But, they probably have the Eclipse IDE for Java Developers, not the one for Java EE Developers. We're moving into web programming now, so let's move to the version of Eclipse that has tools specifically for web programming (at this point, I have no idea if we'll need the extra tools or not...that's how software development goes when you're trying something new, you seem wise only after you've made your mistakes).

Head over to the Eclipse downloads page, and download the latest Eclipse IDE for Java EE Developers. Have some coffee, or take a walk in the sun, while you wait for the download to complete.

What the download gets you is a zip file. If you've never installed Eclipse before, just unzip this file somewhere (the root of your C: drive is traditional, but if you have another version of Eclipse there and don't want to overwrite it, anywhere will do). You'll end up with an Eclipse directory with a whole bunch of files and directories under it. One of those files immediately under it will be Eclipse.exe. Make a shortcut to that somewhere handy, like on your Desktop.

Start Eclipse, and wait for a bit more. When it asks you about the workspace, you can accept the default or change it. You should know where your workspace is if you aren't going to be using a hosted version control system, so you can regularly back up your code.

Now, for the plugins. Note that everything but the Google Plugin was part of the Pro Web 2.0 toolset, so credit goes to Jeff Dwyer for choosing them for his project. I'm just following his lead.

Google Plugin

This is an important one, since it takes what used to be a bunch of command line typing for managing GWT and App Engine projects and instead gives us Eclipse menus. See the Google page about installing this plugin. To find out what version of Eclipse you have (if you've forgotten what you downloaded), in Eclipse look at Help->About Eclipse Platform.

Once you figure out which of the URLs you need, copy that and then go into Eclipse's Help->Software Updates menu. Click on the Available Software tab, and then on the Add Site button. Paste in the URL from you copied from Google's page and click OK.

You should see now the option to download not only the plugin, but also the latest versions of GWT and Java App Engine. Go ahead and check all three and click the Install button. It'll take a few seconds to calculate dependencies, and then will display an Install wizard. Go ahead and click Next, and then accept the terms of the license agreements. Click the Finish button, and it'll actually do the install. Click Yes when it asks if you want to restart Eclipse.

We now have the Google Eclipse plugin, plus the GWT and App Engine files we need to develop those sorts of applications.

Subclipse Plugin

This plugin allows Eclipse to work with a Subversion repository (a particular type of online version control). That's the sort used by Google Code, so if you're making your project Open Source then you'll be able to use Google Code to host it. If you aren't making it Open Source, then you'll have to find another Subversion server to use (do a Google Search on free subversion hosting and you'll find some that are suitable for single person projects).

To install Subclipse, go to the Subclipse web site and click the Download and Install link on the left. Scroll down a bit to where it lists the links for the most recent version. Copy the link that's labeled Eclipse Update Site URL.

In Eclipse, go back to Help->Software Updates, and back to the Available Software tab to Add Site with the URL for Subclipse. Click the box next to that URL when it shows up in the list to install everything from that site. Click Install, Next, agree to the license agreements, and Finish.

Restart Eclipse again.

Find Bugs Plugin

Install the Find Bugs plugin. This plugin will look for some common causes of errors in Java programs. These sorts of errors will pass the compiler, but cause you problems. There's a huge variety of bugs that are looked for as part of this. Most you won't ever see, but if it saves you the time tracking down even one obscure bug, it'll have been worth installing.

That's it for Eclipse.