Learn React & Material UI - #17 Server-Side Rendering
This video walks you through a server setup for a React SSR app with Material-UI. Using our exercise database SPA as a base, we will build up an Express server to render the app server-side and serve up an HTML payload along with critical CSS. As soon as the client loads up the HTML document, it will quickly display the webpage delivering that sweet and speedy first meaningful paint.
Once the app is viewable to the user, the browser will load up the JS bundle asynchronously behind the scenes without ever blocking the page render. Lastly, React will hydrate the server markup and attach event listeners to DOM nodes with no extraneous re-renders. That's when the user can finally start interacting with the app.
Learn the theory first (a must watch) • What is Server-Side Rendering (and Wh...
Get the starter code from GitHub https://github.com/alex996/react-exer...
Markdown presentation notes https://github.com/alex996/react-exer...
Final code after SSR refactor https://github.com/alex996/react-exer...
Be sure to follow the video very closely. There are a myriad of SSR-related issues in Material-UI on GitHub, and almost all of them are closed because of integration or configuration mistakes on the part of the reporters. SSR setup with MUI is an delicate mater after all, so pay close attention! (I made a couple of typos myself, lol)
Server Rendering https://material-ui.com/guides/server...
Server Rendering with React and React Router v4 from Tyler • Video
(a very, very good SSR tutorial from ground up; I definitely recommend watching it)
CSR is already powered by Webpack, why not use it for SSR? Multiple targets to the rescue https://webpack.js.org/concepts/targe...
Alternative setup with babel-node / babel-cli https://github.com/babel/example-node...
Why we need to exclude deps when bundling https://jlongster.com/Backend-Apps-wi...
And if you want to get closer, follow me on Minds https://minds.com/CodeRealm
Смотрите видео Learn React & Material UI - #17 Server-Side Rendering онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Code Realm 24 Сентябрь 2018, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 20,55 раз и оно понравилось 29 людям.