While playing around more with ExtJS and Spring, I ran in to one of my favorite annoyances — setting up a new project. I can create a new webapp in IDEA (or Eclipse) and add some dependencies, but it is still pretty empty. Maven can go a bit farther, but I don’t like how it handles transitive dependencies. None of these will really give me a good starting point out of the box without either copying a bunch of stuff over from other projects or writing a lot from scratch.

To finally scratch that itch, and move further along the Spring & ExtJS path, I turned my demo project into a basic template. The zip archive that you can grab at the bottom is a fully-configured Spring web application, including Tiles, Spring Security, Spring MVC, custom JSON view, Transactions and a Datasource.

To get started, grab the file, extract it to some directory. Open a shell, navigate to the Template directory and run the ant command ant dist. This will compile the whole project and create a Template.war file in the dist directory. Note, I use Java 6 for all development, so if you’re not at least at Java 5, you won’t be able to use this.

Before you drop the war file into Tomcat’s webapp directory, you’ll need to setup the database. First, copy the jar files in lib/tomcat into Tomcat’s lib directory. This is the MySQL JDBC driver and the JTA files for transactions. You’ll then need to create a new database on your local MySQL instance called tomcat. For simplicity in development, create a user with all rights to the tomcat database. Here’s the code to run from a MySQL shell:

create database tomcat;
use tomcat;
grant all on tomcat.* to tomcat@localhost identified by 'apache';

Your other option is to just put in your MySQL root username and password. To do that, or change the connection string completely, edit context.xml under web/META-INF. If you don’t use MySQL, you will have to edit this file and also put the correct driver in Tomcat’s lib directory.

Once you have the database setup, drop the Template.war file into your Tomcat webapps directory and startup Tomcat. Assuming Tomcat is configured to listen on port 8080, you can open the sample by browsing to http://localhost:8080/Template

The application only has a couple pages. First, the login page:

Spring Security is configured to route unauthenticated requests through this page for login. You can take a look at the applicationContext-security.xml file in WEB-INF to see how this was done. There are two users configured for now. User scott with a password of tiger and user bob with a password of password. Yes, not very clever, but it works. Scott is in both the ROLE_ADMIN and ROLE_USER roles, while Bob is only in ROLE_USER.

If you login with scott, you’ll be taken to the index page, which looks like this:

The index page simply contains a text box with a button. Entering a message and pressing the button results in an Ajax call to the server which echos the message back to the page. An HTML element in the middle of the page is updated with the result via JavaScript.

You’ll notice in the footer of the page you can see the currently logged in user on the left, and a link to log out on the right. Clicking the log out link takes you to the logout page, which looks like this:

Again, nothing fancy. Just a message saying you have logged out and a link to login again. Use the login link to login as bob and try the echo functionality again. This time you get a different result:

This demonstrates what happens with Spring Security via annotations. Here’s the echo method in the service layer:

As you can see, the method is secured with an annotation indicating the user must be in the ROLE_ADMIN role to use the method. Bob is only in the ROLE_USER role, so the call to this service fails.

The application makes use of a ResourceBundleMessageSource for the pages mapped through the htmlDispatch servlet. The login.jsp and logout.jsp don’t go through the dispatch servlet, so they can’t use the message bundle for the window and page title.

There is way too much to this simple application to cover completely now, but I’ll give the highlights of what to go look at in the major configuration files. Paths are relative to the project root:

1. web/WEB-INF/web.xml - notice that I configure two dispatch servlets. One catching *.htm and one *.json. This sets things up to treat Ajax requests differently. Spring Security is also configured here.
2. web/WEB-INF/applicationContext.xml – typical application context for a Spring application. I turn on annotation handling with package scanning under the sample.core package. Apache Tiles is configured in this file, and I have also configured a Transaction Manager around the JDBC DataSource. You should tweak this based on your underlying persistence preferences. I’m a RowMapper fan, but you can plug in Hibernate or JPA.
3. web/WEB-INF/htmlDispatch-servlet.xml - the context for web (*.htm) requests. This sets up the ResourceBundle for messages and a typical ViewResolver mapping the *.htm requests to jsp files under web/WEB-INF/jsp. Also configures component scanning for the sample.web package.
4. web/WEB-INF/jsonDispatch-servlet.xml – the context for Ajax (*.json) requests. Configures component scanning for the sample.json package and specifies a custom Ajax ViewResolver. This will automagically serialize all ModelMaps returned out of the Controller responded to *.json requests to JSON.
5. web/WEB-INF/applicationContext-security.xml – so simple to look at, yet so painful to figure out. This is the Spring Security configuration file. Although it looks deceptively simple, it was a beating to figure it all out. It enables annotation-driven security, which you saw on the EchoService above. It also sets up the form login and locks down all the pages. Note I leave the /resource directory open. This is where I put all my javascript, stylesheets and images. If you want to secure those resources, you’ll need to get more specific on the intercept-urls.
   Users are declared at the bottom. Passwords are clear text, which is fine for a trivial demo, but you would want to replace this with something more industrial-strength in a real application.
6. web/WEB-INF/tiles-config.xml – the Apache Tiles configuration. I only setup one definition here to keep it simple.
7. web/WEB-INF/jsp/layouts/baseLayout.jsp – the base layout used for tiles. I’m only inserting content at two locations in the template. In the HTML head section, I allow for an optional insert of headerContent. I use this to include JavaScripts specific to a page. The other content is within the center div called mainContent.
   Note that the body is pretty empty and that the divs all have the x-hidden class. This means they are not normally visible. I use an ExtJS Viewport for layout, which uses the contents of these divs.
8. web/resources/javascripts/layout.js – this JavaScript file was included in the baseLayout.jsp above. It creates the Viewport using a border layout.
9. web/resources/javascripts/index.js – the JavaScript file included for the index.jsp page. It decorates the plain HTML inputs on the page to do the cool Ajax stuff. Note towards the bottom how I use ExtJS to set focus on a form field and to bind the ENTER key to the submit button.
10. web/resources/javascripts/login.js – the JavaScript file use for the login.jsp page. If you look at login.jsp, you’ll notice there is no form. Everything is created by ExtJS from the login.js file, including the cool box effect. One trick is that Spring Security wants a normal form POST for the login form. I override the form to do a standard submit instead of an Ajax submit and set the form action explicitly.

This covers the major features. I’ll be using this as a base for other projects and will be expanding out my ExtJS demo. Since there are pretty much zero examples out there of tying together this stack, I hope this can be of use to some folks.

Project Template

• 2/28/2009 – upgrade to ExtJS 2.2.1, fixed compile issue on Linux, added in iBatis for ORM
• 3/26/2009 – I’ve setup a dev server with the latest version of the template at CodeZombie.com so you can check it out without having to install. User scott/tiger for credentials. I’ll be updating this install with a more feature-rich demo application shortly
• 3/28/2009 – changed around the project structure and build.xml to use Ivy for dependency management. Check the README.txt file in the root directory for the details.
• 4/28/2009 – updated the included JSON encoder to be able to return JSON arrays by using the key _root in the model map. If this key is found, its content will be used as the root element of the return JSON instead of encoding the whole map. Also removed the unicode characters from StringScrubber to make the compiler on Linux happy.

p.s. this pulls together a lot of jars and pieces from different folks to build the demo. If you use this for more than playing around, you need to make sure you respect whatever licenses the authors have in place.

For a small break, I attended the Microsoft Developer Conference in Dallas today. One of the big draws of the conference was Windows Azure, Microsoft’s new cloud computing initiative. More than just a hosting environment, it provides various services too. The Microsoft vision is that users will maintain their information in the cloud and also make use of application in the cloud. I had gotten into the Azure beta, but have not deployed a service, so I was interest to learn more.

The keynote was mostly a pep talk around Azure. But rather than leaving me excited about it, I’m more apt to run away screaming.  My main grief is a total erosion of privacy. The showcase application they demo’d was a Blockbuster video cloud application written in Silverlight. You install the application into your “world”, Live Mesh. At install, the application pops up a security warning saying to install, you allow the application access to your online information, your contacts and your social network. It seems the way Microsoft is trying to draw businesses into using Azure is by enticing them with intimate access to their customer’s data.

I’m just not keen to the idea of me keeping all my personal information up in a cloud when I know that the host’s principal interest is in making that data available to its partners. Yes, I know I’m just trying to maintain an illusion of privacy. The data already available out there on me is probably staggering, but at least a business has to work to find it rather than me laying it down at their feets.

The other sessions were OK, except for the JQuery and ASP.NET presentation. The presenter was very nice, and I’m sure he’d be fun to have a beer with, but he was a JQuery and JavaScript noob, and I expected better content from a Microsoft-sponsored event.

As an example, here’s a little JavaScript trivia. The presenter wasn’t sure about this, and I’ll leave it to anyone interested to fire up Firebug and give it a try themselves.

Which alerts (if any) are shown when this snippet runs:

if("1" == 1) {
alert("First evaluation was true");
}
if("1" === 1) {
alert("Second evaluation was true");
}

I finally got my new work laptop yesterday. For the past month and a half I had been using my personal Dell Latitude D620 for daily development. It is a good little workhorse but is getting a bit dated in the CPU department and I’ve never been particularly fond of the screen, which I always found a bit too dim.

Now say hello to my little friend (and the D620’s big brother), the Latitude E6500. I got it with the 15″ LED-back lit screen, which I can’t recommend highly enough. This screen blows away anything else I’ve seen and is on par with the new screens on the macbook pros. Toss in a dual-core 2.8ghz CPU and 4GB of RAM, and you’ve got the perfect software development laptop.

I got my E6500 with Windows Vista. I know there are plenty of Luddites who still stick with XP because they think it is “faster”, but Vista just rocks. I’m using it for Java development and have installed IntelliJ, MySQL 5.1, Apache HTTPD. All work flawlessly and IntelliJ is beautiful in Aero.

Speaking of a developer laptop, since I just had to do this, I’ll share my “Java on Windows” essential tools list:

1. Java 6 JDK
2. IntelliJ IDEA 8
3. MySQL 5.1
4. Subversion 1.5
5. Tortoise SVN
6. WinSCP
7. Putty
8. UltraEdit
9. SnagIt
10. WinZip Pro
11. DbVisualizer
12. Firefox 3 with Web Developer, Firebug, ColorZilla and Tamper Data add-ons
13. Chrome
14. Tomcat 6

This is my must-have kit for Java development tools. Yes, some are not free, but they are well worth it. Note that I don’t get into all the libraries. Of course I’m using Spring, JUnit, MySQL Connector/J, etc… This just covers core tools.

Core Tools + E6500 = Happy Java Coder

My friend Caleb Jenkins of Improving Enteprises spoke at the North Dallas .NET Users Group last night about Silverlight 2.0 databindings, styles and templates. Caleb is a fun, energetic speaker, the kind of guy you want to have on your team or have a beer with. He’s definitely gungho over Silverlight, but I’m still not getting very warm to it.

Part of my grief with Silverlight is the same I have with Flex. We don’t need browser plugins to build feature-rich RIAs. I will concede the vector graphics space to these two technologies, but that is a space I could care less about. All the applications I work on involve web-based CRUD of business data. HTML and JavaScript are just fine at doing those, and I actually think ExtJS still does a better job than either with the widgets on the page. And since ExtJS is simple JavaScript, CSS and HTML, it will work with all browsers, including the iPhone, today.

To set the record straight, I’m going to expand my .NET demo project into a full demo site so you can see what I’m talking about. I’ll publish the URL when I’ve pushed some code.

I toss out my congratulations to Caleb on his diet. He’s lost 16lbs in only three weeks and it has motivated him to blog about it. He’s even going to have a contest to give away an MSDN subscription tied to weight-loss, although I think he should just give it to me for mentioning him in my blog

Also, I haven’t mentioned Improving Enterprises before, but I should. They merit a blog post of their own, but for now I can simply say they are the best small technology consulting company in the DFW area. I do not know of any other organization with such a concentration of A-list talent and would highly recommend them to any organization that actually needs to get something done.

Not to be outdone by the innumerable quantity of pundits out there making their own baseless predictions, I’m going to toss out my own for the coming year in the technology space:

1. Sun Microsystems is toast. Their only real asset is Java, and it is worth more to a company like IBM or Oracle. If the frigid economic climate continues, Sun will be purchased by IBM.
2. Windows 7 will rock. This prediction might get delayed until early 2010 given Microsoft’s track record, but I fully expect Windows 7 to put Microsoft firmly back in the drivers seat. It will make up for past sins and put Apple on the defensive.
3. Google and Apple turn out to be evil after all. Pretty safe bet; both want to be what Microsoft was last year and will sell their souls to do it.
4. Microsoft won’t be the evil empire any more. Now that Bill is gone and Ray Ozzie is setting the tone, you’ll see a lot more warmth and geek-friendliness out of Microsoft. Check out Microspotting if you want to catch a glimpse of the new Microsoft.
5. Oracle will buy Spring Source. This is about the only jewel they’re missing and would be a better investment than BEA was. Unfortunately, it will kill all the enthusiasm around the Spring Framework, thus killing one of the few exciting things left in the Java space.
6. (Wildcard) Microsoft buys ExtJS. Apple picked SproutCore, so Microsoft needs a good RIA JavaScript library. They’ve put their backing behind JQuery, which is awesome, but it is not in the same league as ExtJS. They could buy ExtJS for a pittance and have one of the best AJAX widget libraries on the market overnight. ExtJS and ASP.NET MVC will be the winning combo.

As I mentioned in my prior post, I’ll be giving $100 a month to a different charity all year long in 2009. My selection for January is actually the easiest.

For the folks that don’t know me, in addition to technology, my other interest is photography. I’ve been taking and playing with pictures since I had my first B&W darkroom at age 13. I do portraits, weddings, travel and artistic glamour. Although there are a many great photographers in the world, I have a very short list of ones who have inspired me.

One of my inspirations is Sebastiao Salgado. I became acquanted with his work in the 90’s when I picked up his book An Uncertain Grace. This is a truly stunning piece of work that forever changed my perspective on the power of photography. I had dreams of emulating him, traveling the world with a Leica M6, taking high-impact B&W images on Tri-X. Reality set in, and I chose a different path, but his work is still some of the most beautiful and haunting art I have ever seen.

Now what does all this have to do with charity? Simple. Many of Sebastiao’s greatest pictures were taken while he was following Doctors Without Borders/Medecins Sans Frontieres (MSF). This humanitarian organization has provided relief in many of the locales depicted in his photos. So in honor of the photographer that inspired me, I gave my $100 for January to the organization that inspired him.