The latest articles on Forem by Nicolas (@parkournick3). https://forem.com/parkournick3 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1379565%2Fb95b2c65-3539-4d85-a906-5272bbe97fd6.png https://forem.com/parkournick3 en Nicolas Mon, 03 Jun 2024 21:59:27 +0000 https://forem.com/parkournick3/principais-hooks-no-react-com-exercicios-46m7 https://forem.com/parkournick3/principais-hooks-no-react-com-exercicios-46m7 <h3> O que são Hooks no React? </h3> <p>De acordo com a <a href="https://pt-br.legacy.reactjs.org/docs/hooks-overview.html">documentação legacy do React</a></p> <blockquote> <p>Hooks são funções que permitem a você “ligar-se” aos recursos de state e ciclo de vida do React a partir de componentes funcionais.</p> </blockquote> <h2> Lista com todos os hooks </h2> <p>Existem vários Hooks Built-in no React ( está na versão <a href="mailto:react@18.3.1">react@18.3.1</a> no momento que estou escrevendo ) sendo eles:</p> <ul> <li>useReducer</li> <li>useContext</li> <li>useRef</li> <li>useImperativeHandle</li> <li>useEffect</li> <li>useLayoutEffect</li> <li>useInsertionEffect</li> <li>useMemo</li> <li>useCallback</li> <li>useTransition</li> <li>useDeferredValue</li> <li>useDebug</li> <li>useId</li> <li>useSyncExternalStore</li> <li>useActionState</li> </ul> <p><a href="https://pt-br.react.dev/reference/react/hooks">https://pt-br.react.dev/reference/react/hooks</a></p> <h2> Regras dos Hooks </h2> <blockquote> <p>Hooks são funções JavaScript, mas eles impões duas regras adicionais:</p> <ul> <li>Apenas chame Hooks no nível mais alto. Não chame Hooks dentro de loops, condições ou funções aninhadas.</li> <li>Apenas chame Hooks de componentes funcionais. Não chame Hooks de funções JavaScript comuns. (Há apenas um outro lugar válido para se chamar Hooks — dentro dos seus próprios Hooks customizados. Iremos aprender sobre eles em breve.)</li> <li>O nome de um Hook deve sempre seguir o formato: useXxxxx</li> </ul> </blockquote> <h2> Exercícios </h2> <p>Entre neste <a href="https://github.com/parkournick3/principais-hooks-react">repositório</a> e modifique os exercícios dentro da pasta "app &gt; exercises"</p> react braziliandevs