Server Side Rendering with React and Redux

Server Side Rendering with React and Redux, available at $89.99, has an average rating of 4.67, with 96 lectures, based on 3769 reviews, and has 26256 subscribers.

You will learn about Understand the challenges of Server Side Rendering Build a server side rendering boilerplate project Use React, Redux, and React Router to conquer Search Engine Optimization Master techniques for data loading on the server Construct server architectures that can easily scale for large apps This course is ideal for individuals who are Engineers looking to build new apps with server side rendering or Engineers who wants to understand the challenges of Isomorphic Javascript It is particularly useful for Engineers looking to build new apps with server side rendering or Engineers who wants to understand the challenges of Isomorphic Javascript.

Enroll now: Server Side Rendering with React and Redux

Summary

Title: Server Side Rendering with React and Redux

Price: $89.99

Average Rating: 4.67

Number of Lectures: 96

Number of Published Lectures: 95

Number of Curriculum Items: 96

Number of Published Curriculum Objects: 95

Original Price: $29.99

Quality Status: approved

Status: Live

What You Will Learn

Understand the challenges of Server Side Rendering
Build a server side rendering boilerplate project
Use React, Redux, and React Router to conquer Search Engine Optimization
Master techniques for data loading on the server
Construct server architectures that can easily scale for large apps

Who Should Attend

Engineers looking to build new apps with server side rendering
Engineers who wants to understand the challenges of Isomorphic Javascript

Target Audiences

Engineers looking to build new apps with server side rendering
Engineers who wants to understand the challenges of Isomorphic Javascript

Note: This course assumes you’ve got the basics of React, Redux, and Express down. Check out my course ‘Node with React’, its the perfect preparation!

Go beyond the basics of React and Redux! This course will teach you to combine the ultra-popular React v16, Redux, React Router, and Express technologies to build a server-side-rendered web application.

All of my courses are ‘learn-by-doing’: no boring endless lectures with Powerpoints, only live, interactive coding examples. In this course we’ll build one application that profiles the challenges of server side rendering with React, Redux, React Router, and Express. By putting each concept into a real app, you’ll get a better idea of when to use each unique and powerful feature.

Ever wonder why there are so few courses online that teach server side rendering techniques? Sure, there are blog posts that show a tiny portion of a server side rendered app, but there are nearly no resources online to give you the full server side rendering experience from start to finish. This course is the most complete resource online for learning about exactly why server side rendering is so challenging. You’ll learn the biggest hurdles, along with multiple solutions to each major problem, giving you the toolset you need to tackle server side rendering techniques in your own applications.

Here’s what we’ll learn:

Learn the architectural considerations of building a server side rendered app
Connect a Webpack-powered front and and backend app together
Communicate data from your server to client using Redux initial state to your React application
Secure your application from common XSS attacks caused by state rehydration
Understand how to route user requests on the front end with React Router and on the backend with Express
Handle errors and redirects properly that occur during the server rendering process
Authenticate your users with cookie-based authentication during the server rendering phase
Understand why JWT’s are not appropriate for use in a server rendered app
Enhance authentication flows in your app with Google OAuth authentication

I’ve built the course that I would have wanted to take when I was learning to build server side rendered apps. A course that explains the concepts and how they’re implemented in the best order for you to learn and deeply understand them.

Course Curriculum

Chapter 1: Getting Started

Lecture 1: A Few Notes

Lecture 2: Course Resources

Lecture 3: Join Our Community!

Lecture 4: Why Server Side Rendering?

Lecture 5: SSR Overview

Chapter 2: Let's Get Coding!

Lecture 1: App Overview

Lecture 2: Server Architecture Approach

Lecture 3: Starter Package.Json File

Lecture 4: Boilerplate Setup

Lecture 5: Express Setup

Lecture 6: The RenderToString Function

Lecture 7: JSX on the Server

Lecture 8: Server Side Webpack

Lecture 9: Breather and Review

Chapter 3: Server Configuration

Lecture 1: Rebuilding and Restarting

Lecture 2: Server Side Rendering, Isomorphic Javascript, Universal Javascript

Lecture 3: Client Side JS

Lecture 4: Client Bundles

Lecture 5: The Public Directory

Lecture 6: Why Client.js?

Lecture 7: Client Bootup

Chapter 4: Refactoring for Cleaner Code

Lecture 1: Merging Webpack Config

Lecture 2: Single Script Startup

Lecture 3: Ignoring Files with Webpack

Lecture 4: Renderer Helper

Chapter 5: Adding Navigation

Lecture 1: Implementing React Router Support

Lecture 2: BrowserRouter vs StaticRouter

Lecture 3: Route Configuration

Lecture 4: HTML Mismatch

Lecture 5: More on Route Configuration

Lecture 6: Routing Tiers

Chapter 6: Integrating Support for Redux

Lecture 1: The Users API

Lecture 2: Four Big Challenges

Lecture 3: Browser Store Creation

Lecture 4: Server Store Creation

Lecture 5: FetchUsers Action Creator

Lecture 6: The Users Reducer

Lecture 7: Reducer Imports

Lecture 8: UsersList Component

Lecture 9: Babel Polyfill

Chapter 7: Server Side Data Loading

Lecture 1: Detecting Data Load Completion

Lecture 2: Solution #1 for Data Loading

Lecture 3: Solution #2 for Data Loading

Lecture 4: The React Router Config Library

Lecture 5: Updating Route Uses

Lecture 6: The MatchRoutes Function

Lecture 7: LoadData Functions

Lecture 8: Store Dispatch

Lecture 9: Waiting for Data Load Completion

Lecture 10: Breather and Review

Chapter 8: Organization with Page Components

Lecture 1: The Page Approach

Lecture 2: Refactoring to Pages

Lecture 3: Refactoring Page Exports

Lecture 4: Client State Rehydration

Lecture 5: More on Client State Rehydration

Lecture 6: Dumping State to Templates

Lecture 7: Mitigating XSS Attacks

Chapter 9: Authentication in a Server Side Rendering World

Lecture 1: Authentication Issues

Lecture 2: Authentication via Proxy

Lecture 3: Why Not JWT's?

Lecture 4: Proxy Setup

Lecture 5: Renderer to API Communication

Lecture 6: Axios Instances with Redux Thunk

Lecture 7: Client Axios Instance

Lecture 8: Server Axios Instance

Lecture 9: The Header Component

Lecture 10: Adding an App Component

Lecture 11: Building the Header

Lecture 12: Fetching Auth Status

Lecture 13: Calling FetchCurrentUser

Lecture 14: Connecting the Header

Lecture 15: Header Customization

Lecture 16: Header Styling

Chapter 10: Error Handling

Lecture 1: 404 Not Found Pages

Lecture 2: Implementing the NotFound Page

Lecture 3: StaticRouter Context

Lecture 4: The Admin Feature

Lecture 5: Admins Action Creator and Reducer

Lecture 6: Admins Route Component

Lecture 7: Testing Admins Route

Lecture 8: Promise.all Failures

Lecture 9: Error Handling Solution #1

Lecture 10: Error Handling Solution #2

Lecture 11: Error Handling Solution #3

Lecture 12: The Require Auth Component

Lecture 13: Implementing Require Auth

Lecture 14: Require Auth in Use

Lecture 15: Handling Redirects

Chapter 11: Adding Better SEO Support

Lecture 1: Meta Tags

Instructors

Stephen Grider
Engineering Architect

Rating Distribution

1 stars: 18 votes
2 stars: 21 votes
3 stars: 158 votes
4 stars: 879 votes
5 stars: 2691 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!

Menu