Sign In Start Free Trial
Account

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Hands-On Full Stack Development with Spring Boot 2 and React
  • Toc
  • feedback
Hands-On Full Stack Development with Spring Boot 2 and React

Hands-On Full Stack Development with Spring Boot 2 and React

By : Juha Hinkula
3.3 (7)
close
Hands-On Full Stack Development with Spring Boot 2 and React

Hands-On Full Stack Development with Spring Boot 2 and React

3.3 (7)
By: Juha Hinkula

Overview of this book

React Hooks have changed the way React components are coded. They enable you to write components in a more intuitive way without using classes, which makes your code easier to read and maintain. Building on from the previous edition, this book is updated with React Hooks and the latest changes introduced in create-react-app and Spring Boot 2.1. This book starts with a brief introduction to Spring Boot. You’ll understand how to use dependency injection and work with the data access layer of Spring using Hibernate as the ORM tool. You’ll then learn how to build your own RESTful API endpoints for web applications. As you advance, the book introduces you to other Spring components, such as Spring Security to help you secure the backend. Moving on, you’ll explore React and its app development environment and components for building your frontend. Finally, you’ll create a Docker container for your application by implementing the best practices that underpin professional full stack web development. By the end of this book, you’ll be equipped with all the knowledge you need to build modern full stack applications with Spring Boot for the backend and React for the frontend.
Table of Contents (22 chapters)
close
Free Chapter
1
Section 1: Backend Programming with Spring Boot
7
Section 2: Frontend Programming with React
12
Section 3: Full Stack Development

Creating the list page

In the first phase, we will create the list page to show cars with paging, filtering, and sorting features. Run your Spring Boot backend. The cars can be fetched by sending the GET request to the http://localhost:8080/api/cars URL, as shown in Chapter 4, Creating a RESTful Web Service with Spring Boot.

Now, let's inspect the JSON data from the response. The array of cars can be found in the _embedded.cars node of the JSON response data:

Once we know how to fetch cars from the backend, we are ready to implement the list page to show the cars. The following steps describe this in practice:

  1. Open the carfront React app with VS Code (the React app we created in the previous chapter).
  2. When the app has multiple components, it is recommended that you create a folder for them. Create a new folder called components in the src folder. With VS Code, you can...

Unlock full access

Continue reading for free

A Packt free trial gives you instant online access to our library of over 7000 practical eBooks and videos, constantly updated with the latest in tech
bookmark search playlist download font-size

Change the font size

margin-width

Change margin width

day-mode

Change background colour

Close icon Search
Country selected

Close icon Your notes and bookmarks

Delete Bookmark

Modal Close icon
Are you sure you want to delete it?
Cancel
Yes, Delete