This tutorial shows a collection of apps that use Spring Data REST and its powerful backend functionality, combined with React’s sophisticated features to build an easy-to-understand UI.

• Spring Data REST provides a fast way to build hypermedia-powered repositories.
• React is Facebook’s solution to efficient, fast, and easy-to-use views in JavaScript.

Part 1 — Basic Features

Welcome, Spring community.

This section shows how to get a bare-bones Spring Data REST application up and running quickly. Then it shows how to build a simple UI on top of it by using Facebook’s React.js toolset.

Part 2 - Hypermedia Controls

In the previous section, you found out how to create a backend payroll service to store employee data by using Spring Data REST. A key feature it lacked was using the hypermedia controls and navigation by links. Instead, it hard-coded the path to find data.

Feel free to grab the code from this repository and follow along. This section is based on the previous section’s application, with extra things added.

Part 3 - Conditional Operations

In the previous section, you found out how to turn on Spring Data REST’s hypermedia controls, have the UI navigate by paging, and dynamically resize based on changing the page size. You added the ability to create and delete employees and have the pages adjust. But no solution is complete without taking into consideration updates made by other users on the same bit of data you are currently editing.

Feel free to grab the code from this repository and follow along. This section is based on the previous section but with extra features added.

Part 4 - Events

In the previous section, you introduced conditional updates to avoid collisions with other users when editing the same data. You also learned how to version data on the backend with optimistic locking. You got a notification if someone edited the same record so you could refresh the page and get the update.

That is good. But do you know what is even better? Having the UI dynamically respond when other people update the resources.

In this section, you will learn how to use Spring Data REST’s built in event system to detect changes in the backend and publish updates to ALL users through Spring’s WebSocket support. Then you will be able to dynamically adjust clients as the data updates.

Feel free to grab the code from this repository and follow along. This section is based on the previous section’s application, with extra things added.

Part 5 - Securing the UI and the API

In the previous section, you made the app dynamically response to updates from other users with Spring Data REST’s built-in event handlers and the Spring Framework’s WebSocket support. However, no application is complete without securing the whole thing so that only proper users have access to the UI and the resources behind it.

Feel free to grab the code from this repository and follow along. This section is based on the previous section’s app with extra things added.

Review

In this section, you:

• Defined the model of manager and linked it to an employee through a 1-to-many relationship.

• Created a repository for managers and told Spring Data REST to not export.

• Wrote a set of access rules for the employee repository and also write a security policy.

• Wrote another Spring Data REST event handler to trap creation events before they happen so that the current user could be assigned as the employee’s manager.

• Updated the UI to show an employee’s manager and also display error pop-ups when unauthorized actions are taken.