Embrace the Microsoft hype! Get 50% off on Microsoft Instructor-led Training courses!

MyGK
Support
USA USA - English
Checkout

Cart () Loading...

    • Quantity:
    • Delivery:
    • Dates:
    • Location:

    $

Subtotal

$

Checkout

or Continue Shopping

Course  
Contact Sales
Support
Checkout

Cart () Loading...

    • Quantity:
    • Delivery:
    • Dates:
    • Location:

    $

Subtotal

$

Checkout

or Continue Shopping

Request Group Training

Getting Started with React | React Basics

Learn to use React to build your apps.

Introduction to React | React Essentials is a three-day hands-on course designed to get you quickly up and running with core React skills. Geared for more experienced web developers new to React, this course provides you with the core knowledge and hands-on skills required to build reliable and powerful React apps.

Throughout the course you’ll explore React fundamentals with a progressive, example-driven approach. You’ll create your first apps, learn how to write components, start handling user interaction, and manage rich forms. We end the first part by exploring the inner workings of Create React App (Facebook’s tool for running React apps), writing automated unit tests, and building a multi-page app that uses client-side routing.

Every project in this course was built using Create React App. Create React App is based on Webpack, a tool which helps process and bundle our various JavaScript, CSS, HTML, and image files. We’ll explore Creating React App in-depth in the module “Using Webpack with Create React App.” You’ll also build Single Page Applications (SPA), create robust routing with error handling, and explore both class and functional reusable components.

 

GK# 8443 Vendor# TT4193
Vendor Credits:
No matching courses available.
Start learning as soon as today! Click Add To Cart to continue shopping or Buy Now to check out immediately.
Access Period:
Scheduling a custom training event for your team is fast and easy! Click here to get started.
$
Your Selections:
Location:
Access Period:
No available dates
Add To Cart

BUY NOW

Request a quote

Who Should Attend?

Web Developers

What You'll Learn

Join an engaging hands-on learning environment, where you’ll learn:

  • A basic and advanced understanding of React components
  • An advanced and in-depth knowledge of how React works
  • A complete understanding of using Redux
  • How to build, validate, and populate interactive forms
  • How to use inline styles for perfect looking components
  • How to test React components
  • How to build and use components
  • How to get control of your build process

This course has a 50% hands-on labs to 50% lecture ratio with engaging instruction, demos, group discussions, labs, and project work.

 

Course Outline

ES6 Primer

  • Prefer const and let over var
  • Arrow functions
  • Modules
  • Object.assign()
  • Template literals
  • The spread operator and Rest parameters
  • Enhanced object literals
  • Default arguments
  • Destructuring assignments

Your First React Web Application

  • Setting up your development environment
    • Code editor
    • Node.js and npm
    • Install Git
    • Browser
  • JavaScript ES6 /ES7
  • Getting started
    • Sample Code
    • Previewing the application
    • Prepare the app
  • What’s a component?
    • Our first component
    • JSX
    • The developer console
    • Babel
    • ReactDOM.render()
  • Building The App
  • Making The App data-driven
    • The data model
    • Using props
    • Rendering multiple products
  • Your app’s first interaction
    • Propagating the event
    • Binding custom component methods
    • Using state
    • Setting state with this.setState()
    • Updating state and immutability
    • Refactoring with the Babel plugin transform-class-properties
    • Babel plugins and presets
    • Property initializers
    • Refactoring The App
    • Refactoring The List

JSX and the Virtual DOM

  • React Uses a Virtual DOM
  • Why Not Modify the Actual DOM?
  • What is a Virtual DOM?
  • Virtual DOM Pieces
  • ReactElement
    • Experimenting with ReactElement
    • Rendering Our ReactElement
    • Adding Text (with children)
    • ReactDOM.render()

JSX

  • Creates Elements
  • Attribute Expressions
  • Conditional Child Expressions
  • Boolean Attributes
  • Comments
  • Spread Syntax
  • Gotchas
  • Summary
BUY NOW

Prerequisites

Before attending this course, you should be familiar with CSS, HTML5, and JavaScript.