Introduction to the Play Framework

Reading Time: 3 minutes

What Play is ?

Play makes you more productive. Play is also a web framework whose HTTP interface is
simple, convenient, flexible, and powerful. Most importantly, Play improves on the
most popular non-Java web development languages and frameworks—PHP and Ruby
on Rails—by introducing the advantages of the Java Virtual Machine (JVM).

Project Structure

Now, it’s time to load the project code into the IDE and look at the directory structure.

In our project directory, we see four directories created by the sbt template: app/controllers, app/views, conf, and public.

  • The controllers directory is where we will store our Scala code
  • The views directory is where we’ll save our HTML templates
  • The conf directory contains our router configuration which maps a request URL to a specific class and method
  • Finally, the public directory contains the static content served by the Play Framework server

That’s all we need to know about the directories for now.

Implementing Example

1. Create the Welcome page

First, let’s create a new file in the app/view directory. We’re going to call it firstexample.scala.html. Now, we open the file and save the following code as its content:

Follow the instructions below to add a new Welcome page to this project.

With any text editor, create a file named welcome.scala.html and save it in the app/views directory of this project. Add the following contents to the file:

@()(implicit assetsFinder: AssetsFinder)

@main("Welcome") {
    <section id="top">
        <div class="wrapper">
            <h1>Hey! Welcome to Play</h1>
        </div>
    </section>
}

This Twirl and HTML markup accomplishes the following:

  1. The @ sign tells the template engine to interpret what follows.
  2. In this case, @main("Welcome", assetsFinder) calls the main template, main.scala.html and passes it the page title of "Welcome" (you can ignore the assetsFinder argument for the time being).
  3. The content section contains the Welcome page. The main template will insert this into the body of the page.

Now we are ready to add an action method that will render the new page.

2. Add an action method

To add an action method for the new page:

Open the app/controllers/HomeController.java (or .scala) file. Under the tutorial method and before the closing brace, add the following method:

def welcome(name: String) = Action {
  Ok(views.html.welcome())
}

To have Play call the new action method when the browser requests the welcome page, we need to add a route that maps the page to the method.

3. Define a route

To define a route for the new Welcome page:

Open the conf/routes file and add the following line:

GET     /welcome     controllers.HomeController.welcome

When you add a route to the routes file, Play’s routes compiler will automatically generate a router class that calls that action using an instance of your controller. For more information. By default, the controller instances are created using dependency injection.

You are now ready to test the new page. If you stopped the application for some reason, restart it with the sbt run command.

Enter the URL http://localhost:9000/welcome to view the results of your work.

4. Customize the greeting

As the final part of this tutorial, we’ll modify the welcome page to accept an HTTP request parameter. The steps include a deliberate mistake to demonstrate how Play provides useful feedback.

To customize the Welcome greeting, follow the instructions below.

In the app/controllers/HomeController.scala file, modify the welcome action method to accept a name parameter using the following code:

def welcome(name: String) = Action {
  Ok(views.html.welcome(name))
}

In the conf/routes file, add a (name: String) parameter at the end of the welcome:

GET  /welcome        controllers.HomeController.welcome(name: String)

In Twirl templates, all variables and their types must be declared. In the app/views/welcome.scala.html file:

  1. Insert a new line at the top of the file.
  2. On that line, add an @ directive that declares the name parameter and its type: @(name: String)
  3. To use the variable on the page, change the text in the <h2> heading from Welcome! to <h2>Welcome @name!</h2>.

The end result will be:

@(name: String)(implicit assetsFinder: AssetsFinder)
@main("Welcome") {
    <section id="top">
        <div class="wrapper">
            <h1>Welcome, @name</h1>
        </div>
    </section>
}

In the browser, enter the following URL and pass in any name as a query parameter to the welcome method: http://localhost:9000/welcome?name=MyName. Play responds with a helpful compilation error that lets you know that the render method in the return value requires a typed parameter:

To fix the compilation error, modify the welcome action method in HomeController so that the it includes the name parameter when rendering the view:

public Result welcome(String name) {
   return ok(views.html.welcome.render(name, assetsFinder));
}

Save the file and refresh the browser.

Conclusion

In this blog we have discussed about play framework and introduce with basic example of welcome page step by step implementation.

Stay tune for more blogs on play framework!!

Written by 

Meenakshi Goyal is a Software Consultant and started her career in an environment and organization where her skills are challenged each day, resulting in ample learning and growth opportunities. Proficient in Scala, Akka, Akka HTTP , JAVA. Passionate about implementing and launching new projects. Ability to translate business requirements into technical solutions. Her hobbies are traveling and dancing.

Discover more from Knoldus Blogs

Subscribe now to keep reading and get access to the full archive.

Continue reading