Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

Razzle Material-UI Styled Example

Node.js        Yarn        Razzle        Express

React        Styled Components        Material-UI

⭐ Star and get notified about new releases via email.


  • Razzle
    • Server Side Rendering
    • Hot Module Replacement for both client and server side ReactReact components
    • Up to date JavaScript (ECMAScript 6 (2015)) support
    • Single route static site generation
  • Express server with gzip compression

Getting Started

  • Initial steps
    • Install Node.js and Yarn.
    • Download or clone this repository.
    • Open a command prompt in the project folder.

Install dependencies:

yarn install

Start the server:

yarn start

This command initiates a build process and starts the server in production mode.

Visit http://localhost/ to access the web application.


Start the server in development mode:

yarn dev

Single route static site generation

Generate a static site:

yarn static

Open the index.html within the static folder to access the web application. The folder name can be modified with the RAZZLE_STATIC_PATH environment variable.

Idea behind the example

This project is based on the basic razzle example. This repository also satisfies the following 2 entry points requred by Razzle:

  • src/index.js for the server
  • src/client.js for the browser