Blog

Practical notes on building animated React components in Next.js and Tailwind, and on making AI-built apps from v0, Cursor or Lovable look less generic.

  1. Cursor Rules for a Design System: Add UI Without DriftCursor rules for your design system: a scoped .mdc rule with your tokens, a PROMPT.md spec and a drift check, so new components stop breaking your design.AI-built UI · 8 min read
  2. overscroll-behavior contain: Stop Scroll Stealing in ReactUse overscroll-behavior contain the right way: stop tables, carousels and drawers stealing page scroll in React, plus touch-action, wheel listeners and locks.Next.js fixes · 8 min read
  3. useSyncExternalStore getServerSnapshot: Next.js FixuseSyncExternalStore without getServerSnapshot breaks next build. The real error, why it happens, and tested hooks for media query, online and localStorage.Next.js fixes · 7 min read
  4. Next.js Hydration Error from Dates: 5 Tested FixesFix the Next.js hydration error from dates, toLocaleString and Math.random: the real React 19 error text, why prod differs from dev, and five tested fixes.Next.js fixes · 8 min read
  5. Accessible Login Form in React: Labels, Errors, MotionBuild an accessible login form in React and Tailwind: real labels, errors read by screen readers, focus on error, a show/hide password button, reduced motion.Animation · 8 min read
  6. Framer Motion vs CSS Animation for Micro-InteractionsFramer Motion vs CSS animation for micro-interactions: the same toggle built both ways, the bundle cost I measured, and what CSS can now do on its own.Animation · 7 min read
  7. shadcn Registry: Install Third-Party Components by URLHow to use a shadcn registry: install third-party components by URL or @namespace, check what lands in your repo first, and fix the CLI errors you'll hit.AI-built UI · 7 min read
  8. Animated Tabs with Framer Motion in Next.js App RouterAnimated tabs with Framer Motion (now Motion) in the Next.js App Router: a layoutId pill driven by usePathname, accessible and reduced-motion safe.Animation · 8 min read
  9. "use client" Error in Next.js: useState, Context, onClickFix the "use client" error in Next.js App Router: useState only works in a Client Component, createContext, event handlers in props, barrel files and useRef.Next.js fixes · 8 min read
  10. How to Make UI Not Look AI-Generated: A v0 ChecklistHow to make UI not look AI-generated in v0 and shadcn apps: the six visible tells, the code fix for each, and a script that finds them in your repo.AI-built UI · 8 min read