Tutorialspoint

Mid-Year Savings Flat 10% OFF, Use Code: MID10

React Server Side Rendering

person icon Maksym Rudnyi

4

React Server Side Rendering

Build React, Redux and React Router V6 app using Server Side Rendering (SSR)

updated on icon Updated on Jul, 2024

language icon Language - English

person icon Maksym Rudnyi

English [CC]

category icon Development,Web Development,React JS

Lectures -33

Duration -2.5 hours

4

price-loader

30-days Money-Back Guarantee

Training 5 or more people ?

Get your team access to 10000+ top Tutorials Point courses anytime, anywhere.

Course Description

Note: This course assumes you've some basic experience with React, Redux, and Express.

Server-side rendering (SSR) is a popular technique for rendering a client-side single page application (SPA) on the server and then sending a fully rendered page to the client. This allows for dynamic components to be served as static HTML markup.


Learn how to use React to solve the first-page download problem that single-page apps (SPAs) have. You'll see how to easily build high-performance web apps that implement Server-Side Rendering (SSR) on every landing page using React v17, Redux v4, React Router v6, and Express.


Here's what you will learn:

  • Learn the architectural considerations of building a Server-Side rendered app;

  • Configure Webpack on the front-end and back-end app together;

  • Communicate data from your server to the client using Redux initial state to your React application

  • 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


At the end of this tutorial, you will have a working project with a Client-Side React application and a Server Side Express application.


This course was verified with Node v16.0.0, npm v7.10.0, react v17.0.1, redux v4.1.2, react-router-dom v6.2.1, @babel/core v7.12.9, webpack v5.10.0, express v4.17.2.

Goals

Our goals:

  • Understand what is Server-Side Rendering (SSR)
  • How to build the project from the scratch
  • Use React, Redux, React Router v6
  • Implement best practices of Search Engine Optimisation (SEO)
  • Implement the different techniques to fetch data on the server
  • Learn how to use React to solve the first-page download problem that single-page apps (SPAs) have

Prerequisites

Prerequisites:

  • This course is not for beginners
  • You must have experience with React, NodeJS, Express, Webpack
React Server Side Rendering

Curriculum

Check out the detailed breakdown of what’s inside the course

Introduction
1 Lectures
  • play icon Introduction 01:47 01:47
Client-side configuration
4 Lectures
Tutorialspoint
Server-side configuration
6 Lectures
Tutorialspoint
Fetch data
18 Lectures
Tutorialspoint
Search engine optimisation
4 Lectures
Tutorialspoint

Instructor Details

Maksym Rudnyi

Maksym Rudnyi

Senior Software Engineer with more than 8 years of production experience in Web Development. Experienced both in frontend and backend technologies.

I would like to share my experience with others. You can find courses in Web Development (Front-end and Back-end) and specifically JavaScript. Use this knowledge to improve yourself as a professional developer.

Keep learning!

Course Certificate

Use your certificate to make a career change or to advance in your current career.

sample Tutorialspoint certificate

Our students work
with the Best

Related Video Courses

View More

Annual Membership

Become a valued member of Tutorials Point and enjoy unlimited access to our vast library of top-rated Video Courses

Subscribe now
Annual Membership

Online Certifications

Master prominent technologies at full length and become a valued certified professional.

Explore Now
Online Certifications

Talk to us

1800-202-0515