🛠 From Redux to the Context API: A Practical Migration Guide

📚 Let's migrate a React application built with Redux to the Context API and see how it looks like.

In my previous post, "Starting a New App With Redux? Consider Context API First", I wrote about the Context API as a viable alternative to Redux. In this post, I want to show how a React application using Redux looks when using the Context API.

First Considerations

I'm assuming that my previous article intrigued you enough that you're considering migrating away from Redux. You have to ask yourself: Is migration worth it? The approach based on the Context API might be simpler, but that's not enough of an argument on its own to rewrite perfectly functional code.

I can't tell you if your situation merits the change or not. You have to consider your circumstances and decide based on that. Here are some helpful questions:

  • Is this application likely to change? The benefits of a simpler codebase become apparent when people are regularly working on it.
  • Is this application safe to change? Without a solid base of tests to rely on, a major refactoring is doomed to fail.
  • Does it make sense from a business perspective? I get it. Developers love to work on restructuring their applications. But without alignment with your stakeholders, they may perceive it as technology for the sake of technology.

A General Approach

Alright, you're still here. You might be thinking: Let's do this!. What is the plan? You need one. I strongly recommend an incremental approach. Whatever you do, don't do a Big Bang release. Work on small chunks of functionality, and release them bit by bit. You'll thank me later.

Also, be realistic. If your application is big enough, this isn't going to be an immediate transition. In my experience, people often fail to account for the transition period during a migration.

Enough Talking, Show me the Code!

21