Web Development


Java Full Stack Spring Boot and Angular (Inc. JWT + Cloud)

Spring security, Heroku Cloud Deployment via Github, PostgreSQL, Hibernate, Lombok, Angular12, Full Stack Development

4.50 (13 reviews)


9.5 hours


Sep 2021

Last Update
Regular Price

What you will learn

Spring Boot


Full Stack Development with Spring Boot and Angular

Cloud Deployment for Java and NodeJS

Heroku Cloud Deployment

Learn the basics of Angular - Angular Modules, Components, Data Binding and Routing

Role Base Authorization and Authentication

Use Spring Security to configure Basic Authentication and JWT

Learn the magic of Spring Boot - Auto Configuration, Spring Initializr and Starter Projects

RXJS Observables and Observers


In this course, we will create a new project like online-book-shopping.

When I say online-book-shopping application, we can think of it like that we will have a book-list page. Somehow users or customers will see these book-lists and they can buy one of them. Of course, at the end of it, this purchase will be stored and displayed later.

And we will implement this project using Spring Boot, Angular, and PostgreSQL.

In our project, we will implement CRUD operations. These CRUD operations will be for users and books. We will use users for user sign-in, sign-up and authorization operations. And we will use the books for creating, editing, deleting book operations.

These CRUD operations will be requested from Angular. So on the backend, we will create an infrastructure for these CRUD operations and on the frontend, we will serve them with the user interface.

Our project goes on with User and book operations.

Our main operations will be user login, register, book-list, create-book, delete-book etc.

Also, we will go on with the role based application. So we will use different roles like “Admin”, “User”. Then we will provide different authorizations to these users according to the role.

And this all things will be provided with a secure way in both Angular and Spring Boot.

We will have two main components to implement our project.

These are server side and client side.

In Server Side:

Of course here, our main library will be Spring-boot. We will implement the whole infrastructure on the backend with the Spring boot. It will provide easy and fast configuration to us.

We will implement the Model view controller architecture on our project.

Spring-security will be one of the main topics in our application. Also, we will use JWT to provide security.

In Spring Boot, Data will be presented to the client as an API call so Spring Rest Controller will be used to handle it.

We will use PostgreSQL as Database. We can use other databases also but at the end of it we will deploy our codes to Heroku. Postgresql can be used on Heroku for free so we chose that.

We will also use Object Relational Mapping with Java Persistence API and Hibernate.

You know, We can map our database tables to objects with hibernate.

We will use JPA Repository and Crud Repository in Spring Boot.

So these repository templates will handle common database operations like save, update, find, delete.

With Spring Boot, we will also use Lombok library to clear code.

You know that we don't want to implement getter, setter, equals and hash code. So we can escape it using Lombok @Data or @Value annotation.

We will use Gradle To handle all dependencies on server side.

For our all services, we will create cloud deployment with Heroku. Heroku is an amazing free framework. We can deploy our spring-boot projects with some configuration over github easily. So At the end of the course, we will have an application on production and we will have a code on github that is accessible by everyone.

That's all about Server side.

Let's talk about Client Side.

We will create an angular application on the client side and it will provide a cool user-interface. So we will create some pages like home-page, admin dashboard, login page and register-page. Then we will assign the server apis to these pages and we will consume and produce the data from the user-interface easily and user friendly.

On angular, we will also implement the model view controller architecture. We will use the cool features of typescript etc.

At the end of it, we will build it and we will serve it to heroku also. So at the end of the course, we will have a live application on production.

Last but not least, we will implement security and authorization on angular also. We will work with different roles and according to these roles, we will implement unauthorized and not-found pages on the user interface also.

We will see the details of them one by one.


Java Full Stack Spring Boot and Angular (Inc. JWT + Cloud)
Java Full Stack Spring Boot and Angular (Inc. JWT + Cloud)
Java Full Stack Spring Boot and Angular (Inc. JWT + Cloud)
Java Full Stack Spring Boot and Angular (Inc. JWT + Cloud)



Introduction - Architecture of All System

Setting Up Development Environment

Download and Install Java 11

Download and Install Intellij

Download and Install PostgreSQL

Download and Install Git

Download and Install Lombok on Intellij

Download and Install Postman

Overview for Basic Frameworks and Tools

Spring Boot Overview - Annotations, Beans, Configuration

Rest API Overview - Http Methods

SQL Overview - Basic CRUD Operations

Lombok Overview - Getter, Setter, Constructors

Git Overview - Git vs Github

Restful Web Services - Overview

@RequestParam Annotation and How does it work?

@PathVariable Annotation and How does it work?

@RequestBody Annotation and How does it work?

Spring Boot - Backend - Server Side

Source Code for the Backend

Overview - Architecture of Backend Project

Create Project with Spring Initializer

Why Did We Choose Gradle? Isn't Maven most common one?

Create Database for Gateway on PostgreSQL with PgAdmin

Configure Database Properties on Application Properties

Entity Diagram

Implement The User Entity Model Class

Do you want to learn more about ID Generated Strategies? - Optional

Implement The Book Entity Model Class

Implement The Purchase Entity Model Class

Implement the User Repository Class with JPA CRUD Repository

Implement the Book Repository Class with JPA CRUD Repository

Implement the Purchase Repository Class with JPA CRUD Repository + Projections

Implement the User Service Class - Business Layer

Implement the Book Service Class - Business Layer

Implement the Purchase Service Class - Business Layer

Overview for Spring Security - Optional

What is Authentication?

What is Authorization?

How does Spring Security handle Authentication and Authorization?

Security Implementation

Load User by Username - User Details Service

Configure Security - Authentication Manager and HttpSecurity

JWT Implementation

JWT Overview and Install JWT Libraries

JWT Helper Methods - Token Generation, Validation

Implement JWT Authentication Filter

Implement User Log In and User Sign Up

Authenticate User with Authentication Manager - Service

Create Endpoints for User Log In and User Sign Up - Controller

Internal API Implementation

Create Internal Authentication Filter

Create Connection between JWT and Internal Filters

Internal Controller Implementation

Other Endpoints - Rest Controller

Implement Book Controller - Rest Controller

Implement Purchase Controller - Rest Controller

Test Spring Boot Application

Postman Overview

How can we run Spring Boot Application?

Test the Endpoints with Postman

Multiple Spring Profiles - Development, Production

Create Spring Profiles for Development and Production

Cloud Deployment - Heroku

Heroku Overview

Heroku Configuration - Procfile, app.json

Github Commitment

Deploy to Heroku

Test Project with the Heroku URL

Setting Up Development Environment For Client Side

Install NodeJS

Install Angular CLI

Javascript Overview

Angular Overview

Client Side Implementation

Source Code for the Frontend

Overview - Architecture of Frontend Project

Create Angular Project With Angular CLI

Getting Start to Angular Project - How angular works?

Configuration (BootStrap, Jquery, Font-Awesome...)

Create Component/Page Templates

Implement Router Module

Implement Error Pages - Not-Found and Unauthorized Pages

Structured Data - Typescript Models

Implement User Model TypeScript Class

Implement Book Model TypeScript Class

Implement Purchase Model TypeScript Class

Implement PurchaseItem Model TypeScript Class - DTO

Form Module, FormItem, FormGroup - SignIn and SignUp Forms

Authentication Service Implementation - Sign-in, Sign-out, Sign-up

Implement Register Page Component

Implement Register Page Html Part1 - Create Page Template

Template Driven Form vs Reactive Form - Register Page Html Part2

Implement Register Page Html Part3 - FormsModule, FormControl, FormGroup

Complete the Register Page Html Part4

Implement Login Page

Navigation Bar With Bootstrap - App Component


Implement Authentication Guard - Guard Types

Http and Observables

Observables Overview

Create Base Service Class - Inheritance in Angular

Implement Book Servicee

Admin Dashboard

Implement Admin Page Component

Create Book Modal and Implement Book Modal Component

Implement Book Modal Html

Create Book Form in Book Modal

Pass Events from Book Modal to Admin Component - Output Decorator

Implement Edit Book Action - Pass data from Admin Component to Book Modal

Implement Delete Book Action

Other Pages

Implement Purchase Service

Implement Home Page

Implement Profile Page

Production Configuration and Preparation

Environment Variables, System Variables and Custom Variables

Build Angular Application and Serve it via Express.js

Cloud Deployment - Heroku

Heroku Configuration - Procfile, app.json

Github Commitment

Heroku Deployment

Test Application from Heroku URL


Constantin2 September 2021

Where is the integration between frontend and backend? That was the whole purpose of the tutorial. Instead you have 2 independent apps that do not communicate with each other


Udemy ID


Course created date


Course Indexed date
Course Submitted by