Reusable State and Effects with React Hooks
1 min read

@Mappletons, Art directory at @eggheadio

This week my latest Egghead.io course was launched entitled, Reusable State and Effects with React Hooks.

Previously, in order to add state or side-effects in React you had to create a Class Component. However, with the introduction of the Hooks proposal (currently pre-released), you can now add state and effects to a Function Component. In addition, you can extract your hook logic and create a custom hook that can be shared across your app.

Course Introduction

The above video is hosted on egghead.io.

🆓 The Reusable State and Effects with React Hooks course is currently free to watch until Sunday December 16th. So, watch today!

Lessons

The following is a list of lessons that are included in this React Hooks course.

  • Environment Setup for React Hooks
  • Add State with the useState Hook to a React Function Component
  • Add Linting to Help Enforce Rules when Using React Hooks
  • Add a Lifecycle Event with the useEffect Hook to a React Function Component
  • Use the React useRef Hook to Reference a DOM Element or Simulate an Instance Variable
  • Write Custom Hooks to Share Logic Between React Function Components
  • Leverage an Existing Community Hook in Your React Function Component
  • Use the useReducer Hook and Dispatch Actions to Update State
  • Use the useContext Hook to Wire-up the React Context API
  • Simulate PureComponent with a React Function Component
  • Leverage the React useMemo Hook for Expensive Operations
  • Convert a Render Props Component using a Custom React Hook

Conclusion

I hope you enjoy the course and find something useful that you can start using in your projects. Remember, you can watch the whole course free for a week!

Edit post on GitHub


Make a zsh function alias to enforce using yarn commands when in a yarn project
Learn about the npx Package Runner