Full Stack Development with Spring Boot and React E-Book

Juha Hinkula

• Herausgeber: Packt Publishing
• Kategorie: Fachliteratur
• Sprache: Englisch

Seitenzahl: 265

Veröffentlichungsjahr: 2022

Beschreibung

Getting started with full stack development can be daunting. Even developers who are familiar with the best tools, such as Spring Boot and React, can struggle to nail the basics, let alone master the more advanced elements. If you’re one of these developers, this comprehensive guide covers everything you need!
This updated edition of the Full Stack Development with Spring Boot 2 and React book will take you from novice to proficient in this expansive domain. Taking a practical approach, this book will first walk you through the latest Spring Boot features for creating a robust backend, covering everything from setting up the environment and dependency injection to security and testing.
Once this has been covered, you’ll advance to React frontend programming. If you’ve ever wondered about custom Hooks, third-party components, and MUI, this book will demystify all that and much more. You’ll explore everything that goes into developing, testing, securing, and deploying your applications using all the latest tools from Spring Boot, React, and other cutting-edge technologies.
By the end of this book, you'll not only have learned the theory of building modern full stack applications but also have developed valuable skills that add value in any setting.

Leseprobe

Full Stack Development with Spring Boot and React

Third Edition

Build modern and scalable web applications using the power of Java and React

Juha Hinkula

BIRMINGHAM—MUMBAI

Full Stack Development with Spring Boot and React

Third Edition

Copyright © 2022 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing or its dealers and distributors, will be held liable for any damages caused or alleged to have been caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

Group Product Manager: Pavan Ramchandani

Publishing Product Manager: Bhavya Rao

Senior Editor: Hayden Edwards

Content Development Editor: Abhishek Jadhav

Technical Editor: Simran Udasi

Copy Editor: Safis Editing

Project Coordinator: Rashika Ba

Proofreader: Safis Editing

Indexer: Hemangini Bari

Production Designer: Shyam Sundar Korumili

Marketing Coordinator: Anamika Singh

First published: June 2018

Second edition: May 2019

Third edition: May 2022

Production reference: 3230822

Published by Packt Publishing Ltd.

Livery Place

35 Livery Street

Birmingham

B3 2PB, UK.

ISBN 978-1-80181-678-6

www.packt.com

To my wife, Pirre, and daughter, Anni, for their support and the time that I was able to spend on this project. To all my motivated students, for inspiring me to continue the lifelong journey of learning.

– Juha Hinkula

Contributors

About the author

Juha Hinkula is a software development lecturer at Haaga-Helia University of Applied Sciences in Finland. He received an MSc degree in computer science from the University of Helsinki. He has over 18 years of industry experience in software development. Over the past few years, he has focused on modern full stack development. He is also a passionate mobile developer with Android-native technology and React Native.

About the reviewers

Kaidong Shen is a graduate student of information systems at Northeastern University. He used to be engaged in backend development in JD Retail Group and participated in building a backend service for an IoT platform.

Kolawole Mangabo is an expert full stack engineer who has designed, developed, and re-engineered products in foodtech and fintech with test-driven development and software quality assurance concepts. His other areas of expertise include Python, JavaScript, TypeScript, Django, Nodejs, React, AWS, PostgreSQL, Sentry, Docker, and CI/CD. He's currently a software engineer at Quatro and builds fintech products at Transfa.

Table of Contents

Preface

Part 1: Backend Programming with Spring Boot

Chapter 1: Setting Up the Environment and Tools – Backend

Technical requirements

Installing Eclipse

Understanding Maven

Using Spring Initializr

Creating a project

Running the project

Spring Boot development tools

Logs and problem solving

Installing MariaDB

Summary

Questions

Further reading

Chapter 2: Understanding Dependency Injection

Technical requirements

Introducing DI

Using DI in Spring Boot

Summary

Questions

Further reading

Chapter 3: Using JPA to Create and Access a Database

Technical requirements

Basics of ORM, JPA, and Hibernate

Creating the entity classes

Creating CRUD repositories

Adding relationships between tables

Setting up a MariaDB database

Summary

Questions

Further reading

Chapter 4: Creating a RESTful Web Service with Spring Boot

Technical requirements

Basics of REST

Creating a RESTful web service

Using Spring Data REST

Summary

Questions

Further reading

Chapter 5: Securing and Testing Your Backend

Technical requirements

Understanding Spring Security

Securing your backend using a JWT

Testing in Spring Boot

Creating unit tests

Summary

Questions

Further reading

Part 2: Frontend Programming with React

Chapter 6: Setting Up the Environment and Tools – Frontend

Technical requirements

Installing Node.js

Installing VS Code

VS Code extension

Creating and running a React app

Modifying a React app

Summary

Questions

Further reading

Chapter 7: Getting Started with React

Technical requirements

How to create React components

Useful ES6 features

Constants and variables

Arrow functions

Template literals

Classes and inheritance

JSX and styling

Props and state

Props

State

Stateless components

Conditional rendering

React hooks

useState

useEffect

useRef

Custom hooks

The Context API

Handling lists with React

Handling events with React

Handling forms with React

Summary

Questions

Further reading

Chapter 8: Consuming the REST API with React

Technical requirements

Using promises

Using the fetch API

Using the axios library

Working on practical examples

OpenWeatherMap API

Summary

Questions

Further reading

Chapter 9: Useful Third-Party Components for React

Technical requirements

Using third-party React components

Working with AG Grid

Using the MUI component library

Managing routing in React

Summary

Questions

Further reading

Part 3: Full Stack Development

Chapter 10: Setting up the Frontend for Our Spring Boot RESTful Web Service

Technical requirements

Mocking up the UI

Preparing the Spring Boot backend

Creating the React project for the frontend

Summary

Questions

Further reading

Chapter 11: Adding CRUD Functionalities

Technical requirements

Creating the list page

The delete functionality

The add functionality

The edit functionality

Other functionalities

Summary

Questions

Further reading

Chapter 12: Styling the Frontend with React MUI

Technical requirements

Using the Button component

Using icon components

Using the TextField components

Summary

Questions

Further reading

Chapter 13: Testing Your Frontend

Technical requirements

Using Jest

Firing events in tests

Understanding snapshot testing

Summary

Questions

Further reading

Chapter 14: Securing Your Application

Technical requirements

Securing the backend

Securing the frontend

Summary

Questions

Further reading

Chapter 15: Deploying Your Application

Technical requirements

Deploying the backend

Deploying the frontend

Using Docker containers

Summary

Questions

Further reading

Chapter 16: Best Practices

What to learn next

HTML

CSS

HTTP

JavaScript

A backend programming language

Some frontend libraries and frameworks

Databases

Version control

Useful tools

Security

Best practices

Coding conventions

Choosing the proper tools

Choosing the proper technologies

Minimizing the amount of coding

Summary

Questions

Further reading

Assessments

Chapter 1

Chapter 2

Chapter 3

Chapter 4

Chapter 5

Chapter 6

Chapter 7

Chapter 8

Chapter 9

Chapter 10

Chapter 11

Chapter 12

Chapter 13

Chapter 14

Chapter 15

Chapter 16

Why subscribe?

Other Books You May Enjoy

Preface

Getting started with full stack development can be daunting. Even developers who are familiar with the best tools, such as Spring Boot and React, can struggle to nail the basics, let alone master the more advanced elements. If you're one of these developers, this comprehensive guide covers everything you need!

This updated edition of the Full Stack Development with Spring Boot and React book will take you from novice to proficient in this expansive domain. Taking a practical approach, this book will first walk you through the latest Spring Boot features for creating a robust backend, covering everything from setting up the environment and dependency injection to security and testing.

Once this has been covered, you'll advance to React frontend programming. If you've ever wondered about custom Hooks, third-party components, and MUI, this book will demystify all that and much more. You'll explore everything that goes into developing, testing, securing, and deploying your applications using all the latest tools from Spring Boot, React, and other cutting-edge technologies.

By the end of this book, you'll not only have learned the theory of building modern full stack applications but also have developed valuable skills that add value in any setting.

Who this book is for

This book is for Java developers who are familiar with Spring Boot but don't know where to start when it comes to building full stack applications. You'll also find this book useful if you're a frontend developer with knowledge of JavaScript basics, looking to learn full stack development, or a full stack developer experienced in other technology stacks, looking to learn a new one.

What this book covers

Chapter 1, Setting Up the Environment and Tools – Backend, explains how to install the software needed for backend development and how to create your first Spring Boot application.

Chapter 2, Understanding Dependency Injection, explains the basics of dependency injection.

Chapter 3, Using JPA to Create and Access a Database, introduces JPA and explains how to create and access databases with Spring Boot.

Chapter 4, Creating a RESTful Web Service with Spring Boot, explains how to create RESTful web services using Spring Data REST.

Chapter 5, Securing and Testing Your Backend, explains how to secure your backend using Spring Security and JWT.

Chapter 6, Setting Up the Environment and Tools – Frontend, explains how to install the software needed for frontend development.

Chapter 7, Getting Started with React, introduces the basics of the React library.

Chapter 8, Consuming the REST API with React, shows how to use REST APIs with React using the Fetch API.

Chapter 9, Useful Third-Party Components for React, demonstrates some useful components that we'll use in our frontend development.

Chapter 10, Setting up the Frontend for Our Spring Boot RESTful Web Service, explains how to set up the React app and Spring Boot backend for frontend development.

Chapter 11, Adding CRUD Functionalities, shows how to implement CRUD functionalities to the React frontend.

Chapter 12, Styling the Frontend with React MUI, shows how to polish the user interface using the React MUI component library.

Chapter 13, Testing Your Frontend, explains the basics of React frontend testing.

Chapter 14, Securing Your Application, explains how to secure the frontend using JWT.

Chapter 15, Deploying Your Application, demonstrates how to deploy an application to Heroku and how to use Docker containers.

Chapter 16, Best Practices, explains the basic technologies that are needed to become a full stack developer and covers some basic best practices for software development.

To get the most out of this book

You will need Spring Boot version 2.x in this book. There are some major changes in the upcoming Spring Boot version 3 that are mentioned in the book. All code examples are tested using Spring Boot 2.6 and React 18 on Windows. When installing any React libraries, you should check the latest installation command from their documentation and see whether there are any major changes related to the version used in this book.

If you are using the digital version of this book, we advise you to type the code yourself or access the code from the book's GitHub repository (a link is available in the next section). Doing so will help you avoid any potential errors related to the copying and pasting of code.

Download the example code files

You can download the example code files for this book from GitHub at https://github.com/PacktPublishing/Full-Stack-Development-with-Spring-Boot-and-React. If there's an update to the code, it will be updated in the GitHub repository.

We also have other code bundles from our rich catalog of books and videos available at https://github.com/PacktPublishing/. Check them out!

Code in Action

The Code in Action videos for this book can be viewed at https://bit.ly/3t3Qe4r.

Download the color images

We also provide a PDF file that has color images of the screenshots and diagrams used in this book. You can download it here: https://static.packt-cdn.com/downloads/9781801816786_ColorImages.pdf.

Conventions used

There are a number of text conventions used throughout this book.

Code in text: Indicates code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles. Here is an example: "Import Button to the AddCar.js file."

A block of code is set as follows:

<dependency>

     <groupId>org.springframework.boot</groupId>

     <artifactId>spring-boot-starter-web</artifactId>

</dependency>

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

public class Car {

    @Id

    @GeneratedValue(strategy=GenerationType.AUTO)

    private long id;

    private String brand, model, color, registerNumber;

    private int year, price;

}

Any command-line input or output is written as follows:

npm install component_name

Bold: Indicates a new term, an important word, or words that you see onscreen. For instance, words in menus or dialog boxes appear in bold. Here is an example: "You can select the Run menu and press Run as | Java Application."

Tips or Important Notes

Appear like this.

Get in touch

Feedback from our readers is always welcome.

General feedback: If you have questions about any aspect of this book, email us at [email protected] and mention the book title in the subject of your message.

Errata: Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you have found a mistake in this book, we would be grateful if you would report this to us. Please visit www.packtpub.com/support/errata and fill in the form.

Piracy: If you come across any illegal copies of our works in any form on the internet, we would be grateful if you would provide us with the location address or website name. Please contact us at [email protected] with a link to the material.

If you are interested in becoming an author: If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, please visit authors.packtpub.com.

Share Your Thoughts

Once you've read Full Stack Development with Spring Boot and React, we'd love to hear your thoughts! Please select https://www.amazon.in/review/create-review/error?asin=1801816786 for this book and share your feedback.

Your review is important to us and the tech community and will help us make sure we're delivering excellent quality content.

Part 1: Backend Programming with Spring Boot

Here, you will be familiarized with the basics of Spring Boot. This part provides the knowledge required to use databases and create RESTful web services.

We will cover the following chapters in this section:

Chapter 1, Setting Up the Environment and Tools – BackendChapter 2, Understanding Dependency InjectionChapter 3, Using JPA to Create and Access a DatabaseChapter 4, Creating a RESTful Web Service with Spring BootChapter 5, Securing and Testing Your Backend