useConsole

A decent part of my day-to-day work is iterating on solving UI "problems" by using , such as web sandboxes / REPLs like . As I iterate on these UI challenges, I tend to want to both look at the UI and also see a feed of the Console from devtools without the rest of the devtools panel taking up space on the screen.

To solve this use case I threw together a quick and dirty useConsole hook that can capture the output of console.log calls and then pipe that into some element that can be rendered on top of the UI.

export function useConsole() {
  let [content, setContent] = useState("");
  useLayoutEffect(() =>