Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

egghead.io

Build a Server Rendered + Code Split App in React with React Universal Component

via egghead.io

Overview

In this course, you will be learn how to get your react app to load as quickly as possible to maximize user engagement—we need faster rendering speed and smaller network requests!
You’ll learn how to both split code into lazily loaded bundles AND server-side render your page.
This has not been possible until very recently—you had to choose either code-splitting or SSR. Sure you have Next.js which is awesome, but it’s a framework that you need to buy into. With react-universal-component you are getting a framework-less Next.js that is in your control!
The react-universal-component library does a great job making it as simple as can be, but there are still various specific configurations and practices that must be followed to get it working. So watch the videos to learn how it’s done!

Syllabus

  • Install the NPM Dependencies Needed for a Universal React App
  • Configure Webpack to Work with React Universal Component
  • Configure Express / React / Babel to Work with React Universal Component
  • Configure hot module reloading to work with react-universal-component
  • Code-Splitting Components with the Universal Higher-Order Component
  • Dynamically Load a Code-Split Universal React Component via a Prop
  • Configure a Custom Universal React Loading Component
  • Animate a Universal React Loading Component using Delay Options and Component Hooks
  • Set an Error Component in React Universal when a Component Fails to Load
  • Preload a Universal Component On-Demand with the Preload Method
  • Load a Universal React Named Exported Component with the Key Option
  • Add Redux with Server-to-Client State Hydration to a React Universal Project
  • Lazy Load Redux Reducers with Code-split Universal React Components using onLoad

Taught by

Tim Kindberg

Reviews

4.5 rating at egghead.io based on 54 ratings

Start your review of Build a Server Rendered + Code Split App in React with React Universal Component

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.