Search code examples
javareactjsspring-bootthymeleafserver-side-rendering

Server Side Rendering React Using Spring Boot


I was looking over the following tutorial using Spring Boot and React. https://spring.io/guides/tutorials/react-and-spring-data-rest/

Would the React be server-side rendered here, since it is being rendered into the Thymeleaf template? For context I have placed the Thymeleaf template and React file code from the tutorial below.

src/main/resources/templates/index.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">
    <meta charset="UTF-8"/>
    <title>ReactJS + Spring Data REST</title>
    <link rel="stylesheet" href="/main.css" />
</head>

<body>

    <div id="react"></div>

    <script src="built/bundle.js"></script>

</body>
</html>

src/main/js/app.js - rendering code

ReactDOM.render(
    <App />,
    document.getElementById('react')
)

Solution

  • In the given example React is not rendered server-side. The Thymeleaf HTML is outputted as is. Data is fetched client-side by calling services setup in the Spring Boot backend as shown in the tutorial.