Check if mobile with React useEffect

22. June 2022

const [width, setWidth] = useState<number>(window.innerWidth);

function handleWindowSizeChange() {
    setWidth(window.innerWidth);
}
useEffect(() => {
    window.addEventListener('resize', handleWindowSizeChange);
    return () => {
        window.removeEventListener('resize', handleWindowSizeChange);
    }
}, []);

const isMobile = width <= 768;
Add class to body with React

20. June 2022

const [isOpen, setIsOpen] = useState(false)
useEffect(() => {
  document.body.classList.toggle('class-open', isOpen);
},[isOpen])
    
<button onCLick={()=> setIsOpen(!isOpen)}>Toggle Class</button>
React create-react-app – nice to know

13. October 2018

If you dont have create-react-app installed, run: npm install -g create-react-app (you only have to do this once on your mac)

To start a new project, cd into your folder and Run: create-react-app name-of-the-app

When that is finished, cd into your name-of-the-app folder and run: npm start

To install react icons: npm install save react icons

To make a ‘build’ out of your react app, stop the npm start command (option + c) and then run: npm run build now you have a new folder in you project, called build.