Skip Main Navigation

Migrating to React Hooks Minishop

Learn how to migrate to React Hooks from classes for a better way to develop components and manage state in React applications

React is continually improving and evolving. React Hooks are a leap forward in how we develop components and manage state in our React applications. Now you can use state and other React features without having to write a class!

Many React developers have switched from classes to React Hooks and are realizing the benefits of understanding their apps better because:

  • Related logic is now located together
  • Less code is needed compared to the equivalent class
  • Function components better align with React’s mental model
  • Hooks are just awesome! 🎉

Do you have a codebase filled with class components? You could leave it that way, but it will become increasingly more “legacy” as time continues to pass by. Why not change now?

Is your team still not developing with React hooks? The longer you stick with the “old way,” the harder it will be to change when you need to. Why not change now?

Hi, I’m Ben Ilegbodu 👋🏾. In this minishop, not only will you learn the ins and outs of React Hooks, but also how to switch to React Hooks from class lifecycle methods, bringing your codebase and your team into the modern React era.

Get ready to…

  • Switch from setState to the useState hook
  • Make API calls with the useEffect hook instead of the componentDidMount, componentDidUpdate & componentWillUnmount lifecycle class methods
  • Create custom hooks to reuse and compose logic
  • Use function closures instead of this & .bind for callbacks and event handlers
  • …and many other features to help you write modern React code

You’ll need to have…

  • Prior experience building React applications, specifically using classes
  • Experience with modern JavaScript syntax and asynchronous patterns like Promise & async/await

This minishop may not be for you if you…

Code of Conduct

By participating in this minishop, you are agreeing to the Minishop Code of Conduct.

What are “minishops”?

Minishops by Ben Ilegbodu are fully-remote workshops that last about 3 hours. They’re highly-focused, covering only the concepts you want to learn so that you can level up your skills and get on with the rest of your day. By keeping it short, you’re able to absorb and retain the information before fatigue sets in and other distractions get in your way.

To learn more about minishops, read the Introducing Minishops blog post.

Questions

If you have questions about the minishop, feel free to email us at team@benmvp.com.

Past learners ❤️ Migrating to React Hooks!

  • Melissa
    Melissa

    Tuesday, July 21, 2020 - Everything was great! I've seen hooks in our code a little but wanted something to really help my understanding of when to use them and how they work. The pace was great and a great mix of teaching and exercises to keep everyone engaged. I'll definitely be finishing up the bonus exercises and the final quiz over the next few weeks!

  • K
    Kathleen

    Tuesday, July 21, 2020 - There was a *lot* covered in this workshop! The one thing I was really glad to see is the format of the workshop. First we listened to you teach, heard the 'whys' of all the principles, then could practice, and if we didn't finish in time (or needed more visual cues), there were written solutions in addition to the written lessons in the repo. I also really enjoyed some of the smaller nuances in each lessons, like hearing the term 'lazy initialization', for useState optimization. The mention of localStorage and its use cases. The use 'dependency array' and 'memoization' when talking about useEffect. The term 'subscription' when talking about events (most documentation doesn't dig into what 'subscription' means). It's these small touches, and subtle explanations that help any developer that has been working in environments that don't prioritize mentorship make some really impactful breakthroughs in their learning path.

  • Emily
    Emily

    Tuesday, July 21, 2020 - I really liked your open style, and that we could ask questions at any time. It's really a refreshing change to consuming already made videos for learning a new concept. The projects were just right to implement what you had explained, as you had comments to lead us as well.

Subscribe to the Newsletter

Get notified about new blog posts, minishops & other goodies

Learning ES6 | AMA | RSS

Ben Ilegbodu

© 2015 — 2023, Ben Ilegbodu. All rights reserved. 2 Cor 5:17

Built using Gatsby and deployed to Vercel. The source code is hosted on Github.