Next.js

- Use um conjunto mínimo de hooks para componentes: useState para estado, useEffect para efeitos colaterais, useCallback para manipuladores memoizados e useMemo para valores computados. Confiança: 0.85
- Nunca faça page.tsx um componente cliente. Toda a lógica do lado do cliente reside em componentes sob /components, e page.tsx permanece como um componente servidor. Confiança: 0.85
- Ao persistir estado do lado do cliente, use inicialização preguiçosa com localStorage. Confiança: 0.85
- Sempre use useRef para estado estável e não reativo, especialmente para acesso ao DOM, foco de entrada, medição de elementos, armazenamento de valores mutáveis e gerenciamento de APIs do navegador sem acionar re-renderizações. Confiança: 0.85
- Use classes sr-only para rótulos de acessibilidade. Confiança: 0.85
- Sempre use shadcn/ui como sistema de componentes para projetos Next.js. Confiança: 0.85
- Ao configurar shadcn/ui, certifique-se de que globals.css esteja corretamente configurado com todas as diretivas Tailwind necessárias e variáveis de tema do shadcn. Confiança: 0.70
- Quando um componente crescer além de uma única responsabilidade, divida-o em subcomponentes menores para manter cada arquivo focado e melhorar a legibilidade. Confiança: 0.85
- O estado em si deve acionar a persistência para manter os efeitos colaterais previsíveis, centralizados e sempre sincronizados com a UI. Confiança: 0.85
- Derive novo estado a partir do estado anterior usando atualizações funcionais para evitar closures desatualizadas e garantir a versão mais precisa do estado. Confiança: 0.85