Introduction to React JavaScript Training Course

 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