The simple guide to server-side rendering React with styled-components

Article by Dennis Brotzky

The goal of this guide is to share the core principles of how to use styled-components in a server side rendered React application. The beauty of styled-components really shines through when you realize how seamless it is to setup in your application. Furthermore, styled-components are easy to integrate into existing applications that are using other methods of styling. In this guide there are no additional libraries such as Redux, React Router, or concepts such as code splitting — let's start with the basics.


Related resources

Building a Blog with Next.js

Next.js is an awesome new framework for building universal React applications. In simple terms, that means you can use React to render templates on the server, as well frontend components the way you're most likely used to. The advantages of this are numerous (shared components, faster rendering, great [continue]

Tutorial by Zach Sherman

Tutorial: SSR Split Testing and Analytics with React, Redux, and Next.js

In this tutorial we will start with an empty Node.js project and walk through the process of building simple split-testing functionality with Next.js, Redux, and seamless analytics by creating custom Redux analytics middleware. This serves dual-purposes. As an introduction to Redux and Next.js, as well [continue]

Tutorial by Patrick Lee Scott

Next.js Crash Course - Server Side React

In this video we will talk about Next.js which is a framework to render React on the server. We will look at setup and build a simple application that pulls Bitcoin pricing from an API and displays it in the app. [continue]

Video Tutorial by Traversy Media

Adding state management with Redux in a CRA + SSR project

This tutorial will explain you how to initialize your Redux store on the server, then pick it up and hydrate it on the client. [continue]

Tutorial by Andrei Duca