Creating the router

App.jsx

const AppRouter = ({ children }) => {
  const [route, setRoute] = useState("/");

  function push(newRoute) {
    setRoute(newRoute);
  }

  useEffect(() => {
    window.history.pushState({}, "", route);
  }, [route]);

  return (
    <RouterContext.Provider value={{ route, push }}>
      {children}
    </RouterContext.Provider>
  );
};