Skip to content

Instantly share code, notes, and snippets.

@SamanthaLFreeman
Last active November 2, 2019 23:22
Show Gist options
  • Save SamanthaLFreeman/c09491913be6005fe93de3f774fec7ea to your computer and use it in GitHub Desktop.
Save SamanthaLFreeman/c09491913be6005fe93de3f774fec7ea to your computer and use it in GitHub Desktop.
Push Yourself assignment - Mod 4

React Hooks Research

During my time at Turing I wanted to research React Hooks outside of the current FE curriculum. From what I had previously gathered, they are considered the current process used by many React developers. Thus steming my interest to learn more about them, so I can further develop my knowledge of React. Prior to my research I understood the basics of React Hooks, which is that they let you use state without writing a Class component. Thus your React components are only built with Functional components.

During my research my big take aways were the useState, useEffect and useContext hooks. The useState hook is the one that I had the most understanding of prior to my research. However, I didn't previously know how exactly the hook would let you use state in a function. It returns a pair of values; the current state and a function which will update the state. To define the current value of the state we pass it as an argument in the useState() method. Instead of using setState, we use the function for updating the state which the user can define the name (usually starts with "set" followed by the name of the current state).

The next hook I researched was the useEffect hook, which lets you perform side effects in functional components. For example, instead of using a componentDidMount for fetching data, you would need useEffect to tell React that your component needs to update after it renders. React remembers the function passed and will call if after performing the DOM updates. This is one case example, however you can have many effects and no longer need to use the different lifecycle methods included with Class components. The last hook I researched was the useContext hook, which lets you use global variables. With useContext you can define an initial value, then wrap components with Provider tags so any child components will have access to the context value. This hook also works with sharing the useState hook with child components.

After completing my research, I would love to take an existing project and change from using Class components to hooks. I think that would be the best way to further cement my learning and help demonstrate what I have learned on my own. I also see this as an opportunity to express my willingness to further develop my skills with React when I have interviews. I already enjoy the framework, so I can express that this enjoyment has led to my wish to understand the current trends and an interest in learning both the past and future of this framework.

Resources

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment