Supporting a minimum width on a website

Question

How do I ensure that my app only renders on a minimum screen width of 1300 pixels. Anything less than that should redirect the user to a fixed web page, something like a 404. This is a React app and I'm using a standard root div to render components inside a index.html.

Answer 1

if you are using reactjs, you can try this out.

window.addEventListener('load', () => {
  const width = screen.width;
  if (width > 1300) {
    render((
      <SomeComponent />
    ), document.getElementById('root'));
  }
  else {
    render((
      <div>404 not found </div>
    ), document.getElementById('root'));
  }
});