Piero Divasto
Full-stack developer
Hooks
Piero Divasto
Full-stack Developer
Nisum
https://www.youtube.com/watch?v=dpw9EHDh2bM
Problemas
Reuso de código
Componentes muy grandes
Clases complejas
Problemas
Reuso de código
High-order components
Problemas
Reuso de código
Render props
Problemas
Reuso de código
Wrapping Hell!
Problemas
Componentes muy grandes & Clases Complejas
Código esparcido por todos lados (lifecycle methods)
Dificil de entender y seguir la lógica
Clases afectan perfomance
Demasiado boilerplate, binding, etc.
React doesn't provide a stateful primitive simpler than class component
Hooks
Hooks
Hooks are functions that let you “hook into” React state and lifecycle features from function components.
Hooks
Hooks
Hooks
Built-in Hooks
- Basic Hooks
- useState
- useEffect
- useContext
-
Additional Hooks
- useReducer
- useCallback
- useMemo
- useRef
- useImperativeMethods
- useMutationEffect
- useLayoutEffect
Demo
Ventajas
Menos boilerplate
Baja la necesidad de hacer class-based components
Mejora el reuso de código
Baja la complejidad
Mejor Separation of Concern
Ventajas
Fuente: https://bit.ly/2r4JXFc
Ventajas
Fuente: https://bit.ly/2Q4e3HW
Muchas gracias!
http://github.com/morph3o
https://medium.com/@pierodivasto
https://www.linkedin.com/in/pierodivasto
Bibliografía
https://reactjs.org/docs/hooks-overview.html
https://reactjs.org/docs/hooks-state.html
https://reactjs.org/docs/hooks-effect.html
https://medium.com/@dan_abramov/making-sense-of-react-hooks-fdbde8803889
https://www.youtube.com/watch?v=dpw9EHDh2bM
https://github.com/reactjs/rfcs/pull/68
https://github.com/reactjs/rfcs/blob/master/text/0068-react-hooks.md
Hooks
By Piero Divasto
Hooks
Presentación sobre Hooks en React.
