Render on server with device detection

In case you don't want to generate media queries, which is default Visage behaviour, but you need to render website correctly for the user's device, you need to implement device detection on the server.

Then based on the device, you need to set up is prop on DesignSystem component to say what is the current breakpoint. Also you'll need to send this information in HTML so React hydration will work correctly.

Following example uses node-device-detector with fallback to mobile detection.

PreviousClose listener managerNextRender on server with media queries