Isomorphic React

This course will teach you how to build high-performance and secure isomorphic React applications.
Course info
Rating
(33)
Level
Intermediate
Updated
Jan 11, 2018
Duration
2h 44m
Table of contents
Description
Course info
Rating
(33)
Level
Intermediate
Updated
Jan 11, 2018
Duration
2h 44m
Description

Reducing user latency and increasing security are just a few of the reasons for why React is such a tremendous tool for isomorphic rendering. In this course, Isomorphic React, you'll learn how to build an isomorphic React application from start to finish. First, you’ll learn what isomorphic code is and link this idea to React. Next, you’ll explore the specific isomorphic features of React, including the ReactDOM library. Finally you’ll create a flexible isomorphic foundation upon which you will build a React application. When you’re finished with this course, you’ll have a solid understanding of the React framework.

About the author
About the author

Daniel Stern is a freelance web developer from Toronto, Ontario who specializes in Angular, ES6, TypeScript and React. His work has been featured in CSS Weekly, JavaScript Weekly and at Full Stack Conf in England.

More from the author
Vue.js: Big Picture
Beginner
1h 6m
31 Aug 2018
Testing React Applications with Jest
Intermediate
3h 36m
11 May 2018
Redux Saga
Advanced
2h 54m
21 Aug 2017
More courses by Daniel Stern
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
Greetings all. I'm Daniel Stern, also known as the code whisperer, and welcome to my course Isomorphic React. I'm a self-employed web developer and software engineer from Toronto, Canada. React is one of the world's top front-end frameworks with over 80, 000 stars on GitHub. In this course, we're going to learn how to build an isomorphic application using React that can be rendered both in the client and on the server. Some of the major topics that we'll cover include creating a modern, single page React application using React Router and Redux, rendering React applications on the server using Express, and on-demand data fetching with Redux Saga. By the end of this course, you'll know how to render a React application both on the server and in the client, how to hydrate a server-rendered React application so that it comes alive on the client, how to create custom scaffolding for a React application using Bable, Webpack, and Express, and so much more. Before beginning this course, you should be familiar with JavaScript and have a basic understanding of Node and React. From here, you can continue your learning about React with courses on managing application state with Redux, testing React with Jest, and handling your React side effects with Redux Saga, all of which are currently available on Pluralsight. I hope you'll join me in your journey to learn React with Isomorphic React at Pluralsight.

Course Introduction
Hello and welcome. I am Daniel Stern. Of course, you may know me as the code whisperer. And in this course, entitled Isomorphic React, we're going to be building a React application with full server-side Rendering capabilities and much more. Let's take a look at some of the course highlights that you can expect. First, we'll be using cutting-edge libraries to build this application. I went through great effort to study all the top existing boilerplates and determine what the most cutting-edge and latest technologies were, and we'll be implementing all of them. The application that we're building will be fully production ready. That means you can deploy it to the cloud and have a real application. But it also has full development support, which will support hot reloading and much more. We're going to have full server-side rendering support. That means when the application loads up, the server's going to take a lot of the rendering load off of the client. But what's exciting is we'll be using React Router to fully server render our roots and using React to figure out what the output should be. Finally, we've targeted efficient development. That means developer features that help you out, like using the latest version of ECMAScript or having hot reloading, are all in there. In this case, hot reloading allows our application to refresh without the actual page having to refresh. It's really useful and we'll be implementing it as we build this application. In the next clip, we'll have a look at what the goals for our application are going to be.