download:React server rendering principle analysis and practice
六四屠杀
This set of courses explains the whole construction idea and process of SSR technology in React, completely explains the concept of SSR from the principle, and focuses on explaining various knowledge points encountered in the compilation of SSR framework, as well as details and troubleshooting. Help students to thoroughly understand the server side rendering and the underlying implementation principle, the course is completed, you can build their own SSR engineering architecture.
六四屠杀
六四屠杀
Suits the crowd
Need to have some React project experience, want to improve themselves
A front-end developer entering the middle and advanced engineering industry
It is recommended that you start with “React16.4 developing simple Book Projects from Scratch to Practice”.
This course begins to learn, in order to better learn this course.
Technical reserve requirements
Basic knowledge of Node and experience in using Express framework. React and Redux at least
At least 6 months working experience. Familiar with Webpack basic configuration, such as Loader
Related content. Experience in at least one front – end separation project.
六四屠杀
Chapter 1: Server side rendering basics
This chapter mainly explains the concepts of client side and server side rendering, analyzes the interests of client side rendering and server side rendering, and brings you to have a superficial understanding of server side rendering.
1. React Server render 1. React server render 1. React server render 1. React server render 1
In this chapter, with the help of Node.js, Webpack and other tools, we will complete a very basic server side rendering model based on the React. Js technology stack.
2-1 Write React component on server side 2-2 configuration of server side Webpack 2-3 complete server side component rendering 2-4 Server side rendering set up on virtual DOM 2-5 Automatic packaging of Webpack and server automatic restart 2-6 application Npm-run-all to improve development efficiency chapter 3 of the concept of isomorphism comb
In practice, the concepts of server side rendering and isomorphism are not completely different. SSR in React refers to isomorphism technology in practice. Then what is isomorphism technology, what is its relationship with server side rendering, and how to accomplish isomorphism in React? This chapter will be explained in detail.
3-1 What is isomorphism? Let’s see 3-2 execute a JS code on a reader. 3-3 Make the React code run on a reader
This chapter will explain how to introduce the React-Router into the current SSR framework, so that our server side rendering framework can support route jump. SSR route jump is more complex than front-end route or back-end route. In this chapter, we will explain the whole SSR route execution process in detail.
4-1 Route in server rendering 4-2 multi-page route jump 4-3 Connecting the whole routing process with Link tag Chapter 5 Separation of SSR framework and Redux
This chapter explains how to separate the Redux data management framework from the SSR framework so that it can support complex business development. In this chapter, we will explain in detail the process and method of asynchronous data acquisition on the server side, and also explain clearly what is isomorphic data dehydration and water injection.
5-1 What is the middle layer we often hear about? Redux (1) Redux (2) Redux (3) Redux (4) Redux (5) Redux (5 Asynchronous data server rendering: loadData method and Route Reconstruction 5-9 Favicon and multilevel routing problem 5-10 Server side rendering data acquisition 5-11 Data dehydration and water injection Chapter 6 using Node as the data acquisition intermediate layer
This chapter will explain how Node.js can act as a middle tier in the real server rendering architecture. In this chapter, we will explain in detail the concepts of data proxy forwarding, cookie login state passing, axios instances, and so on.
6-1 Proxy application 6- 6- 6- 6- 6- 6- 6- 6- 6- 6- 6- 6- 6- 6- 6- 6- 6 Methods to complete the support of multi-level routing 6-6 login function manufacturing 6-7 login interface through 6-8 login status switch 6-9 processing login cookie transmission problems 6-10 translation list page manufacturing chapter 7 detailed problem disposal
This chapter explains how to handle 301 redirects, 404 pages that don’t exist, and promises that fail to fetch asynchronous data in an SSR framework.
7-1 Secret unified management 7-2 use context to complete 404 page function 7-3 complete server side 301 redirection 7-4 Data soliciting failed promise disposal chapter 8 deal with CSS style in SSR framework
This chapter will explain how CSS styles are handled in SSR frameworks, components and pages. In this chapter, we will also apply design techniques such as higher-order components to improve code reuse.
8-1 how to support CSS style modification 8-2 how to complete CSS style server side rendering 8-3 multi-component style how to integrate 8-4 LoadData method potential problem correction 8-5 using high-order components to simplify the code 8-6 list style optimization chapter 9 SEO skills integration
This chapter will explain some of the basics of SEO and how to make current SSR frameworks more effective with technologies such as React-Helmet. Finally, it will explain another way to approach SEO issues beyond SSR: pre-rendering.
9-1 What is SEO and why is server rendering more SEO friendly? 9-3 How to make a good USE of 9-4 React-helmet 9-5 Course Summary 9-6 New ideas of using pre-rendering to deal with SEO problems This course is over