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.