Course Highlights
  • Develop a Full Stack E-commerce application with Angular front-end and Spring Boot back-end
  • Learn how to build Angular front-end applications .... all from the beginning. We assume no prior knowledge of Angular.
  • Develop a Spring Boot back-end using REST APIs and MySQL database
  • Develop a shopping cart with Angular frontend and Spring Boot backend integration
  • Process credit card payments using Stripe API
  • Develop your code using modern development tools such as IntelliJ, VS Code, Maven and npm
  • I am a RESPONSIVE INSTRUCTOR ... post your questions and I will RESPOND in 24 hours.
  • Join an ACTIVE COMMUNITY of 80,000+ students that are already enrolled! Over 6,000+ Reviews - 5 STARS
  • Full Stack developers with Angular and Spring Boot are in HIGH-DEMAND. Level up your career and become a FULL STACK developer!
  • You can DOWNLOAD all source code and PDFs. Perfect for offline LEARNING and REVIEW.
Curriculum

3 Topics
Introduction
How To Take This Course and How To Get Help
Download the Source Code and PDF Files

1 Topic
Angular Overview

1 Topic
Set Up Development Tools

7 Topics
TypeScript Overview
Creating our first TypeScript application
Defining Variables - Overview
Defining Variables - Write Some Code
Creating Loops and Arrays - Overview
Creating Loops and Arrays - Write Some Code - Part 1
Creating Loops and Arrays - Write Some Code - Part 2

7 Topics
Creating Classes - Overview
Creating Classes - Write Some Code
Defining Accessors - Overview
Defining Accessors - Write Some Code
Configuring Compiler Options with tsconfig.json
Parameter Properties
TypeScript Modules: Import and Export

9 Topics
Inheritance - Overview
Inheritance - Creating the Superclass and Subclass
Inheritance - Pulling it all together in a Main App
Inheritance - Developing a second Subclass
Inheritance - Adding Shapes to an Array
Abstract Classes - Overview
Abstract Classes - Write Some Code
Interfaces - Overview
Interfaces - Write Some Code

10 Topics
Getting Started with Angular
Exploring the Angular Project
Creating a New Angular Project
Behind The Scenes of An Angular Project - Overview
Behind The Scenes of An Angular Project - Demo
Creating a New Angular Component - Overview - Part 1
Creating a New Angular Component - Overview - Part 2
Creating a New Angular Component - Write Some Code - Part 1
Creating a New Angular Component - Write Some Code - Part 2
Creating a New Angular Component - Write Some Code - Part 3

5 Topics
Integrating Angular and Bootstrap CSS - Overview
Integrating Angular and Bootstrap CSS - Write Some Code
Angular Conditionals and Formatting - Overview
Angular Conditionals and Formatting - Write Some Code
FAQ: Angular Conditionals: How to highlight table row

10 Topics
Project Overview
Spring Boot Project Set Up
HEADS UP: Eclipse and Lombok
Set Up Database Tables
Create Spring Boot Starter Project
Develop JPA Entities - Part 1
Develop JPA Entities - Part 2
Create REST APIs with Spring Data JPA Repositories and Spring Data REST
REST APIs - Configure for Read Only - Overview
REST APIs - Configure for Read Only - Write Some Code

9 Topics
Angular Project Overview - Part 1
Angular Project Overview - Part 2
Angular Project - Setup
Angular Project - Create Product class and Product Service - Part 1
Angular Project - Create Product class and Product Service - Part 2
Angular Project - Update Angular Component
Angular Project - Integrating Angular and Spring Boot for Full Stack App!
Angular Project - Building an HTML Table
Angular Project - Adding Product Images

10 Topics
Angular Project - Template Integration Overview
Angular Project - Download Starter Files
Angular Project - Tour of HTML Template Files
Angular Project - Install Bootstrap CSS Styles with npm
Angular Project - Add local custom CSS styles
Angular Project - Integrate Template Files and Logos
Angular Project - Run the App
Angular Project - Add support for Product Grid
Angular Project - Enhance Application with Product Images
FAQ: Should I Store Images as BLOBs in Database or Files on file system?

8 Topics
Angular Project - Search for Products by Category - Overview - Part 1
Angular Project - Search for Products by Category - Overview - Part 2
Angular Project - Search for Products by Category - Overview - Part 3
Angular Project - Search for Products by Category - Code - Define routes
Angular Project - Search for Products by Category - Code - Define Router Outlet
Angular Project - Search for Products by Category - Code - Enhance ProductList
Angular Project - Search for Products by Category - Code - Update Spring Boot
Angular Project - Search for Products by Category - Code - Update ProductService

9 Topics
Angular Project - Search for Products by Category (Dynamic Search Component 1)
Angular Project - Search for Products by Category (Dynamic Search Component 2)
HEADS UP FOR SPRING BOOT 3: Imports for EntityManager and EntityType
Angular Project - Dynamic Search Component - Modify Spring Boot App
Angular Project - Dynamic Search Component - Create Component
Angular Project - Dynamic Search Component - Call Product Service
Angular Project - Dynamic Search Component - Add Dynamic Code to HTML
Angular Project - Dynamic Search Component - View Console Logs
FAQ: Display Category Name in Product List Grid

9 Topics
Angular Project - Search for Products by Keyword - Overview - Part 1
Angular Project - Search for Products by Keyword - Overview - Part 2
Angular Project - Search for Products by Keyword - Overview - Part 3
Angular Project - Search for Products by Keyword - Modify Spring Boot App
Angular Project - Search for Products by Keyword - Angular Search Component
Angular Project - Search for Products by Keyword - Send Data to search route
Angular Project - Search for Products by Keyword - Enhance ProductList Component
Angular Project - Search for Products by Keyword - Update ProductService API
Angular Project - Search for Products by Keyword - Handle for No Products Found

7 Topics
Angular Project - Product Master-Detail View - Overview
Angular Project - Product Master-Detail View - Create new component and route
Angular Project - Product Master-Detail View - Add router links on Master page
Angular Project - Product Master-Detail View - Enhance the Details Component
Angular Project - Product Master-Detail View - Update Product Service and HTML
Angular Project - Product Master-Detail View - Add more Product Details
IDE Extension - Angular Language Service

14 Topics
Angular Project- Pagination Overview
Angular Project - Pagination Development Process - Part 1
Angular Project - Pagination Development Process - Part 2
Angular Project - Pagination - Install ng-bootstrap
Angular Project - Pagination - Add Pagination support to Product Service
Angular Project - Pagination - Update Product List Component for Pagination
Angular Project - Pagination - Enhance HTML template to use Pagination Component
Angular Project - Pagination Demo
Angular Project - Pagination - Selecting Page Size - Part 1
Angular Project - Pagination - Selecting Page Size - Part 2
Angular Project - Pagination - Setting Max Size and Adding Boundary Links
Angular Project - Pagination - Keyword Search Overview
Angular Project - Pagination - Keyword Search - Update ProductService
Angular Project - Pagination - Keyword Search - Update ProductListComponent

10 Topics
Angular Project - Shopping Cart Status Overview - Basics
Angular Project - Shopping Cart Status - Create new component
Angular Project - Shopping Cart Status - Add Click Handler
Angular Project - Shopping Cart Status Overview - Advanced
Angular Project - Shopping Cart Status Overview - Advanced - Cart Service
Angular Project - Shopping Cart Status Overview - Create model class: CartItem
Angular Project - Shopping Cart Status - Develop CartService - Add to Cart
Angular Project - Shopping Cart Status - Develop CartService - Compute Totals
Angular Project - Shopping Cart Status - Call CartService
Angular Project - Shopping Cart Status - Subscribe to CartService Display Totals

17 Topics
Angular Project - Shopping Cart Status - Refactor Cart Service Overview
Angular Project - Shopping Cart Status - Refactor Cart Service - Write the Code
Angular Project - Shopping Cart Status - Add To Cart From Details View
Angular Project - Shopping Cart Status - Add To Cart From Details View - Coding
Angular Project - List Shopping Cart Items - Overview
Angular Project - List Shopping Cart Items - Create CartDetailsComponent
Angular Project - List Shopping Cart Items - Create HTML Table
Angular Project - List Shopping Cart Items - Retrieve data from Cart Service
Angular Project - List Shopping Cart Items - Loop over Cart Items in HTML
Angular Project - List Shopping Cart Items - Display Cart Totals
Angular Project - List Shopping Cart Items - Handle an Empty Cart
Angular Project - Increment Item Quantity - Overview
Angular Project - Increment Item Quantity - Layout the Buttons
Angular Project - Increment Item Quantity - Add Event Handlers
Angular Project - Decrement/Remove Item Quantity - Overview
Angular Project - Decrement Item Quantity - Write Some Code
Angular Project - Remove Item - Write Some Code

10 Topics
Angular Project - Checkout Form Layout - Overview - Part 1
Angular Project - Checkout Form Layout - Overview - Part 2
Angular Project - Checkout Form Layout - Generate Checkout Component
Angular Project - Checkout Form Layout - Add support for Reactive Forms
Angular Project - Checkout Form Layout - Layout Form Controls in HTML
Angular Project - Checkout Form Layout - Add Event Handling for Submit
Angular Project - Checkout Form Layout - Shipping Address
Angular Project - Checkout Form Layout - Billing Address
Angular Project - Checkout Form Layout - Credit Card
Angular Project - Checkout Form Layout - Review Your Order

20 Topics
Angular Project - Checkout Form - Populate Credit Card Dates - Overview
Angular Project - Checkout Form - Create Form Service
Angular Project -Checkout Form - Retrieve Months and Years from Service
Angular Project - Checkout Form - Populate Drop-Down Lists for Months and Years
Angular Project - Checkout Form - Dependent Fields - Overview
Angular Project - Checkout Form - Dependent Fields - Write Some Code
Angular Project - Checkout Form - Populate Countries and States - Overview
Angular Project - Checkout Form - Populate Countries and States - Create DB
Angular Project - Checkout Form - Populate Countries and States - JPA Entities
Angular Project - Checkout Form - Populate Countries and States - Repositories
Angular Project - Checkout Form - Populate Countries and States - Repositories 2
Angular Project - Checkout Form - Populate Countries and States - REST Config
Angular Project - Checkout Form - Populate Countries and States - Frontend
Angular Project - Checkout Form - Populate Countries and States - Create Classes
Angular Project - Checkout Form - Populate Countries and States - Component
Angular Project - Checkout Form - Populate Countries and States - Event Handler
Angular Project - Checkout Form - Populate Countries and States - States
Angular Project - Checkout Form - Populate Countries and States - Billing
Angular Project - Checkout Form - Populate Countries and States - Console logs
Angular Project - Checkout Form - Populate Countries and States - Bug Fix

17 Topics
Angular Project - Checkout Form - Validation Overview - Part 1
Angular Project - Checkout Form - Validation Overview - Part 2
Angular Project - Checkout Form - Add Validation Rules
Angular Project - Checkout Form - Display Validation Error Messages
Angular Project - Checkout Form - Display Validation Error Messages continued
Angular Project - Checkout Form - Custom Validator Rule - Overview
Angular Project - Checkout Form - Custom Validator Rule - Define the Rule
Angular Project - Checkout Form - Custom Validator Rule - Apply the Rule
Angular Project - Checkout Form - Shipping Validation - Part 1
Angular Project - Checkout Form - Shipping Validation - Part 2
Angular Project - Checkout Form - Shipping Validation - Part 3
Angular Project - Checkout Form - Billing Validation - Part 1
Angular Project - Checkout Form - Billing Validation - Part 2
Angular Project - Checkout Form - Billing Validation - Part 3
Angular Project - Checkout Form - Credit Card Validation - Part 1
Angular Project - Checkout Form - Credit Card Validation - Part 2
Angular Project - Checkout Form - Credit Card Validation - Part 3

4 Topics
Angular Project - Checkout Form - Review Cart Totals - Overview Part 1
Angular Project - Checkout Form - Review Cart Totals - Overview Part 2
Angular Project - Checkout Form - Review Cart Totals - Coding Part 1
Angular Project - Checkout Form - Review Cart Totals - Coding Part 2

12 Topics
eCommerce Project - Checkout Form - Save the Order to Database - Overview
eCommerce Project - Checkout Form - Save the Order to Database - Run DB Script
eCommerce Project - Checkout Form - Save the Order to Database - Entities - 1
eCommerce Project - Checkout Form - Save the Order to Database - Entities - 2
eCommerce Project - Checkout Form - Save the Order to Database - Entities - 3
eCommerce Project - Checkout Form - Save the Order to Database - Entities - 4
eCommerce Project - Checkout Form - Save the Order to Database - Create DTOs
eCommerce Project - Checkout Form - Save the Order to Database - Repo+Service 1
eCommerce Project - Checkout Form - Save the Order to Database - Repo+Service 2
eCommerce Project - Checkout Form - Save the Order to Database - Repo+Service 3
eCommerce Project - Checkout Form - Save the Order to Database - REST Controller
eCommerce Project - Checkout Form - Save the Order to Database - Postman Test

8 Topics
eCommerce Project - Checkout Form - Save the Order - Frontend Overview
eCommerce Project - Checkout Form - Save the Order - Frontend - Common Classes
eCommerce Project - Checkout Form - Save the Order - Frontend - Checkout Service
eCommerce Project - Checkout Form - Save the Order - Frontend - Injection
eCommerce Project - Checkout Form - Save the Order - Frontend - Order Items
eCommerce Project - Checkout Form - Save the Order - Frontend - Purchase
eCommerce Project - Checkout Form - Save the Order - Frontend - Call Service
eCommerce Project - Checkout Form - Save the Order - Frontend - Test App

17 Topics
Security - Login/Logout - Release 3 Tasks
Security - Login/Logout - Security Concepts - Part 1
Security - Login/Logout - Security Concepts - Part 2
Security - Login/Logout - Okta Integration - Authorization Server
Security - Login/Logout - Okta Integration - App Configuration
Security - Login/Logout - Okta Integration - Sign-In Widget
Security - Login/Logout - Okta Integration - Login Status Component
Security - Login/Logout - Coding - Create OIDC Client App
Security - Login/Logout - Coding - Develop App Configuration
Security - Login/Logout - Coding - Install Okta Dependencies
Security - Login/Logout - Coding - Create the Login Component
Security - Login/Logout - Coding - Render the Sign-In Widget
Security - Login/Logout - Coding - Develop Login Status Component
Security - Login/Logout - Coding - Add CSS for Login Status Component
Security - Login/Logout - Coding - More CSS for Login Status Component
Security - Login/Logout - Coding - Connecting Routes
Security - Login/Logout - Coding - App Module Configuration

4 Topics
Release 3.0 - Security - VIP Member Access - Protected Routes - Overview
Release 3.0 - Security - VIP Member Access - Protected Routes - Component Dev
Release 3.0 - Security - VIP Member Access - Protected Routes - Configuration
Release 3.0 - Security - VIP Member Access - Protected Routes - Testing Access

5 Topics
Release 3.0 - Security - Handling Browser Refresh - Overview Part 1
Release 3.0 - Security - Handling Browser Refresh - Overview Part 2
Release 3.0 - Security - Handling Browser Refresh - Loading and Persisting Items
Release 3.0 - Security - Handling Browser Refresh - Running the Application
Release 3.0 - Security - Handling Browser Refresh - Exploring Storage in Browser

9 Topics
Release 3.0 - Refactoring - Handle Customer By Email - Overview
Release 3.0 - Refactoring - Handle Customer By Email - Coding
Release 3.0 - Refactoring - Handle Customer By Email - Run the App
Release 3.0 - Refactoring - Backend Configs - Overview - Part 1
Release 3.0 - Refactoring - Backend Configs - Overview - Part 2
Release 3.0 - Refactoring - Backend Configs - Coding - Fix Deprecated Method
Release 3.0 - Refactoring - Backend Configs - Coding - Configure CORS Mapping
Release 3.0 - Refactoring - Backend Configs - Coding - Configure @RestController
Release 3.0 - Refactoring - Backend Configs - Coding - Disable HTTP PATCH method

10 Topics
Release 3.0 - Security - Order History - Backend Overview
Release 3.0 - Security - Order History - Backend Coding
Release 3.0 - Security - Order History - Frontend Overview
Release 3.0 - Security - Order History - Frontend Coding - Track User's Email
Release 3.0 - Security - Order History - Frontend Coding - OrderHistory Service
Release 3.0 - Security - Order History - Frontend Coding - OrderHistoryComponent
Release 3.0 - Security - Order History - Frontend Coding - Update HTML Page
Release 3.0 - Security - Order History - Frontend Coding - Add Orders Button
Release 3.0 - Security - Order History - Frontend Coding - Run the App
Release 3.0 - Security - Order History - Frontend Coding - Sort Orders by Date

6 Topics
Release 3.0 - Security - Order History - Secure Backend Overview
Release 3.0 - Security - Order History - Secure Backend - Set Up Okta App
Release 3.0 - Security - Order History - Secure Backend - Configure Properties
HEADS UP FOR SPRING BOOT 3 AND OKTA 3
Release 3.0 - Security - Order History - Secure Backend - Protect Endpoints
Release 3.0 - Security - Order History - Secure Backend - Testing the App

7 Topics
Release 3.0 - Security - Order History - Secure Frontend Overview - Part 1
Release 3.0 - Security - Order History - Secure Frontend Overview - Part 2
Release 3.0 - Security - Order History - Secure Frontend - Create an Interceptor
Release 3.0 - Security - Order History - Secure Frontend - Pass Access Token
Release 3.0 - Security - Order History - Secure Frontend - Register Interceptor
Release 3.0 - Security - Order History - Secure Frontend - Test the App
Release 3.0 - Security - Order History - Secure Frontend - Resolve Checkout

5 Topics
Secure Communication with HTTPS - Angular Frontend - Overview
Secure Communication with HTTPS - Angular Frontend - Coding Part 1
Secure Communication with HTTPS - Angular Frontend - Coding Part 2
Secure Communication with HTTPS - Okta Updates - Overview
Secure Communication with HTTPS - Okta Updates - Configuration

3 Topics
Secure Communication with HTTPS - Spring Boot Backend - Overview
Secure Communication with HTTPS - Spring Boot Backend - Coding Part 1
Secure Communication with HTTPS - Spring Boot Backend - Coding Part 2

9 Topics
Angular Environment Configuration - Overview
HEADS UP: Angular 15 and Environments
Angular Environment Configuration - Coding
Angular Environment Configuration - Add New Environment - Overview Part 1
Angular Environment Configuration - Add New Environment - Overview Part 2
Angular Environment Configuration - Add New Environment - Overview Part 3
Angular Environment Configuration - Add New Environment - Coding Part 1
Angular Environment Configuration - Add New Environment - Coding Part 2
Angular Environment Configuration - Add New Environment - Coding Part 3

31 Topics
Credit Card Payment Processing Overview
Payment Processing - Stripe API Overview
Payment Processing - Stripe Integration Options - Part 1
Payment Processing - Stripe Integration Options - Part 2
Payment Processing - Stripe Development Process Overview - Part 1
Payment Processing - Stripe Development Process Overview - Part 2
Payment Processing - Stripe - Backend Coding Setup - Maven
Payment Processing - Stripe - Backend Coding Setup - API Keys
Payment Processing - Stripe - Backend Coding - Checkout Service
Payment Processing - Stripe - Backend Coding - Checkout Controller
Payment Processing - Stripe - Frontend Overview - Part 1
Payment Processing - Stripe - Frontend Overview - Part 2
Payment Processing - Stripe - Frontend Overview - Part 3
Payment Processing - Stripe - Frontend Coding - Part 1
Payment Processing - Stripe - Frontend Coding - Part 2
Payment Processing - Stripe - Frontend Coding - Part 3
Payment Processing - Stripe - Frontend Coding - Part 4
Payment Processing - Stripe - Frontend Coding - Part 5
Payment Processing - Stripe - Frontend Coding - Part 6
Payment Processing - Stripe - Frontend Coding - Part 7
Payment Processing - Stripe - Frontend Coding - Part 8
Payment Processing - Stripe - Bug Fix for Total Amount
Payment Processing - Stripe - Bug Fix for Browser Reload after Checkout
Payment Processing - Stripe - Add Customer Details - Overview
Payment Processing - Stripe - Add Customer Details - Coding Part 1
Payment Processing - Stripe - Add Customer Details - Coding Part 2
Payment Processing - Stripe - Disable Payment Button - Overview
Payment Processing - Stripe - Disable Payment Button - Coding
Payment Processing - Stripe - Email Receipts - Overview
Payment Processing - Stripe - Email Receipts - Coding Part 1
Payment Processing - Stripe - Email Receipts - Coding Part 2

1 Topic
Thank You

1 Topic
Set Up Guides

  Write a Review

Full Stack: Angular and Java Spring Boot E-Commerce Website

Go to Paid Course