O'Reilly logo
live online training icon Live Online training

Advanced React.JS

Master React's advanced concepts

Samer Buna

Join expert Samer Buna to learn the skills you need to master React. You'll learn how to use React and its surrounding ecosystem of tools to develop full stack applications and gain hands-on experience with advanced concepts like state and route management with Redux and server-side rendering.

What you'll learn-and how you can apply it

  • How to build a maintainable and scalable React application
  • Advanced React concepts, such as component lifecycles, higher-order components, portals, state management, working with routes, and sharing code with the server

And you’ll be able to:

  • Use state containers like Redux and even create your own
  • Work with immutable data and React portals
  • Answer common questions that might be asked in an interview for a senior-level React position

This training course is for you because...

  • You're a programmer who has built a few simple React applications, and you want to learn how to build bigger, more complex applications.
  • You currently work on another frontend framework such as Angular or Ember.js, and you want to learn how React compares.

Prerequisites

  • A working knowledge of modern JavaScript (ES2015 features, objects, arrays, functions, classes, closures, loops, etc.)
  • An intermediate understanding of React (creating components, rendering components, props, state, etc.)

Materials or downloads needed in advance:

  • A machine with a modern browser and Node 8.9.4 or later installed (Please run "node --version" and make sure you see 8.1.4 (or higher).)

Recommended preparation:

About your instructor

  • Samer Buna has over 20 years of experience in software development, during which he has worked on web and mobile applications development, API design, functional programming, optimization, system administration, database management, and scalability. Samer is the author of several technical books and online courses on topics such as Node.js, React, and GraphQL. You can follow his latest work over at jsComplete.com and EdgeCoders.com.

Schedule

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

The Context API, higher-order components (HOCs), and portals (50 minutes) - Lecture and exercises: React’s Context API in the raw and within generic HOCs; presentational and container components; immutable data; working with multiple React portals; loading initial data

Break (10 minutes)

Redux: Why we need it (50 minutes) - Lecture and exercises: How to use the Redux pattern and why it’s needed; Redux flow; actions; reducers; stores; React-Redux bindings; provider; the connect function; mapping state and dispatch to props; async actions

Break (10 minutes)

Routing and server-side rendering (50 minutes) - Lecture and exercises: Babel and webpack; how to do frontend and backend routing with React; how to server-render the content of a React application; hydrating; production builds; performance optimization

Quiz, wrap-up, and Q&A (10 minutes)