Cursor + Claude: stop shipping flaky UI states
I use Cursor + Claude to generate state diagrams, not random code. I convert UI states into a typed reducer. No more “boolean soup”. I add 1 tiny invariant test that catches most regressions. Works...

Source: DEV Community
I use Cursor + Claude to generate state diagrams, not random code. I convert UI states into a typed reducer. No more “boolean soup”. I add 1 tiny invariant test that catches most regressions. Works for Next.js, React, and even boring CRUD screens. Context I ship a lot of small SaaS apps. Usually solo. Usually fast. And my UI bugs weren’t “hard.” They were dumb. The kind that shows up only after you add one more button. Stuff like: loading spinner stays forever. Save button enables while a request is in flight. Error banner shows on the success screen. Or the classic: isLoading is false but you’re still “saving”. I tried the usual. A couple useStates. Then more. Then a useEffect to “sync” them. Brutal. Spent 4 hours on this once. Most of it was wrong. Now I treat UI like a state machine. Not a library. Just a reducer and strict events. Cursor + Claude help me do it fast. The trick: I don’t ask for code first. I ask for states. 1) I write the states down. Then I force Claude to agree I s