Get up and running with the Spring Boot and React stack – build an app from start to finish, test the frontend and backend, and deploy. Now with TypeScript code! Purchase of the print or Kindle book includes a free PDF eBook Key Features Use Spring Boot 3 to create powerful, complex, and secure backends for your applications Leverage React to build slick, high-performance frontends Get introduced to TypeScript, Vite, and React Query for React development Book Description If you’re an existing Java developer who wants to go full stack or pick up another frontend framework, this book is your concise introduction to React. In this three-part build-along, you’ll create a robust Spring Boot backend, a React frontend, and then deploy them together. This new edition is updated to Spring Boot 3 and includes expanded content on security and testing. For the first time ever, it also covers React development with the in-demand TypeScript. You’ll explore the elements that go into creating a REST API and testing, securing, and deploying your applications. You’ll learn about custom Hooks, third-party components, and MUI. By the end of this book, you'll be able to build a full stack application using the latest tools and modern best practices. What you will learn Make fast and RESTful web services powered by Spring Data REST Create and manage databases using ORM, JPA, Hibernate, and more Explore the use of unit tests and JWTs with Spring Security Employ React Hooks, props, states, and more to create your frontend Harness the Material UI component library to customize your frontend Use the fetch API, Axios, and React Query for networking Add CRUD functionality to your apps Deploy your apps using AWS and Docker Who this book is for This book is for Java developers who have basic familiarity with Spring Boot but don’t know where to start when it comes to building full stack applications. Basic knowledge of JavaScript and HTML will help you to follow along. You'll also find this book useful if you're a frontend developer with knowledge of JavaScript basics and looking to learn full stack development, or a full stack developer experienced in other technology stacks looking to learn a new one. Table of Contents Setting Up the Environment and Tools – Backend Understanding Dependency Injection Using JPA to Create and Access a Database Creating a RESTful Web Service with Spring Boot Securing Your Backend Testing Your Backend Setting Up the Environment and Tools – Frontend Getting Started with React Introduction to TypeScript Consuming the REST API with React Useful Third-Party Components for React Setting up the Frontend for Our Spring Boot RESTful Web Service Adding CRUD Functionalities Styling the Frontend with MUI Testing Your Frontend Securing Your Application Deploying Your Application Cover Copyright Contributors Tabel of Contents Preface Part 1: Backend Programming with Spring Boot Chapter 1: Setting Up the Environment and Tools – Backend Technical requirements Installing Eclipse Understanding Gradle 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 dependency injection Using dependency injection 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 with Spring Boot Using Spring Data REST Documenting a RESTful API Summary Questions Further reading Chapter 5: Securing Your Backend Technical requirements Understanding Spring Security Securing your backend with a JSON Web Token Securing the login Securing the other requests Handling exceptions Adding a CORS filter Role-based security Using OAuth2 with Spring Boot Summary Questions Further reading Chapter 6: Testing Your Backend Technical requirements Testing in Spring Boot Creating test cases Testing with Gradle Test-driven development Summary Questions Further reading Part II: Frontend Programming with React Chapter 7: Setting Up the Environment and Tools – Frontend Technical requirements Installing Node.js Installing Visual Studio Code VS Code extensions Creating and running a React app Modifying a React app Debugging a React app Summary Questions Further reading Chapter 8: Getting Started with React Technical requirements Creating React components Examining our first React app Useful ES6 features Constants and variables Arrow functions Template literals Object destructuring Classes and inheritance JSX and styling Props and state Props State Stateless components Conditional rendering React hooks useState Batching useEffect useRef Custom hooks The Context API Handling lists with React Handling events with React Handling forms with React Summary Questions Further reading Chapter 9: Introduction to TypeScript Technical requirements Understanding TypeScript Common types Functions Using TypeScript features with React State and props Events Creating a React app with TypeScript Vite and TypeScript Summary Questions Further reading Chapter 10: Consuming the REST API with React Technical requirements Promises async and await Using the fetch API Using the Axios library Practical examples OpenWeather API GitHub API Handling race conditions Using the React Query library Summary Questions Further reading Chapter 11: Useful Third-Party Components for React Technical requirements Installing third-party React components Working with AG Grid Using the Material UI component library Managing routing with React Router Summary Questions Further reading Part III: Full Stack Development Chapter 12: 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 13: Adding CRUD Functionalities Technical requirements Creating the list page Fetching data from the backend Using environment variables Adding paging, filtering, and sorting Adding the delete functionality Displaying a toast message Adding a confirmation dialog window Adding the add functionality Adding the edit functionality Exporting the data to CSV Summary Questions Further reading Chapter 14: Styling the Frontend with MUI Technical requirements Using the MUI Button component Using the MUI Icon and IconButton components Using the MUI TextField component Summary Questions Further reading Chapter 15: Testing React Apps Technical requirements Using Jest Using the React Testing Library Using Vitest Installing and configuring Running our first test Testing our Carlist component Firing events in tests End-to-end testing Summary Questions Further reading Chapter 16: Securing Your Application Technical requirements Securing the backend Securing the frontend Creating a login component Implementing REST API calls Refactoring duplicate code Displaying an error message Logging out Summary Questions Further reading Chapter 17: Deploying Your Application Technical requirements Deploying the backend with AWS Deploying our MariaDB database Deploying our Spring Boot application Deploying the frontend with Netlify Using Docker containers Summary Questions Further reading PacktPage Other Books You May Enjoy Index Get up and running with the Spring Boot and React stack – build an app from start to finish, test the frontend and backend, and deploy. Now with TypeScript code! Purchase of the print or Kindle book includes a free PDF eBook Key Features* Use Spring Boot 3 to create powerful, complex, and secure backends for your applications * Leverage React to build slick, high-performance frontends * Get introduced to TypeScript, Vite, and React Query for React development Book DescriptionIf you’re an existing Java developer who wants to go full stack or pick up another frontend framework, this book is your concise introduction to React. In this three-part build-along, you’ll create a robust Spring Boot backend, a React frontend, and then deploy them together. This new edition is updated to Spring Boot 3 and includes expanded content on security and testing. For the first time ever, it also covers React development with the in-demand TypeScript. You’ll explore the elements that go into creating a REST API and testing, securing, and deploying your applications. You’ll learn about custom Hooks, third-party components, and MUI. By the end of this book, you'll be able to build a full stack application using the latest tools and modern best practices. What you will learn* Make fast and RESTful web services powered by Spring Data REST * Create and manage databases using ORM, JPA, Hibernate, and more * Explore the use of unit tests and JWTs with Spring Security * Employ React Hooks, props, states, and more to create your frontend * Harness the Material UI component library to customize your frontend * Use the fetch API, Axios, and React Query for networking * Add CRUD functionality to your apps Deploy your apps using AWS and Docker Who this book is forThis book is for Java developers who have basic familiarity with Spring Boot but don’t know where to start when it comes to building full stack applications. Basic knowledge of JavaScript and HTML will help you to follow along. You'll also find this book useful if you're a frontend developer with knowledge of JavaScript basics and looking to learn full stack development, or a full stack developer experienced in other technology stacks looking to learn a new one. Table of Contents1. Setting Up the Environment and Tools – Backend 2. Understanding Dependency Injection 3. Using JPA to Create and Access a Database 4. Creating a RESTful Web Service with Spring Boot 5. Securing Your Backend 6. Testing Your Backend 7. Setting Up the Environment and Tools – Frontend 8. Getting Started with React 9. Introduction to TypeScript 10. Consuming the REST API with React 11. Useful Third-Party Components for React 12. Setting up the Frontend for Our Spring Boot RESTful Web Service 13. Adding CRUD Functionalities 14. Styling the Frontend with MUI 15. Testing Your Frontend 16. Securing Your Application 17. Deploying Your Application