React for Java Spring Boot Developers
A comprehensive course designed for Java Spring Boot developers to learn React and build modern web applications.
...
Share
Introduction to React and JSX
Unit 1: React Fundamentals
What is React?
React's Core Principles
React vs Angular/Vue
Setting Up Node.js
Create React App (CRA)
Unit 2: JSX Deep Dive
JSX: A Quick Look
JSX Expressions
JSX Attributes
JSX Gotchas
JSX and Security
Unit 3: React Elements and Components
React Elements Defined
React Components Defined
Elements vs Components
Rendering Elements
First Component
Components: Functional vs Class
Unit 1: Functional Components
What are Components?
Functional Components
Rendering Functional C.
Props in Functional C.
Composition with Func. C
Unit 2: Class Components
Class Components Intro
Rendering Class C.
Props in Class C.
State in Class C.
Updating State in Class C
Unit 3: Functional vs Class Components
Func vs Class: Syntax
State: Func vs Class
Lifecycle: Func vs Class
When to use Which?
Refactoring Example
State Management with React Hooks
Unit 1: Introduction to State in React
What is React State?
Stateful vs Stateless
Why Use Hooks?
Unit 2: The useState Hook
useState: The Basics
Declaring State Variables
Updating State
Simple Counter
Handling Text Input
Unit 3: Advanced State Management
Immutability Explained
Updating Objects
Updating Arrays
Functional Updates
Unit 4: Best Practices and Common Pitfalls
Batching Updates
Stale Closures
Too Many Renders
Side Effects with useEffect Hook
Unit 1: Understanding Side Effects
What are Side Effects?
Why useEffect?
useEffect: A First Look
Unit 2: Data Fetching with useEffect
Fetching Data
Async/Await
Cleaning Up Fetching
Unit 3: Dependency Arrays
Dependency Arrays
Empty Array
Missing Dependencies
Object Dependencies
Unit 4: Advanced useEffect Use Cases
DOM Manipulation
Subscriptions
Intervals and Timers
Custom Hooks
Conditional Effects
Fetching Data from Spring Boot APIs
Unit 1: Introduction to Data Fetching
Why Fetch Data?
REST API Basics
Intro to `fetch`
Intro to Promises
`fetch` and Promises
Unit 2: Making API Requests with Fetch
Basic GET Request
Adding Request Headers
Sending POST Requests
PUT and DELETE Requests
Handling API Errors
Unit 3: Advanced Data Fetching Techniques
Using async/await
Using Axios
Axios Configuration
CORS Explained
Data Transformation
Displaying Data in React Components
Unit 1: Rendering Basic Data
Rendering Text & Numbers
Rendering Booleans
Rendering Objects
Rendering Images
Rendering Attributes
Unit 2: Displaying Lists
Rendering Basic Lists
Rendering List of Objects
Styling List Items
List Keys Explained
Advanced List Rendering
Unit 3: Conditional Rendering
If/Else Rendering
Ternary Operator
Short Circuit Evaluation
Preventing Rendering
Switch Case Rendering
Handling User Input and Form Submissions
Unit 1: Controlled Components
Intro to Controlled Input
Basic Text Input
Handling Input Change
Multiple Inputs
Other Input Types
Unit 2: Form Validation
Intro to Form Validation
Basic Validation
Email Validation
Password Validation
Real-time Validation
Unit 3: Form Submission
Handling Submissions
Sending Data to API
Handling API Errors
Resetting the Form
Optimistic Updates
Client-Side Routing with React Router
Unit 1: Introduction to React Router
SPA and Routing
React Router Intro
Setting Up React Router
Basic Route Configuration
Navigating with Links
Unit 2: Advanced Routing Techniques
Route Parameters
Nested Routes
Redirects
No Match Route
Programmatic Navigation
Unit 3: Advanced React Router Concepts
Query Parameters
Route Configuration
Auth Flows
Router Context
History Management
Styling React Components with CSS
Unit 1: Inline Styles in React
Inline Styles: Basics
Dynamic Inline Styles
Inline Styles: Pros & Cons
Unit 2: CSS Classes in React
CSS Classes: Basics
Conditional Class Names
CSS Specificity
CSS Inheritance
Unit 3: CSS Modules in React
CSS Modules: Intro
CSS Modules: Composition
Global Styles in CSS Modules
Unit 4: CSS Preprocessors (Sass/Less)
CSS Preprocessors: Intro
Sass: Variables & Nesting
Sass: Mixins & Functions
Sass vs. Less
Styling React Components with Styled Components
Unit 1: Introduction to Styled Components
What are Styled Components?
Installation
Basic Styled Component
Styling with Props
Extending Styles
Unit 2: Advanced Styling Techniques
Theming Introduction
Accessing the Theme
Global Styles
Animation
Media Queries
Unit 3: Best Practices and Advanced Concepts
SSR Compatibility
With Other Libraries
Performance Tips
Testing
CSS-in-JS Benefits
React App Deployment
Unit 1: Preparing for Deployment
Production Build
Environment Variables
Base URL Configuration
Static Asset Handling
Deployment Checklist
Unit 2: Deployment Options
Deploying to Netlify
Deploying to Vercel
Deploying to AWS S3
Deploying to GitHub Pages
Other Options
Unit 3: Performance Optimization
Code Splitting
Image Optimization
Caching Strategies
Bundle Analysis
Performance Auditing