best-practices-for-isomorphic-web-applications
Best practices for isomorphic web applications
| Best Practice |
Section |
|---|---|
| Set up webpack to be ready for production use. | 5.5.2 |
| Build React components that can be composed, increasing the reusability of your code. | 4.3.1, 4.3.2 |
| Ensure your state is immutable when using Redux by using the spread operator (...) pattern. | 6.3.1 |
| Implement routing for the server with React Router. | 7.2.1 |
| Render components on the server with React renderToString. | 7.2.3 |
| Use a static function to indicate the data needs for each container component in the app. | 7.3.2 |
| Serialize the data fetched on the server and attach it to the DOM. | 8.2.1 |
| Deserialize the data provided in the DOM and use it to initialize the state of the app. | 8.2.2 |
| Avoid isomorphic render warnings by using the React lifecycle method componentDidMount. | 8.3.3 |
| Make sure you test your code in all the environments it will run in (server and browser). | 9.1.1, 9.2.1, 9.2.2 |
| Isolate code that can only run in the browser by using environment variables. Webpack allows you to inject them into your browser code (process.env.BROWSER). | 10.1.2, 10.1.3 |
| To manage SEO, use a static function to add metatags to the <head> of the html page on the server. | 10.2.1, 10.2.2 |
| Handle user sessions based on cookies in an isomorphic way. | 11.4.1 |