Play Framework 2 RC2 has been released and it is quickly becoming a mature and productive way to build modern web apps. Lets walk through building a quick app with Play 2, Scala, Anorm, JSON, CoffeeScript, and jQuery. Once the app works locally we will deploy it on the cloud with Heroku.
Step 2) Create a new application:
play new foobar
When prompted select to use Scala as the language.
Step 3) In the newly created “foobar” directory generate the IDE config files if you’d like to use one. For IntelliJ, run:
Note: This generates an iml file which is not directly importable as a project. Instead you need to create a new project without a module and then import the module from the generated iml file. If you need help with this, follow instructions 8 – 10 in my Play 1 + Scala IntelliJ article.
For Eclipse, run:
Step 4) Start the Play server:
Test that it works by visiting: http://localhost:9000
Step 6) Configure the default data source to use an in-memory h2 database by adding the following values to the “conf/application.conf” file, allow the schema to get crated automatically by configuring application.conf:
# You can declare as many Ebean servers as you want.
# By convention, the default server is named `default`
Step 10) Create a JSON service to get all of the bars by adding a new function to the “app/controllers/Application.java” file:
GET / controllers.Application.index()
POST /bars controllers.Application.addBar()
GET /bars controllers.Application.getBars()
Try it out by opening http://localhost:9000/listBars in your browser. You should see the Bar you created in Step 9.
$ -> $.get "/listBars", (data) -> $.each data, (index, item) -> $("#bars").append "<li>Bar " + item.name + "</li>"
This CoffeeScript uses jQuery to make a GET request to “/listBars”, iterate through the returned data, and add each item to the “bars” element on the page (which will be added in Step 12).
Step 12) Update the “app/views/index.scala.html” template to use the index.js script that is automatically compiled from the CoffeeScript source by adding the following to the “main” block:
In your browser load http://localhost:9000 and verify that the bars are being displayed on the page and that adding new bars works as expected.