React Training Courseware (REA101)

This course provides an in-depth and comprehensive introduction to React, a popular JavaScript library for building user interfaces. Students will learn the fundamentals of React, such as JSX, components, state, and routing. The course also covers advanced topics like styling React apps, implementing game logic, and working with React hooks and effects. Throughout the course, students will work on a real-world project, Mathificent, which helps them apply the concepts they learn and develop a practical understanding of React. The well-organized and structured curriculum, combined with hands-on exercises, ensures that students gain a solid foundation in React and are well-prepared to develop sophisticated web applications.

Publisher: Webucator

Benefits

Comprehensive Curriculum: The course covers both fundamental and advanced React concepts, ensuring that students gain a deep understanding of the library.
Hands-on Exercises: Interactive exercises and practical examples are provided throughout the course, allowing students to apply their knowledge and reinforce their learning.
Engaging Project: The course includes a real-world project, Mathificent, which helps students understand how to apply React concepts in a practical setting and keeps them engaged.
Clear Learning Path: The course is organized into clear sections and topics, making it easy for trainers to plan their lessons and guide their students through the learning process.

Full Lab Environment Add-On

Enhance and simplify your classes by providing an unparalleled learning platform that requires no setup. Your trainers and students can dive straight into a fully-prepared lab environment with just a click. This seamless integration means no time wasted on installations or configurations, allowing trainers and students to focus solely on the task at hand. The lab comes pre-loaded with all the necessary tools and resources, ensuring a smooth, hassle-free learning experience.

Outline

Introduction to React
1. What is React?
  1. React is Fast
  2. React is Scalable
  3. React is Reliable
2. React Essentials
  1. Rendering in React
3. Get Started with Create React App
4. Introducing Our Project: Mathificent
5. Learning the Structure of a React App
JSX and React Elements
1. Using JSX in React
2. JSX Rules
  1. JSX Syntax
  2. JSX is an Extension of JavaScript
  3. Using Custom Elements in JSX
  4. Using JavaScript in JSX
3. Using JSX
React Components
1. Assembling User Interfaces
  1. Understanding F.I.R.S.T
  2. Passing Data with Props
2. Breaking an App into Components
3. Passing Props Between Components
4. Organizing Your Components
5. Semantic HTML and the Fragment Element
6. Using Fragment
7. Destructuring props
React State
1. Understanding State
2. Getting React to React
3. Why is count a Constant?
4. Child Components and State
5. Adding State
React Routing
1. Routing
2. Implementing Routes
Styling React Apps
1. Plain-old CSS
2. Importing CSS Modules to Components
3. Cleaning Up App.css
4. Styling the Main Component
5. Inline Styles
6. Creating the Game Component
7. A Word of Caution
Implementing Game Logic
1. Setting the Equation
2. Getting the User's Answer
3. Checking the User's Answer
4. Creating the Timer
React Effects
1. React Hooks
2. The useEffect Hook
3. The Need for useEffect
4. useEffect to the Rescue
5. Mount and Unmount
6. Passing Functions to State Variable Setters
7. Fixing the Timer
8. Catching Keyboard Events
9. Building and Deploying Your React App

Required Prerequisites

HTML
JavaScript

Useful Prerequisites

CSS
Bootstrap

License

Length: 3 days | $105.00 per copy
Labs: Add-on available | $38.22 per lab
View Lab Details

License Request More Information Download Sample Copy Request Trainer Evaluation Copy

What is Included?

Student Manual
Student Class Files
Labs (optional add-on)

Courseware Tracks

This course is included in the following tracks: