Skip to content
O'Reilly home
Career Development

React in 4 Hours

Published by Pearson

Kickstart Your React Web Application Development Skills

Feb. 7, 2022

5 - 9 p.m. Coordinated Universal Time

169 Spots Remaining

Sign up for a free trial!

or sign in.

Registration closes Feb. 6, 2022 11 p.m. Coordinated Universal Time

What you’ll learn and how you can apply it

  • React architectural concepts
  • Creating components
  • Using JSX
  • Creating modular applications
  • Managing properties and state
  • Using component techniques

This live event is for you because…

  • You’re a front-end developer and you want to start using React to create lean and mean web applications
  • You have experience with another front-end frameworks such as Angular or Vue.js, and you want to learn how React is different


  • Familiarity with ECMAScript 6 or above
  • Experience with HTML and CSS

Course Set-up

Recommended Preparation

Recommended Follow-up


The timeframes are only estimates and may vary according to how the class is progressing.

Segment 1: Getting Started with React Length (10 min)

  • What is React?
  • Characteristics of React
  • Tooling up
  • React and ECMAScript 6++

Segment 2: Creating a React Web Application Length (50 min)

  • Creating a simple React application
  • Creating multiple React elements
  • Creating multiple React elements from data
  • Creating React elements using ReactDOMFactories
  • Example: Creating a React baseline web application

Break Length (5min)

Segment 3: Creating Components Length (45 min)

  • Overview of React components
  • Creating components using inheritance
  • Creating functional stateless components
  • Creating components using factories
  • Example: Adding components to the web application

Break Length (5 min)

Segment 4: Creating Elements using JSX Length (30 min)

  • Overview of JSX
  • Understanding JSX syntax
  • Example: Using JSX in the web application

Segment 5: Creating Modular Applications Length (30 min)

  • The need for modularity
  • Understanding Webpack
  • Example: Creating an application using Webpack

Break Length (5 min)

Segment 6: Properties and State Length (30 min)

  • Specifying types for properties
  • Working with ES6 classes
  • Working with stateless functional components
  • Example: Application with properties and state

Segment 7: Component Techniques Length (30 min)

  • Component lifecycle methods
  • Effect hooks
  • Memoization
  • Example: Applying component techniques effectively

Course wrap-up and next steps

Your Instructor

  • Andy Olsen

    Andy is a freelance consultant, instructor, and developer with more than 30 years of experience in IT. Andy began his professional career as a C/C++ developer and morphed into Java, C#, and other languages as the years and decades passed by. Andy is actively involved in a wide range of technologies including full-stack development, cloud native applications, data science, and more. Andy is passionate about technology education and runs training courses around the world across diverse market sectors.

Start your free 10-day trial

Get started

Want to learn more at events like these?

Get full access to O'Reilly online learning for 10 days—free.

  • checkmark50k+ videos, live online training, learning paths, books, and more.
  • checkmarkBuild playlists of content to share with friends and colleagues.
  • checkmarkLearn anywhere with our iOS and Android apps.
Start Free TrialNo credit card required.