React Full Stack Web Development With Spring Boot(Inc. JWT)

Prepare the server-side environment by installing MySQL community server and running it as a background service. Set up HeidiSQL, IntelliJ, and Java 8 (or other versions) configured in IntelliJ.

Install Java 11 as the long-term support version and note the six-month release cycle; Java 17 is current but Java 11+ is supported.

Import a Spring Boot project into IntelliJ, open the spring io project, and rely on Gradle or Maven to build dependencies; refresh if needed and ensure Java 8 in build.gradle.

Install and configure the Lombok library for server-side development and enable annotation processing in IntelliJ to simplify getters and setters.

Explore how Lombok automates Java encapsulation by generating getters, setters, equals, and hashCode with @Data and @Value, and create immutable classes with no-args and all-args constructors.

Explore Spring dependency injection and learn to decouple with abstractions, using constructor, setter, and field injection in Spring with annotations like @Configuration, @Autowired, @Component, @Service, and @Transactional.

Explore how to use the @RequestParam annotation in Spring to extract query, form, and header parameters. Learn about naming, required versus optional parameters, and default values for request parameters.

Explain how path variables map to Spring Boot method parameters using the PathVariable annotation, including default naming, customization, and optional versus required variables for REST APIs.

Understand how the @RequestBody annotation maps the HTTP request body to a transfer or domain object and how HTTP message converters use the request content type, with Jackson for JSON.

Develop and secure server side architecture with Spring Boot, implementing user, product, and transaction CRUD via MVC layers, Spring Security, Hibernate ORM, Liquibase migrations, and Lombok to reduce boilerplate.

Configure a Spring initializer project, selecting Gradle or Maven and Java version 2.1.7. Include model-view-controller, security, persistence with Hibernate, Rest repositories, and Liquibase for database migration, then import into Eclipse.

Configure server-side properties by naming the application, setting data source credentials, enforcing UTC time zone, and enabling Liquibase changelogs for automatic database migrations.

Examine the entity diagram for a product management system where users with roles purchase products via transactions; the model includes user, role as enum, product, and transaction with many-to-one links.

Explore how Hibernate maps database tables to Java classes with annotations like @Entity, @Table, @Column, @Id, and @GeneratedValue, and manage one-to-one, one-to-many, and many-to-many relations with fetch eager and lazy.

Create a user model class with id, name, and password fields and a role class for a database table relation. Use auto-incremented key, equals and hashCode, and mock data annotations.

Create a product model class in the model package. Define id as primary key, and fields for name, price, description; implement equals and hash code with data annotations.

Create a transaction model class to map a database table, with ID as primary key, and many-to-one relations to product and user, plus a purchase date field, using data annotations.

Learn how Liquibase, a SQL migration library, uses XML or SQL changesets to migrate relational databases like MySQL, MSSQL, and Oracle, with rollback and changelog tracking.

Implement liquibase changes for user by creating a database change log and change sets to build a user table with name, first name, and role, with rollback dropping the table.

Implement Liquibase to create change sets for product and transaction models, including creating product and transaction tables and adding test data.

Explore how Spring Boot auto configuration enables JPA repositories for standard CRUD operations, custom queries via findBy methods, and query annotations for update and delete tasks.

Create a user repository interface that extends JpaRepository<User, Long>, enabling spring data to handle basic CRUD operations. Define a query method findByUserName to locate users by their user name.

Create product and transaction repositories by extending the base repository with two generic parameters: the model class and the idea class, and expose basic database methods from the product repository.

Create a Spring user service by building an interface and implementation, injecting the user repository, and encoding passwords. Implement save, update, delete, find by username, and list all users.

Develop a product service by creating a service interface and implementation, add service and transactional annotations, inject the product repository, and implement save, update, and find all products.

Create a Spring transaction service with interface and implementation, annotate with service and transactional, wire the repository, and implement methods to save a sale transaction and find all transactions.

Explore server-side role-based access control across user, musician, and admin roles, covering login, registration, profile viewing, product and transaction management, and user and product administration.

Explore rest controllers in spring boot and http servlets, using get, post, delete, put, and patch mappings to handle requests and responses via ResponseEntity.

Describe REST API methods in a Spring Boot REST controller, using POST, GET, PUT, and DELETE mappings with request data, path variables, and request params to build response entities.

Implement a user controller in Spring Boot, wiring user, product, and transaction services, and map rest endpoints for register, get user, login, purchase, and get all products with authorization tokens.

Implement an admin rest controller to manage users, products, and transactions with APIs for update, delete, find all, and count operations.

Discover how Spring Security enables secure login and protected rest APIs using encrypted authentication headers, user details service, and password encryption. Learn to configure access rules and login/logout paths.

Explore how Spring Security handles basic authentication, authentication and authorization using HTTP filters, authentication managers, providers, and user details service, and customize security with the security config adapter.

Override the default user details service for Spring Security. Load users by username, authorize by role, and return a security user with username, password, and authorities.

Explains spring security default configuration and customization, including form login, http basic, session management, csrf, cors, and logout; demonstrates an end-to-end authentication flow using authentication objects and roles.

Explore spring security authentication, form login, and http filters, processing basic authentication tokens, and using provider managers and DAO authentication providers to verify users and populate the security context.

Explore the authorization architecture in Spring Security, detailing how interceptors map urls to permissions, and how AccessDecisionManager utilizes role, authenticated, and Jsr voters with AffirmativeBased, ConsensusBased, and unanimousBased strategies.

Define a spring security configuration to customize authentication rules, enable cors, permit public resources and user endpoints, and secure remaining APIs with admin role via basic authentication.

Explore how JSON web tokens enable role-based authentication by generating secure tokens with a secret key, then using the authorization header to access protected operations.

Learn how to install and configure json web tokens for secure authentication, set expiration and refresh, define secret keys in application properties, and send authorization headers with bearer prefix.

Create a jwt token provider that generates tokens with username and authorities, sets expiry, signs with an algorithm, and retrieves authentication from the authorization header.

Create a custom JWT authorization filter by extending the basic authentication filter, wire it into Spring Security, validate tokens with a token provider, and set the security context.

Practice testing the server side of a React full stack app built with Spring Boot and JWT.

Explore React fundamentals: building with Create-React-App, npm and package.json, component-based architecture, one-way data flow, props and state, JSX usage, lifecycle methods, and import/export patterns.

Build the client-side UI for user and product management, consume server data via API calls, and implement login, registration, profiles, and admin user CRUD with authorization.

Create a React client for a product management app using create-react-app, consume rest api data with axios, and set up routing, styling, and icons with bootstrap, react-router-dom, and font awesome.

Explore the React project structure, from package.json and public and src folders to index.js, and learn how React DOM renders a single-page app served by npm start.

Configure external dependencies for the grid project by defining index and bootstrap components, completing the configuration and aligning equity and purpose.

Create model classes on the React client by building a model package under main package, defining user and role classes, plus a cost world class, and outlining a transaction model.

Explore observables in React as asynchronous data streams, with RxJS support, and learn how observers subscribe, and handle next, error, and complete events, including session storage interactions.

Learn how axios enables HTTP requests to fetch server API data, using a service layer in React to manage data centrally and expose it to multiple components via promises.

Implement a user service that handles login, logout, registration, get products, and purchases via REST APIs, managing current user with a behavior subject and local storage, exposing it as observable.

Create a login component in React by wiring the user service to a login form. Manage state for user and errors, and render the login page with redirect to homepage.

Implement the register component in a React full-stack setup by building a register page, wiring to the user service, and managing form state and events for registration.

Implement a profile page by creating a profile component, importing React and the user service, checking the current user and redirecting to logon if absent, and rendering user details.

Build a React home page that lists products in a bootstrap table, fetches data from the user service, and handles purchases via transactions while managing current user and status messages.

Implement a product detail page component by creating a detailed page, handling state from props and local storage, and rendering a container with a header and product details.

Implement an admin service to update, delete, and fetch all users via put, post, and get requests, each with an authorization header using the user service token.

Implement an admin component that lists users in a bootstrap table and enables create, edit, and delete actions through admin and user services.

Create a reusable user modal to edit and create users, using a Bootstrap modal and a user model with state for user, loading, and errors, connected to admin services.

Implement a lead model confirmation dialog as a React component using a bootstrap modal, wiring state, props, and services to delete users and handle errors.

Implement not found and unauthorized error components under a components/errors folder, exporting them with render functions and a container, and include a return home page.

Explain building React routers with a class component, selecting a history type (memory history or hash history), and defining routes for login, profile, product detail with parameters, and 404/401 pages.

Protect admin and other routes in React by using a guard wrapper component that renders content based on user roles from the session, redirecting to login or an unauthorized page.

Implement an authentication guard to protect private routes by checking the current user with a user service, redirecting to login or unauthorized pages, and enforcing role-based access (admin, users).

Create a template navigation bar for a React app, import font awesome icons, manage current user and admin state from the user service, and render login, profile, and admin options.

Learn to display the active route in navigation using the Bootstrap active class, track current location with router history, and manage mount/unmount listeners to apply the active link.

Test the application by starting the server (via main class or Gradle task), launching the Kaline site, and validating different user roles configured in the database.