React: Server-Side Rendering

React: Server-Side Rendering

English | MP4 | AVC 1280×720 | AAC 48KHz 2ch | 1h 13m | 257 MB

Server-side rendering lets you optimize your applications to use client or server resources depending on network and device circumstances. Old device on a slow network? Render on the server. New device, fast network? You should probably let the client do the work. Some call the resulting architecture “universal,” others “isomorphic,” but the results are smooth. Learn about implementing server-side rendering, or SSR, in your React projects. Emmanuel Henri shows how to set up an SSR project with React and Next.js, add a centralized store with Redux, and configure custom routes with Express and Next.js. He wraps up the course with a discussion of code splitting, which can improve application performance.

Table of Contents

1 Learn server-side rendering with React
2 What you should know
3 SSR What, how, and why
4 Chrome and Firefox tools
5 Install the required libraries and tools
6 Challenge Why would you use SSR
7 Solution Why would you use SSR
8 Introducing Next.js with React
9 Add initial components from template
10 Add data for props
11 Add Redux store and setup
12 Add Redux actions
13 Add Redux reducers
14 Challenge Why use Redux for SSR
15 Solution Why use Redux for SSR
16 Create initial Express or Next.js server
17 Add the Express routes
18 Add links and pages with Express or Next.js
19 Challenge Why use Node or Express for SSR
20 Solution Why use Node or Express for SSR
21 Code splitting in Next.js
22 Other tools available for code splitting
23 Challenge What is the purpose of code splitting
24 Solution What is the purpose of code splitting
25 Next steps