Get Started Building a Website with the Play Framework

Traducciones al Español
Estamos traduciendo nuestros guías y tutoriales al Español. Es posible que usted esté viendo una traducción generada automáticamente. Estamos trabajando con traductores profesionales para verificar las traducciones de nuestro sitio web. Este proyecto es un trabajo en curso.
Create a Linode account to try this guide with a $ credit.
This credit will be applied to any valid services used during your first  days.

Play is a lightweight framework for Java and Scala web applications. Play’s conciseness makes it easy to develop modern and efficient web applications.

This guide helps you learn more about the Play framework and how to get started using it. It walks you through the setup process and shows you how to access some example projects. Then, it provides a brief tutorial for making a Play website of your own.

Before You Begin

  1. If you have not already done so, create a Linode account and Compute Instance. See our Getting Started with Linode and Creating a Compute Instance guides.

  2. Follow our Setting Up and Securing a Compute Instance guide to update your system. You may also wish to set the timezone, configure your hostname, create a limited user account, and harden SSH access.

Note
This guide is written for non-root users. Commands that require elevated privileges are prefixed with sudo. If you’re not familiar with the sudo command, see the Linux Users and Groups guide.

What is the Play Framework?

Play is a web application framework for the Java and Scala programming languages. It focuses on being a concise and lightweight framework that takes advantage of functional programming concepts. Play’s approach to the Model–View–Controller (MVC) architecture makes the process of designing modern and efficient web applications clearer and easier.

Play is built on Scala, but it operates equally well with Java and Scala projects. Which language you choose is up to you. Scala provides a concise language oriented around functional programming concepts, and much of the Play community documentation uses Scala. Java, on the other hand, being the older of the two languages, has more general documentation, and support.

One of the great aspects of Play’s design, however, is that you do not have to decide on one language over the other. Play lets you work with them both easily within the same project. For instance, you can start your project with Scala and use it for the components of your application directly concerned with Play. Then, you can start adding Java components to handle other features of your application.

This guide’s examples primarily use Scala in part because of its great community support. However, in the Build a Website with Play section, you can find an example that shows how Play lets you seamlessly use Java and Scala side by side.

Get Started with the Play Framework

This section shows you how to set up what you need to run Play projects and helps you grab some example projects to start exploring. Lastly, it shows you how to set up a base project of your own.

Prerequisites

Play relies on the sbt build tool, which is also generally considered the de facto standard for managing Scala projects. Following sbt’s recommended installation method, this guide uses SDKMAN to install OpenJDK and sbt.

  1. Install SDKMAN, following the installation prompts.

     curl -s "https://get.sdkman.io" | bash
    
  2. For the changes to take effect, close and reopen your terminal session or run the following command:

     source "$HOME/.sdkman/bin/sdkman-init.sh"
    

    You can now verify the installation using the following command:

     sdk version
    
  3. Install OpenJDK.

     sdk install java $(sdk list java | grep -o "8\.[0-9]*\.[0-9]*\.hs-adpt" | head -1)
    
  4. Install sbt.

     sdk install sbt
    

Play Framework Example Applications

The Lightbend Tech Hub maintains a host of example Play projects for your to get started with. You can find the list of them on Lightbend’s showcase of example Play projects. Alternatively, you can visit the GitHub repository with all of the playframework’s example projects.

In these steps, you can see how to download and run one of these examples — the “Hello, World!” example. Then, you can use the steps to try out other examples on your own.

  1. Install Git. This command works for Debian and Ubuntu distributions. You should be able to use a similar command for your distribution’s package manager.

     sudo apt install git
    
  2. Navigate to the directory where you would like to store the examples — in this example, the current user’s home directory. Then, clone the Git repository with the Play example projects:

     cd ~
     git clone https://github.com/playframework/play-samples.git
    
  3. Change the directory into the example that you want to explore. Here, that is the “Hello, World!” example for Scala.

     cd play-samples/play-scala-hello-world-tutorial
    
  4. Run the project.

     sbt run
    

    Play serves the application on localhost:9000. To visit the application remotely, you can use an SSH tunnel.

    • On Windows, you can use the PuTTY tool to set up your SSH tunnel. Follow the appropriate section of the Using SSH on Windows guide, replacing the example port number there with 9000.

    • On OS X or Linux, use the following command to set up the SSH tunnel. Replace example-user with your username on the application server and 192.0.2.0 with the server’s IP address.

        ssh -L9000:localhost:9000 example-user@192.0.2.0
      
  5. Now you can visit the application in your browser by navigating to localhost:9000.

    Play “Hello, World!” example application

Create an Application

  1. Create a directory for your Play project and then change to that directory.

     mkdir ~/example-play-app
     cd ~/example-play-app
    
    Note
    The example-play-app directory in the example above can have the same name as your application. Here, however, its name has been varied to make this directory, and the one discussed below easier to distinguish.
  2. Generate a base Play project for Scala by following the setup prompts.

     sbt new playframework/play-scala-seed.g8
    

    If you want to create a base Play project for Java, use the following command:

     sbt new playframework/play-java-seed.g8
    
  3. Change into the subdirectory where the project’s main files live. The subdirectory matches the name you gave your project during the setup prompts.

     cd example-app
    

    Unless noted otherwise, all subsequent commands in this guide assume you are still in this project directory.

  4. Run your project. Follow the same steps as in the Play Framework Example Applications section to get it running and to see the application on localhost:9000.

Build a Website with Play

  1. Follow the steps in the Create an Application section above to get the base project started. This example assumes that you are using the Scala base project.

  2. Open the configuration file for your application’s routes (conf/routes), and add the following lines beneath the GET / line:

    File: conf/routes
    1
    2
    3
    4
    
    GET     /home                       controllers.HomeController.home()
    
    GET     /about                      controllers.AboutController.about()
        

    These lines add two new routes, one for the Home page and one for the About page.

  3. Open the app/controllers/HomeController.scala file, and replace its contents with the following:

    File: app/controllers/HomeController.scala
     1
     2
     3
     4
     5
     6
     7
     8
     9
    10
    11
    12
    13
    14
    15
    16
    17
    
    package controllers
    
    import javax.inject._
    import play.api._
    import play.api.mvc._
    
    @Singleton
    class HomeController @Inject()(val controllerComponents: ControllerComponents) extends BaseController {
      def index() = Action { implicit request: Request[AnyContent] =>
        Redirect(routes.HomeController.home())
      }
    
      def home() = Action { implicit request: Request[AnyContent] =>
        Ok(views.html.index())
      }
    }
        

    Controllers like this, and the one created in the next step, handle the initial logic of your application. Any requests to your application tend to get routed into these controllers. Controllers then either render page templates, perform basic logic, or call other components to handle more complicated or reusable logic. This helps to keep your application modular and easily manageable.

    The above controller redirects requests from the base URL (/) to the application’s path for HomeController.home() as defined in the routes file. Then, it renders the index template for any request for /home.

  4. Create an app/controllers/AboutController.java, and give it the following contents:

    File: app/controllers/AboutController.java
     1
     2
     3
     4
     5
     6
     7
     8
     9
    10
    
    package controllers;
    
    import play.mvc.*;
    
    public class AboutController extends Controller {
        public Result about() {
            return ok(views.html.about.render());
        }
    }
        

    You could as easily have implemented this controller in Scala. However, implementing the controller in Java demonstrates how easily Play lets you work with both languages in the same project.

    This controller renders the about template for any request to the /about URL.

  5. Customize your page templates. Open the app/views/index.scala.html template, and give it the contents below. Then, create the app/views/about.scala.html template, and give it the contents shown for it a little further below.

    File: app/views/index.scala.html
    1
    2
    3
    4
    5
    6
    7
    
    @()
    
    @main("Home") {
      <h1>Home</h1>
      <p>This is the homepage for a web application built with the Play framework.</p>
    }
        
    File: app/views/about.scala.html
    1
    2
    3
    4
    5
    6
    7
    
    @()
    
    @main("About") {
      <h1>About</h1>
      <p>This is an example web application built with the Play framework.</p>
    }
        
  6. Both of the above templates frame their contents in the main template. Open up the app/views/main.scala.html template, and give it the contents below:

    File: app/views/main.scala.html
     1
     2
     3
     4
     5
     6
     7
     8
     9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    
    @(title: String)(content: Html)
    
    <!DOCTYPE html>
    <html lang="en">
        <head>
            <title>@title</title>
            <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")">
    
        </head>
        <body>
            <div>
                    <a href="/home">Home</a> | <a href="/about">About</a>
            </div>
            <div>
                    @content
            </div>
          <script src="@routes.Assets.versioned("javascripts/main.js")" type="text/javascript"></script>
        </body>
    </html>
        
  7. Run the application using the steps given in the Check Out the Example Applications section.

    You can visit the application on localhost:9000.

    Play website example

Conclusion

You now have your own Play web application, ready for you to continue building out. To help you along with that, check out the official documentation for the Play framework. The Hello World Tutorial series of articles there can be especially helpful in better understanding how to get started working with Play applications.

More Information

You may wish to consult the following resources for additional information on this topic. While these are provided in the hope that they will be useful, please note that we cannot vouch for the accuracy or timeliness of externally hosted materials.

This page was originally published on


Your Feedback Is Important

Let us know if this guide was helpful to you.


Join the conversation.
Read other comments or post your own below. Comments must be respectful, constructive, and relevant to the topic of the guide. Do not post external links or advertisements. Before posting, consider if your comment would be better addressed by contacting our Support team or asking on our Community Site.
The Disqus commenting system for Linode Docs requires the acceptance of Functional Cookies, which allow us to analyze site usage so we can measure and improve performance. To view and create comments for this article, please update your Cookie Preferences on this website and refresh this web page. Please note: You must have JavaScript enabled in your browser.