I thought it would be worthwhile documenting the proof of concept app that I developed last year.

This was built with the Reboot Landing Bootstrap theme. There are issues, front and back, so I’ve decided to “freshen” several areas but there are some features worth keeping, e.g. texting players directly from the app on an iPad. You can find the code here. And this is what it looks like, the retro style font used in the playermanager logo is YWFT Trisect…

“Blue and green should never be seen, except on the head of an Irish queen” I remember my mother saying to me when giving me some fashion tips, probably about my blue and green tank top. I my defence it was probably in the 70s. Personally I like the combination of blue and green and think it makes a nice colour scheme for a footie app; Rangers and Celtic, blue sky and green grass, blue sky thinking (really?) managers and players …erm, coz they play on grass.

Blue and Green Theme

I googled for some example and came across this post at Crazy Egg, number 7 Lake Nona with its “fresh, modern color palette” looked good to me. Next up was choosing a Twitter Bootstrap theme. Cerulean from Bootswatch was a possibility, but I ended up splashing out $4 on Ericka and a ridiculous $15 on Reboot Landing from WrapBootstrap. Combining elements from all of these themes was beginning to feel like it might just work. But I needed some nice icons…

Font Awesome

The icons from Font Awesome are actually awesome. Designed to work with Bootstrap they are unbelievably good looking and easy to use and all for free. I plan to use them liberally throughout. So far they are on the index page, coloured to match the theme. The masthead icon and favicon have also been created from the font as well, pasting the font into Adobe Illustrator and exporting as a PNG.

Google Fonts

Google’s Oswald font is used both in PlayerManager and in the theme for this blog. It somehow reminds me of football shirt fonts.

Result

The most important thing is the result…

And on the touchline…

Thanks to Pixeden for the iPad mockup. You can get the source code here.

Tomcat, TomEE or GlassFish? I like the simple life. But getting to the simple always seems to take so long. And with enterprise java sometimes even longer than that… I was experimenting with Java EE 6 RESTful Web Services and Entity beans generated with NetBeans when I thought it would be good to test how easy it would be run this app on Tomcat, TomEE and GlassFish. Well, with Tomcat I would have to build my own Tomcat based Java EE 6 server (again). To be honest I couldn’t be bothered and the guys at TomEE had already done that. So it was between GlassFish, the reference EE server, and TomEE.

Running one of the sample NetBean apps, Customer Database on Spring, on GlassFish is as easy as you might expect, but porting that to TomEE was more difficult than I expected… With TomEE there is a choice to be made from the 3 versions currently available; standard, web services and enterprise options (not the official names). I really only wanted the web service version (Java EE 6 Certified JAX-RS) for its RESTful web services but as I wasn’t sure if that contained everything that I would need I went with the enterprise version (TomEE 1.5.1 Plus) which has the most supported APIs.

With the TomEE version choice made I started googling for what seemed like days for documentation, help, examples, anything that would help me to configure an app on TomEE, an app that took minutes to write in NetBeans and run on GlassFish. Finally stumbling across this I was able to piece together what was required to get things working on TomEE.

A resources.xml file needs to be in the WEB-INF/classes/META-INF folder to define a data source, e.g. this example defines a Derby data source.

I also had to update the persistence.xml file to use the EclipseLink JPA provider as I just couldn’t get the default TomEE JPA provider (OpenJPA) to work…

TomEE 1.5.1 doesn’t like Spring injecting an EntityManager, as documented here. So I removed that from the Spring config, instead relying on the GlassFish managed entity manager. No big deal there, and not a big deal either to remove the lines of code that were closing the entity manager, as that isn’t allowed with a container manager entity manager.

All in all it wasn’t too hard to prove that a simple Java EE 6 app can be ported from GlassFish to TomEE.

Memory
Upgraded memory from 1GB to 4GB as the minimum for Lion is 2GB. Apparently the max for my Mac Mini is 2GB or 3GB depending on what out-of-date website you believe.

Lion Server
Signed up to Mac Developer Program for £60 to get access to downloads of Mac OS X, Server add on, etc. My Mac Mini’s architecture doesn’t support Mac OS X 10.8 Mountain Lion. Although Lion is available from Apple (for about £20 I think) but not via the online store. Upgraded from Mac OS X 10.6.8 Snow Leopard to 10.7.5 Lion with the Server add on.

Fan
Waited for Spotlight to stop indexing. Wondered why the fan on the Mac Mini was going mental even after Spotlight had finished doing its stuff. Realised that I hadn’t reconnected the fan after the memory upgrade. Attached the fan cable.

Server vs iCloud
Decided not to bother using the Server functionality to share calendars, contacts, etc but to go for the convenience of iCloud instead.

And finally … bish, bash, bosh I have a Mac OS X Server ready for testing and other stuff like iTunes streaming via TwonkyServer which works well on DLNA devices.

In the end it wasn’t too painful and I feel as though I’ve saved myself about £800 on the cost of a new Mac Mini with OS X Server.

I’ve been rethinking using Eclipse as my Java & HTML5/JavaScript IDE of choice since discovering that NetBeans 7.3 supports both, and with integrated Chrome JavaScript debugging and Twitter Bootstrap, BackBone.js and Jersey RESTful WebServices support it seems too good to be true. But after getting a couple of building a couple of simple apps with NetBeans it could be time to wave goodbye to Eclipse plugin hell and say hello to NetBeans simplicity.

One thing I couldn’t figure out was why the CustomerDBSpring sample app and the CustomerRestfulService app were producing different JSON. It turns out it was all down to how Jersey was configured to convert Java to JSON. This guy describes the problem well and the first solution that I tried, but clearly that wasn’t a great long term option. The longer term solution was to use Jersey’s POJO support, which basically amounts to sticking this in your web.xml.

One of the challenges was to replicate the technical architecture of the production environment in the development environment. Installing Apache HTTP Server, Apache Tomcat and MySQL was a skoosh but mod_jk on OS X was a different issue. In fact I had problems with the subversion plugin for Eclipse 4.2 and upgrading from Eclipse 3.6 to 4.2.

mod_jk
No easy download and install for mod_jk on Mac OS X, oh no you have to get the source code and build it your self. After downloading the mod_jk source …

Eclipse 3.6 to 4.2 upgrade
Upgrading from Eclipse 3.6 to 4.2 didn’t work, but I put that down to the Flex plug-in. I gave up on that upgrade and installed a new 4.2 version and backed out the upgrade on 3.6 with the wonders of Time Machine. I need the 3.6 version to support the Flex apps I’ve built with Eclipse 3.6. I have an elephants graveyard eclipse versions on my machine.

Unfortunately the 4.2 Juno release initially ran like a dog. It would take several seconds to just open a file, I’m not the only one to experience this problem. Increasing the memory allocation in the eclipse.ini file soon sorted this problem though…

-Xms1024m
-Xmx2048m
-Xss2m

Subversion plugin
Using the subversion plugin from Eclipse 4.2 on Mac OS X also needed a bit of work, this time having to install subversion and a load of other Darwin port stuff. The magic that worked for me was…

HTML5 presentation tier
Choosing HTML5 and JavaScript for the front end was a difficult decision. After putting a fair bit of effort into Flex in the last five years it felt bad ditching ActionScript in favour of its ugly sisters HTML and JavaScript but with the likes of Twitter Bootstrap and Backbone.js things have changed a lot since I last fiddled with them. There seems little no point in dusting off my ancient copies of HTML: The Definitive Guide and JavaScript: The Definitive Guide, or even giving them to the Scouts Fall Fair, I’ll just need to splash out on new ones.

This tier will be served alongside other static web content from the playermanager.net website on an Apache HTTP Server, passing any Java RESTful API calls to the Java tier below via mod_jk.

Java RESTful web services middle tier
A RESTful web services tier seems like a good a choice from a Service Oriented Architecture view, developing services so that different clients, e.g. mobile apps, browsers, FIFA, can make use of playermanager services via a RESTful API.

Choosing Java for the implementation of the RESTful API was a fairly easy decision. In my experience RESTful Java web services written in Jersey producing and consuming JSON are a very lightweight and productive option. Using Spring in the Java tier seemed like a good choice based on industry best practice and extensive Jobserve research; Spring Security to secure the RESTful API, Spring’s data access framework with Hibernate to simplify the reading and writing of data in addition to Spring’s dependency injection are all tried and trusted methods.

The Apache HTTP Server of the tier above passes on any Java RESTful web services API calls to an Apache Tomcat Java Server that services any URL beginning /api.

MySQL database data tier
MySQL was an obvious as its simple and open source with good developer and admin tools.

Currently all of the tiers above run on one CentOS machine, hosted by enciva for £10 per month, but there is scope for scaling this architecture when playermanager goes global. And will scale further with the addition of caching where appropriate, e.g. mod_cache and Ehcache.

So that’s the architecture in a nutshell. Next up is the development environment.

I’ve been looking around for a nice WordPress theme. Christophe Coenraets does a fine blog with StudioPress Minimum theme but that is more the reassuringly expensive option. This Blaskan one seems like a good free choice, it’s responsive, clean and uncluttered. All I think I need to add is source code formatting and a GitHub respository to share example code.

I’ve started developing an app called playermanager, you can find it at www.playermanager.net. It’s a webapp to help organise my kids’ footie teams and the games that I play in. Even when the app is finished it probably won’t help get Scotland to a World Cup finals but it should make informing parents that the school footie training is cancelled or getting 10 players for a works 5-a-side game a wee bit easier…

Don’t rely on Eclipse

Just to state the obvious it’s best not to rely on any Eclipse generated class files, relocated properties files, etc. If you do rely on Eclipse then this will only lead to confusion when someone, who hasn’t first of all built the app from within Eclipse, runs your ant file from the command line and gets different results to you!