Updating the Play-Framework Example

I’ve been learning a bit of Scala recently and I decided to look into one of its most well-known use cases, the Play Framework. This framework, I feel, is similar to Django for Python: a web-application framework that easily integrates database transactions and includes HTML templates. As my only experience in writing a web application using any sort or JVM language goes back to Apache Velocity, a framework that hasn’t seen an update since 2010, I decided to try and experiment wtih something more modern and supported.

Following their video tutorial on their home page, I was off to the races! Or, so I thought.

Things were going well for a while, but I was getting compilation errors when trying to add or retrieve items from the in-memory H2 database. And though my Coffeescript code seemed to transpile, it did not run when loaded on the client’s end.

The problem, it seems, is the Play framework has been updated (to version 2.5) since the last tutorial was put out (version 2.3 or before), and finding information on how to properly update the code seen in the tutorial to modern standards and practices proved difficult.

If anyone else is having issues while testing the tutorial, let me save you some time.

To get the database connections to work and compile, I had to add these two lines to my build.sbt file:

"org.sorm-framework" % "sorm" % "0.3.21",

"com.h2database" % "h2" % "1.3.168",

The first is the Sorm framework the host speaks to, and the second is the actual H2 database connector.

Great, but I still couldn’t compile. I was having an issue linking my Javascript file in my index.scala.html. It seems the API for this has changed somewhat. I named my script file getPersons.coffees instead of index.coffee. Now, instead of the import being:

<script src="@routes.Assets.at("js/getPersons.js")"></script>

it should be:

<script src="@routes.Assets.versioned("js/getPersons.js")"></script>

Yep, there we go. Now I could compile and retrieve the main page at localhost:9000.  I could submit new names to the database, and I could see them being saved when I went to localhost:9000/persons, but they weren’t being fetched using my Coffeescript code.

Their example code for this operation is correct, but I had to add this line to the HTML head to fetch JQuery in order for my script to run properly:

			<link rel="stylesheet" media="screen" href="@routes.Assets.versioned("stylesheets/main.css")">
			<link rel="shortcut icon" type="image/png" href="@routes.Assets.versioned("images/favicon.png")">

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

Finally! It’s working.  I’m able to add names to my database and retrieve them using an HTTP GET call and parsing the JSON into an HTML unordered list.

You can see the final source code here.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s