react-hooks-nycoders

Installation

npm:

% cd [project directory]
% npm install

yarn:

% cd [project directory]
% yarn

Execution

npm:

% cd [project directory]
% npm start

yarn:

% cd [project directory]
% yarn start

URLs

• Front-End
• Back-End

React Hooks

Hooks allows you to add state and other React features to functional components. We'll learn how to take an existing React app with class components, refactor it to functional components and implement the use of Hooks.

What we'll learn:

useState

How the useState Hook allows you to add state to function components.

useEffect

How the useEffect Hook lets you add side effects to your function components. And replace lifecycle methods like: componentDidMount, componentDidUpdate and componentWillUnmount.

and, if we have time:

Context API and useContext

React Context API is a way to essentially create global variables that can be passed around in a React app. This is the alternative to "prop drilling", or passing props from grandparent to parent to child, and so on. Context is often touted as a simpler, lighter solution to using Redux for state management.

useMemo

In React, memoization optimizes our components, avoiding complex re-rendering when it isn’t intended. useMemo has a similar usage in preventing unnecessary re-renders.

useRef

Accessing the DOM nodes or React elements.