Refactoring to React Hooks you own this product

basics of JavaScript • basics of frontend development workflow and tooling • basics of React • basics of modern frontend development
skills learned
creating React components with state • fetching data with React Hooks • handling complex state changes with React Hooks • handling application’s state with React Context API • mocking API data in the frontend
Valentino Gagliardi
5 weeks · 7-10 hours per week · INTERMEDIATE
filed under

placing your order...

Don't refresh or navigate away from the page.
liveProject liveProjects give you the opportunity to learn new skills by completing real-world challenges in your local development environment. Solve practical problems, write working code, and analyze real data—with liveProject, you learn by doing. These self-paced projects also come with full liveBook access to select books for 90 days plus permanent access to other select Manning products. $44.99 $49.99 you save $5 (10%)
Refactoring to React Hooks (liveProject) added to cart
continue shopping
adding to cart

choose your plan


only $41.67 per month
  • five seats for your team
  • access to all Manning books, MEAPs, liveVideos, liveProjects, and audiobooks!
  • choose another free eBook every time you renew
  • choose twelve free eBooks per year
  • exclusive 50% discount on all purchases
  • Refactoring to React Hooks eBook for free
Look inside
With a brand new grant from the finance department, biotech company SphereCell has hired a new frontend web developer — you! Your boss wastes no time laying out your first project: completely refactor SphereCell’s sales trends dashboard.

The goals of this refactoring are to modernize the dashboard, reduce technical debt with future-proof code, and improve its maintainability. Your boss has also mentioned that SphereCell will soon need another new dashboard for an upcoming subscription service, so you’ve decided to use React Hooks to ensure the work you do will be easily reusable.

Your challenges will include migrating the existing codebase and data fetching logic to React Hooks, move the application’s state to the React Context API, and make sure everything is robust and working with automated tests.
This project is designed for learning purposes and is not a complete, production-ready application or solution.

liveProject mentor Bernard Fuentes shares what he likes about the Manning liveProject platform.

book resources

When you start your liveProject, you get full access to the following books for 90 days.

project author

Valentino Gagliardi
Valentino Gagliardi is a freelance consultant with many years of experience in the IT industry. He spent the last 8 years as a front-end consultant, providing advice and help, coaching and training on JavaScript and React. He worked as an instructor for many training agencies around the country, running in-person workshops and creating learning paths for aspiring developers. Author of "The Little JavaScript Book", he loves to share his knowledge on his blog with tutorials reaching over 100k monthly visits. Avid Django user, he is active in the Python community as a speaker, and as a coach for Django Girls.


This liveProject is for intermediate web developers and frontend engineers seeking to learn more about React Hooks, and the React Context API. To begin this liveProject, you will need to be familiar with:

  • Basics of JavaScript
  • Basics of frontend development workflow and tooling
  • Basics of React
  • Basics of modern frontend development

you will learn

In this liveProject, you’ll learn to develop a dashboard using the new React Hooks framework by refactoring a legacy codebase. Dashboards are an important part of almost any business, and a key project to add to your web development portfolio.

  • Creating React components with state
  • Fetching data with React Hooks
  • Handling complex state changes with React Hooks
  • Handling application’s state with React Context API
  • Mocking API data in the frontend
  • Writing unit tests and functional tests for the frontend


You choose the schedule and decide how much time to invest as you build your project.
Project roadmap
Each project is divided into several achievable steps.
Get Help
While within the liveProject platform, get help from other participants and our expert mentors.
Compare with others
For each step, compare your deliverable to the solutions by the author and other participants.
book resources
Get full access to select books for 90 days. Permanent access to excerpts from Manning products are also included, as well as references to other resources.