[Full Stack][DEBUG] SpringBoot RestAPIs CRUD Application with MySQL Examples

[DEBUG] SpringBoot RestAPIs CRUD Application with MySQL Example - Ajax JavaScript to MySQL

Article: SpringBoot RestAPIs CRUD Application with MySQL Examples – FullStack: Frontend (Bootstrap + Ajax JavaScript) to Backend (SpringBoot + MySQL)
https://loizenai.com/springboot-crud-restapis-mysql-example-fullstack-frontend-bootstrap-and-ajax-to-backend-springboot-and-mysql/

In the tutorial, I will introduce how to create a Fullstack SpringBoot RestAPIs CRUD Application to MySQL database using Spring WEB MVC framework and Spring JPA for building Backend and using Bootstrap, JQuery Ajax for building frontend client

I. Overview – How to build SpringBoot CRUD application?
For building RestAPIs in SpringBoot application, we use Spring MVC Web.
For interacting with database MySQL/PostgreSQL, we use Spring JPA.
We implement RestAPI’s URL in RestAPIController.java file to process bussiness logic.
For manipulating database’s records, we define a JPA model for mapping field data and use a JPA CRUD repository to do CRUD operation with MySQL/PostgreSQL.

II. Project Structure

- models package defines Customer model and Message response class.
- repository package defines Spring JPA repository class CustomerRepository to do CRUD operation with database.
- service package defines a middleware class CustomerServices between Controller and Repository.
- controller package defines a RestAPI Controller RestAPIController to handle POST/GET/PUT/DELETE request.
- src\main\resources\static folder contains .html page views.
- src\main\resources\static\js folder contains .js files that implements Ajax client to do POST/GET/PUT/DELETE requests to SpringBoot server.

Step to Development
SpringBoot Backend Development
Create SpringBoot project
Database Configuration
Define Spring JPA Model
Implement JPA Repository and Service
Implement SpringBoot RestAPIs Controller – POST/GET/PUT/DELETE

Bootstrap and Ajax Frontend Development
Create HTML Page Views
Create Index.html
Showing Customers and Updating Page
Implement JQuery Ajax Client

III. Video Detail Guides

1. Introduce Overall Article
0:00 - Review SpringBoot CRUD App overview
0:59 - Review SpringBoot CRUD MySQL article
1:42 - Download Sourcecode
2:03 - Import Sourcecode to Eclipse
2:12 - Review SpringBoot CRUD Project Structure
2:21 - Review pom.xml file
2:29 - Review Customer.js file
2:35 - Review CustomerRepository.java file
2:38 - Review CustomerServices.java file
2:47 - Review RestAPIController.java file
2:54 - Review index.html file
3:01 - Review customers.html file

2. Start DEBUG with SpringBOOT RestAPIs

3:17 - Start Debug SpringBoot MySQL CRUD Application
3:24 - Start Debug a POST RestAPI - save a Customer object to MySQL database
4:22 - Start Debug - Retrieve all Customer objects from MySQL database
4:50 - Start GET a Customer by ID from MySQL database
5:14 - Start PUT request - Update a Customer to MySQL database via SpringBOOT RestAPI
5:44 - Start DELETE request to SpringBoot RestAPIs to remove a entity from MySQL database

6:20 - Review Ajax Client App with SpringBoot CRUD application

3. Debug Full Stack Flow - Client: Ajax JavaScript to Backend: SpringBoot CRUD RestAPI

8:05 - Check Ajax JavaScript Sourcecode on Browser Client
8:21 - Debug Fullstack Post a Customer from Client to MySQL
9:56 - Start Debug FullStack - retrieve a List Customer from Ajax to SpringBoot
10:47 - Start Debug Full Flow - Get a Customer from Ajax to SpringBoot by a given id
11:43 - Start FullStack Debug - Update a Customer from Ajax to SpringBoot
12:43 - start FullStack Debug - delete a Customer from Ajax to Springboot RestAPI

IV. Related posts
Related posts:

1. Spring Boot Security JWT Authentication Example – MySQL/PostgreSQL + Spring JPA + RestAPIs
https://loizenai.com/spring-boot-security-jwt-authentication-example-mysql-postgresql-spring-jpa-restapis/

2. Angular CRUD Application with SpringBoot and MySQL/PostgreSQL RestAPIs – Fullstack Angular 10-9-8 HttpClient Post/Get/Put/Delete
https://loizenai.com/angular-crud-application-with-springboot-and-mysql-postgresql-restapis-fullstack-angular-httpclient-post-get-put-delete/

3. Spring Boot Tutorial Pagination, Filtering and Sorting RestAPIs Example | Spring JPA – Pageable & Sort object requests
https://loizenai.com/spring-boot-tutorial-pagination-filtering-and-sorting-example/

V. Sourcecode
https://loizenai.com/springboot-crud-restapis-mysql-example-fullstack-frontend-bootstrap-and-ajax-to-backend-springboot-and-mysql #sourcecode

---------------------------------
@CopyRight by https://loizenai.com
YouTuBe loizenai