carloluis / use-media-query-hook

react use-media-query-hook

use-media-query-hook

React hook to check when a media query result changes

Demo page

Install

yarn add use-media-query-hook

Usage

import React from 'react';
import useMediaQuery from 'use-media-query';

const App = () => {
  const isMobile = useMediaQuery('(max-width: 425px)')
  return (
    <h1>
      { isMobile ? '📱' : '💻' }
    </h1>
  );
}

Check MDN docs on using media queries