home > training > REACT: Introduction to React JavaScript Training

Introduction to React JavaScript Training Course

REACT

$3,195

  • 5 Days
  • Instructor Judy Lipinski
  • Replay™ Class Recordings Included

Interested in scheduling a date for this course?
Request A Date
x
Course:
  • This field is for validation purposes and should be left unchanged.

Course Description

REACT: Introduction to React JavaScript Training is a 5-Day course with expert developer instructor Judy Lipinski. You’ll get an in-depth introduction to React.js. This is one of the most popular JavaScript libraries for building user interfaces. You’ll learn the fundamental concepts of React while learning best practices for building fast interactive user interfaces. In addition, this is hands-on, formalized training. You will leave class with experience in using the key concepts of React.

Judy Lipinski is the course instructor. She has over 20 years of experience in software development, architecture, and project management. Also, Judy demonstrates repeated success in managing projects and programming with Java, Oracle, Web Development, and Mobile Development.

Outline

 1. Introduction to React

  • State of application development: web, mobile, tv, desktop
  • Why use React?
  • Basics of using VS Code editor
  • Git basics: Download course solutions and demos

 

2. Overview of Modern JavaScript & Tools

  • Essential aspects of EcmaScript 2015 (ES6)
  • Using const and let
  • Arrow functions
  • Classes and Modules
  • Transpiling from ES6 to ES5 with Babel
  • Review and Execute Node projects
  • Browserify, Webpack, Immutable.js

 

3. Fundamental React concepts

  • Virtual DOM
  • Exploring project directories and files
  • Understanding React project dependencies
  • React and React.DOM.*
  • Special DOM attributes
  • Basics of components
  • Using the optional JSX

 

4. React Development

  • Using Create React App
  • Using build tools and Running React projects
  • Code Analysis with ESLint
  • Debugging in VS Code
  • Installing and using React Developer Tools
  • Rendering Elements
  • Using built-in components
  • Nesting components

 

5. Creating Components

  • Hierarchies of React components
  • Creating a basic component with React.createClass
  • Passing properties from parent to child
  • When to use “props” and when to use “state”
  • Using component with React.createElement
  • Storing and Accessing state

 

6. JSX

  • Why JSX?
  • Scoping
  • Specifying attributes
  • Empty and child tags
  • Preventing XSS (cross-site-scripting) attacks
  • Precompiled JSX

 

7. Component’s State and Lifecycle

  • Using constructors
  • Component's lifecycle methods
  • Mounting methods
  • Updating methods
  • Unmounting methods
  • Validating against expected properties
  • Setting defaults
  • Conditional Rendering
  • Lists and Keys

 

8. Event Handling in React

  • Synthetic events system
  • Attaching Event Handlers
  • Passing Arguments to Event Handlers
  • Rendering Based on State
  • Updating State

 

9. Routing with react-router

  • Creating our routes
  • Matching paths
  • Navigating between pages
  • Nesting Routes
  • Capturing Path Params
  • Route Prefixing
  • Defining the root of your app

 

10. Forms

  • Differences between Controlled and Uncontrolled
  • JSX and Forms
  • Using form events
  • Controlling data input with Controlled form components
  • How React.js changes the interface of some form components
  • The importance of using the name attribute
  • Creating custom form components
  • Dealing with multiple Controlled form components
  • Leveraging control of focus
  • Best practices for creating usable forms

 

11. Testing

  • Types of Testing
  • Assertions
  • Jasmine and Karma
  • Creating test suits, specs, and expectations
  • Installing and running Jest
  • Testing React components
Audience

This course is designed for developers who wish to be introduced to the fundamentals of web development using React.

Prerequisites

At a minimum, this course requires an understanding of HTML and JavaScript - to the point of understanding functional programming and callbacks. Experience with CSS is helpful, but not essential.

What You Will Learn

After successfully completing this course, students will be able to:
● Leverage Modern JavaScript techniques, including modules, and use of Node JS
● Create a React application quickly, and understand its architecture
● Understand the fundamental concepts of React
● Leverage tools to debug and lint code
● Familiarization with React.js’s components
● Work with JSX
● Create and execute tests against React Application