Skip to content

Contact sales

By filling out this form and clicking submit, you acknowledge our privacy policy.

Working with React for Javascript Developers

Course Summary

The Working with React for Javascript Developers class is designed to demonstrate the essentials of building UI components with React.

The course begins with an introduction to React and helpful development tools. Next, it examines functional and class-based components. The course concludes with an examination of hooks, patterns and React Router.

Pre-Requisites: ​Students should have some experience with programming in general and working knowledge and practical experience of Modern JavaScript. Some React experience is a plus.

Purpose
 Provide JavaScript developers with the essential knowledge necessary to build UI components with React.
Audience
 Current JavaScript developers looking to learn how to use React in their applications.
Role
Software Developer - Web Developer
Skill Level
Introduction
Style
Workshops
Duration
3 Days
Related Technologies
Front-End Development Training | React

 

Productivity Objectives
  • Understand what React is and what problem it solves
  • Explore the basic architecture of a React component
  • Gain deeper knowledge of React.js components and JSX
  • Utilize React Hooks
  • Learn React.js best practices and common patterns
  • Employ React Routing to build Larger Apps

What You'll Learn:

In the Working with React for Javascript Developers training course, you'll learn:
  • Introduction
    • What is React?
    • What problem does React solve?
    • Development Ecosystem
    • React versus other frameworks
  • Development Tools
    • Create React App project generator
    • React Developer Tools
    • Running and Debugging a React Application
    • Role of Node.js
    • Purpose of React and ReactDOM
  • Functional Components
    • What are Components?
    • Create Element and JSX
    • Benefits of JSX
    • Fragments
    • JavaScript Arrow Functions
    • ES2015 Modules
    • JSX and Expressions
    • Displaying Collections of Data
    • JavaScript Array Maps and React Keys
    • Passing Data with Props
    • Validating Props with PropTypes
    • Default Props
    • Using Memo
  • Class-Based Components
    • JavaScript Classes and Extends
    • Configuring State
    • Lifecycle Methods
    • Context of Event Handlers
    • Class Properties and Class Arrow Functions
    • PropTypes and Default Props on Classes
  • Hooks
    • Overview of Hooks
    • State Hook
    • Effect Hook
    • Ref Hook
    • Callback Hook
  • Other Topics
    • Composition vs. Inheritance
    • Patterns: Specialization, Containment, and Higher Order Components
    • Lifting State Up
    • Forwarding Refs
    • Context
    • Portals
    • Error Boundaries
  • React Router
    • What problem does routing solve?
    • Declarative Routing
    • Connecting Routes and Components
    • Passing Data Between Routes
    • Page Pattern
    • Lazy Loading and Routing
real world content

Real-World Content

Project-focused demos and labs using your tool stack and environment, not some canned "training room" lab.
expert practitioners

Expert Practitioners

Industry experts that bring their battle scars into the classroom.
experiential learning

Experiential Learning

More coding than lecture, coupled with architectural and design discussions.
tailored outlines

Tailored Outlines

One-size-fits-all doesn't apply to training teams. That's where we come in!
“I appreciated the instructor's technique of writing live code examples rather than using fixed slide decks to present the material.”

VMware

Dive in and learn more

When transforming your workforce, it's important to have expert advice and tailored solutions. We can help. Tell us your unique needs and we'll explore ways to address them.

Let's chat

By filling out this form and clicking submit, you acknowledge our privacy policy.