React Clean UI

Keep React UI components clean; move logic into hooks and services

majiayu000 Updated 567 repo stars

File contents

What I do

Je fournis des règles pour garder des composants React propres :

  • UI minimaliste (présentation)
  • Logique dans hooks
  • Données via TanStack Query

UI rules

  • Aucun appel réseau dans un composant UI.
  • Aucun mapping DTO complexe dans JSX.
  • Pas de state global implicite : state local ou query cache.

Hook rules

  • Un hook retourne un view-model prêt.
  • Le hook parle aux services via DI.
  • Les side-effects UI (toast, navigation) restent dans hooks/pages.

Example pattern

export function UserPage({ id }: { id: string }) {
  const vm = useUserDetails(id);
  return <UserDetailsView {...vm} />;
}

majiayu000/claude-skill-registry-data/tree/main/data/react-clean-ui commit 98ffff9637

Frequently asked questions

npx skillmds@latest add majiayu000/react-clean-ui