React Isomorphic Boilerplate

Overview

This article is part of a series called “Modular Isomorphic React JS applications”. The focus of Part 1 is on Isomorphic Server & Browser Side Rendering with React >= 0.12. The author discusses how React’s virtual DOM allows for quick and efficient re-renders in the browser. One of React’s strengths is its ability to understand React-rendered HTML on both the server and the browser. The article provides an example of server side rendering using React.renderToString method.

Features

• Utilizes React’s virtual DOM for quick and efficient re-renders in the browser
• Allows for rendering React-rendered HTML on both the server and the browser
• Uses commonJS style require’s and relies on Browserify to convert React dependency into a browser-compatible version

Installation

1. Install Node.js
2. Install npm
3. Install React ^0.12.0 using npm
4. Install react-tools using npm
5. Install Handlebars using npm
6. Install Browserify using npm
7. Convert JSX to JS using React’s tooling: npm run jsx
8. Render the component on the server

Summary

This article discusses Isomorphic Server & Browser Side Rendering with React >= 0.12. It highlights the benefits of using React’s virtual DOM for efficient re-renders in the browser and the ability to render React-rendered HTML on both the server and the browser. The article provides a step-by-step guide for installation and an example of server side rendering using React.renderToString method.