Practice WOD: DigitsModel

Just in case I haven’t made myself clear already, prior to doing this WOD, you should have reviewed all the material in the Resources section of this module and watched the screencasts. In particular, you will want to review Chapter 8 of Play with Java on producing output with view templates.

The purpose of this WOD is to introduce you to creating dynamic output and simple model classes. To do that, we will create a data structure containing all of the contacts added by the form, and then print out the contents of that data structure on the home page. This data structure is a kind of “model” (from the model-view-controller design pattern).

To illustrate, here is what the home page should look like when the application is first retrieved in a browser. Notice that the contacts list is empty:

Now go to the New Contact page, type in a contact, and press Add:

This should add the contact to an in-memory repository. Clicking on the Home button to return to the home page should display that contact:

To get ready for this WOD, create a new branch off of a successfully completed branch from the DigitsFormValidation WOD. Name this new branch “Attempt-N-N-N-1″, where N-N-N is the branch you’re going to base this WOD on. For example, if the branch “Attempt-2-2-2″ contains the DigitsFormValidation code base that you want to build this WOD on, then create a branch called “Attempt-2-2-2-1″ to indicate that this is the first attempt (1) to extend the code from “Attempt-2-2-2″ to support models and dynamic output.

Instructions

Provide dynamic output and a model for your Digits form data.

  1. Start your timer.
  2. Enable checkstyle.
  3. Implement a model for Contact data. Create a new package called “models” and a class called Contact, with private firstName, lastName,and telephone fields and public getters and setters.
  4. Implement a simple in-memory repository for Contacts. Create a class called ContactDB in the models package. It takes a ContactDataForm, creates a Contact instance from it, and adds it to an internal data structure. It also has a getContacts() method that returns all of the Contacts added so far.
  5. Update the Index.scala.html file to dynamically display all Contacts. Define List[Contact] as a parameter, and use the @for control structure to loop through them.
  6. Update Application.java to interact with the model. Upon receipt of a valid Contact from the user, add it to the ContactDB. When displaying the home page, pass the current list of Contacts.
  7. When finished, test your code by adding some contacts.
  8. To end the WOD, commit the working code to your branch.

When finished, stop your timer, and record how many minutes it took you to complete the WOD.

Rx: <16 min Av: 16-22 min Sd: 22-28 min DNF: 28+ min

Demonstration

Once you’ve finished doing the WOD a single time, watch me do it:

Standard WOD Caveats

You’ll learn significantly less from watching me solve the WOD if you haven’t attempted the WOD yourself first.

While it’s an achievement to finish the WOD no matter how long it takes, you might experience “diminishing returns” if you work longer than the DNF time. Thus, it might be strategic to stop working at the DNF time and watch my solution.

After watching my solution, I recommend that you repeat the WOD if you have not achieved at least Av performance. If so, be sure to:

Feel free to keep trying until you make Rx if that’s of interest to you.

How to repeat the WOD

To repeat the WOD, simply switch your local workspace branch to master, then create a new branch off of master called “Attempt-2″ (or whatever attempt you are on). Then, in the play console, type ; clean ; compile ; run to clean the target directory, then recompile the system, then run the web application.