[New] Full-Stack Java Development With Spring Boot & React

Build FULL-STACK Web Apps using Java, Spring Boot, Spring Data JPA, Spring Security, JWT, JavaScript, React JS & MySQL

What you'll learn

Learn to develop a FULL-STACK Web Application with React and Spring Boot

Build Employee Management System FULL-STACK Web Application with React and Spring Boot

Build Todo Management FULL-STACK Web Application with React and Spring Boot

Learn Spring Boot Fundamentals

Learn React JS Fundamentals

Building RESTful APIs with Spring Boot

Consuming RESTful APIs in React JS

Data Persistence with Spring Data JPA and Hibernate

Secure REST APIs using Spring Security

Build User Registration and Login Module

Secure REST APIs using JWT (JSON Web Token)

Using JWT (JSON Web Token) in React App

Style Web Pages using the Bootstrap CSS framework

Use Modern and Popular tools to build full-stack web applications such as IntelliJ IDEA, VS Code, Maven, Postman, NPM, etc.

Requirements

Java 17+

Familiar with IntelliJ IDEA and VS Code

Familiar with HTML, CSS and JavaScript

No Spring Boot REST API experience is needed, You will learn building Spring Boot REST APIs from the scratch

No React JS experience is needed, I will teach React JS from the scratch

Description

In this hands-on project-oriented course, you will dive into the world of full-stack web app development using the powerful combination of Spring Boot and React JS.In this course, you will build two full-stack web applications (Employee Management System and Todo Management App) using Spring Boot, Spring Security, Spring Data JPA, JWT, React JS, and MySQL database.In this course, we will use the latest version of Spring Boot (3+), React JS (18+), and MySQL database (8+). We will use modern and popular tools to build full-stack web applications such as IntelliJ IDEA, VS Code, Maven, Postman, NPM, etc.What is React JS?React JS is a JavaScript library used to build user interfaces (UI) on the front end.React is not a framework (unlike Angular, which is more opinionated).React is an open-source project created by Facebook.What is Spring Boot?Spring boot to develop REST web services and microservices.Spring Boot has taken the Spring framework to the next level. It has drastically reduced the configuration and setup time required for spring projects.You can set up a project with almost zero configuration and start building the things that actually matter to your application.Course Topics:1. React JS Fundamentals2. Spring Boot Fundamentals3. Project 1: Employee Management SystemBuild Employee Management Module - Backend Implementation using Spring BootBuild Employee Management Module - Frontend Implementation using React JSBuild Department Management Module - Backend Implementation using Spring BootBuild Department Management Module - Frontend Implementation using React JSStyle Web Pages using the Bootstrap CSS framework4. Project 2: Todo Management AppTodo Management Module - Backend Implementation using Spring BootTodo Management Module - Frontend Implementation using React JSSecure REST APIs using Spring SecurityBuild Register and Login REST APIsImplement Register and Login Features in React AppSecure REST APIs using JWT (JSON Web Token)Using JWT (JSON Web Token) in React AppStyle Web Pages using the Bootstrap CSS frameworkTools and technologies used in this course:Server-side:Java 17+Spring Boot 3+Spring Data JPA (Hibernate)MavenIntelliJ IDEAMySQL databasePostman Client-side:React JS 18+React HooksReact RouterAxiosBootstrap CSS frameworkVisual Studio Code IDEVS Code extensionsNode JSNPM

Overview

Section 1: Introduction

Lecture 1 Course Introduction

Lecture 2 Prerequisites for this Course

Section 2: Spring Boot Fundamentals

Lecture 3 Section Overview

Lecture 4 What is Spring Boot?

Lecture 5 Spring Boot Features

Lecture 6 Create Spring Boot Project using Spring Initializr and Import in IntelliJ IDE

Lecture 7 Create Simple Spring Boot REST API

Lecture 8 Spring Boot REST API returns Java Bean

Lecture 9 Create Spring Boot REST API That Returns List

Lecture 10 Spring Boot REST API with Path Variable - @PathVariable

Lecture 11 Spring Boot REST API with Request Param - @RequestParam

Lecture 12 Spring Boot POST REST API - @PostMapping and @RequestBody

Lecture 13 Spring Boot PUT REST API - @PutMapping and @RequestBody

Lecture 14 Spring Boot DELETE REST API - @DeleteMapping

Lecture 15 Using Spring ResponseEntity to Manipulate the HTTP Response

Lecture 16 Define Base URL for REST API’s in Spring MVC Controller - @RequestMapping

Lecture 17 Download Source Code of this Section

Section 3: React JS Fundamentals

Lecture 18 Section Overview

Lecture 19 Create and Set up React App

Lecture 20 Understanding React App Project Structure

Lecture 21 React Components Overview

Lecture 22 Functional Components

Lecture 23 Class Components

Lecture 24 Importing and Exporting Components

Lecture 25 JSX

Lecture 26 JSX Rules in React

Lecture 27 Props

Lecture 28 Destructuring Props

Lecture 29 State and setState

Lecture 30 useState Hook

Lecture 31 Event Handling

Lecture 32 Conditional Rendering

Section 4: Employee Management System Full-Stack Project

Lecture 33 Select Technology Stack and Understanding Project Requirements

Lecture 34 Demo - What Are We Going to Build?

Lecture 35 Spring Boot React Full-Stack Architecture

Section 5: Employee Management Module - Spring Boot Backend

Lecture 36 Section Overview

Lecture 37 Spring Boot Application Three Layer Architecture

Lecture 38 Create and Setup Spring Boot Project in IntelliJ IDEA

Lecture 39 Configure MySQL Database in Spring Boot Application

Lecture 40 Create Employee JPA Entity

Lecture 41 Create EmployeeRepository

Lecture 42 Create EmployeeDto and EmployeeMapper

Lecture 43 Build Add Employee REST API

Lecture 44 Build Get Employee REST API

Lecture 45 Build Get All Employees REST API

Lecture 46 Build Update Employee REST API

Lecture 47 Build Delete Employee REST API

Lecture 48 Source Code of this Section

Section 6: Employee Management Module - React JS Backend

Lecture 49 Section Overview

Lecture 50 Create and Set up React App

Lecture 51 Understanding React App Project Structure

Lecture 52 Adding Bootstrap in React Using NPM

Lecture 53 Create React ListEmployeeComponent and Display Data

Lecture 54 Connect React App with Get All Employees REST API

Lecture 55 Adding Header and Footer to React App

Lecture 56 Configure Routing in a React App

Lecture 57 Create React EmployeeComponent and Configure Route

Lecture 58 Add Employee Form Handling

Lecture 59 Connect React App to Add Employee REST API

Lecture 60 Add Employee Form Validation

Lecture 61 Adding Update Button, Title and Route

Lecture 62 Connect React App to Get Employee REST API

Lecture 63 Connect React App to Update Employee REST API

Lecture 64 Implement Delete Employee Feature in React App

Lecture 65 Source Code of this Section

Section 7: Department Management Module - Spring Boot Backend

Lecture 66 Section Overview

Lecture 67 Create Department Entity and DepartmentRepository

Lecture 68 Create DepartmentDto and DepartmentMapper

Lecture 69 Build Create Department REST API

Lecture 70 Build Get Department REST API

Lecture 71 Build Get All Departments REST API

Lecture 72 Build Update Department REST API

Lecture 73 Build Delete Department REST API

Lecture 74 Source Code of this Section

Section 8: Department Management Module - React JS Frontend

Lecture 75 Section Overview

Lecture 76 Add Navigation Links in Header

Lecture 77 Design List Department Component

Lecture 78 Connect React App with Get All Departments REST API

Lecture 79 Create React DepartmentComponent

Lecture 80 Add Department Form Handling

Lecture 81 Connect React to Add Department REST API

Lecture 82 Adding Update Button, Title and Route

Lecture 83 Connect React App to Get Department REST API

Lecture 84 Connect React App to Update Department REST API

Lecture 85 Implement Delete Department Feature in React App

Lecture 86 Change Add and Update Employee Feature - Many To One Relationship in Spring Boot

Lecture 87 Change Add and Update Employee Feature to use Department - React App

Lecture 88 Source Code of this Section

Section 9: Todo Management Full-Stack Project

Lecture 89 Todo Management Project - Technology Stack and Requirements

Lecture 90 Spring Boot React Full-Stack Architecture for Todo Management Project

Section 10: Todo Management Module - Spring Boot Backend with MySQL Database

Lecture 91 Section Overview

Lecture 92 Create and Setup Spring Boot Project in IntelliJ IDEA

Lecture 93 Configure MySQL Database in Spring Boot Application

Lecture 94 Create Todo JPA Entity

Lecture 95 Create TodoRepository and TodoDto

Lecture 96 Build Add Todo REST API

Lecture 97 Using ModelMapper Library

Lecture 98 Build Get Todo REST API

Lecture 99 Build Get All Todos REST API

Lecture 100 Build Update Todo REST API

Lecture 101 Build Delete Todo REST API

Lecture 102 Build Complete Todo REST API

Lecture 103 Build In Complete Todo API

Lecture 104 Source Code of this Section

Section 11: Todo Management Module - React JS Frontend

Lecture 105 Section Overview

Lecture 106 Create and Setup React App using Vite

Lecture 107 Understanding Folder Structure

Lecture 108 Add Bootstrap to React App using NPM

Lecture 109 Create ListTodoComponent + useState Hook

Lecture 110 Connect React App with Get All Todos REST API

Lecture 111 Adding Header and Footer to React App

Lecture 112 Configure Routing in a React App

Lecture 113 Create React TodoComponent and Configure Route

Lecture 114 Add Todo Form Handling

Lecture 115 Connect React App to Add Todo REST API

Lecture 116 Adding Update Button, Title and Route

Lecture 117 Connect React App to Get Todo REST API

Lecture 118 Connect React App to Update Todo REST API

Lecture 119 Implement Delete Todo Feature in React App

Lecture 120 Implement Complete Todo Feature in React App

Lecture 121 Implement InComplete Todo Feature in React App

Lecture 122 Demo - Test All CRUD Operations

Lecture 123 Source Code of this Section

Section 12: Spring Security Authentication & Role-Based Authorization - Spring Boot Backend

Lecture 124 Section Overview

Lecture 125 Authentication and Authorization

Lecture 126 Adding Spring Security to Spring Boot App

Lecture 127 Spring Boot Auto Configuration for Spring Security

Lecture 128 Customizing the Default User

Lecture 129 Configure and Understand Basic Authentication

Lecture 130 In-Memory Authentication

Lecture 131 Understanding Role-Based Authorization

Lecture 132 Method Level Security

Lecture 133 Database Authentication Overview

Lecture 134 Creating User and Role JPA Entities

Lecture 135 UserRepository and RoleRepository

Lecture 136 How Database Authentication Works in Spring Security

Lecture 137 Creating CustomUserDetailsService Class

Lecture 138 Database Authentication

Lecture 139 Source Code of this Section

Section 13: Registration and Login Module - Spring Boot Backend

Lecture 140 Section Overview

Lecture 141 Build Register REST API

Lecture 142 Exception Handling in Register REST API

Lecture 143 Build Login REST API

Lecture 144 Source Code of this Section

Section 14: Registration and Login Module - React JS Frontend

Lecture 145 Section Overview

Lecture 146 Create RegisterComponent and Configure Route

Lecture 147 User Registration Form Handling

Lecture 148 Connect React App to Register REST API

Lecture 149 Create LoginComponent and Configure Route

Lecture 150 Design Login Form

Lecture 151 Connect React App to Login REST API

Lecture 152 Implement Basic Authentication in React App

Lecture 153 Display the Links as Per User Authentication in the Header

Lecture 154 Logout Feature in React App

Lecture 155 Secure the Routes in React App

Lecture 156 Source Code of this Section

Section 15: Secure REST APIs using JWT - Spring Boot Backend & React JS Frontend

Lecture 157 Section Overview

Lecture 158 JWT Introduction

Lecture 159 Spring Security JWT Overview

Lecture 160 Adding JWT to Spring Boot App

Lecture 161 Creating JwtTokenProvider Utility Class

Lecture 162 Creating JwtAuthenticationFilter

Lecture 163 Configure JWT in Spring Security

Lecture 164 Change Login REST API to Return JWT Token

Lecture 165 Using JWT Token in React App

Lecture 166 Source Code of this Section

This course is for everyone who want to learn how to develop a FULL-STACK Web Application using Spring Boot and React JS