Getting Out of Hook Hell: You Are Using React Hooks The Wrong Way

React Hooks are a very powerful tool to add interactivity and features to user interfaces. As your application grows, you will increasingly rely on hooks, composing simple ones into complex hooks, and, before you know it, end up with an unreadable, unmaintainable mess that rerenders 5 times a second for no apparent reason. In this article, I will show you some React Hooks antipatterns and how to avoid them if you want a clean, readable, and robust application.

read more “Getting Out of Hook Hell: You Are Using React Hooks The Wrong Way”

BLoC in Flutter: Implement Clean, Flux-like Architecture

How to architect a Flutter application is a question that has no easy answer. Dart, being a multi-paradigmatic language, lets you mix and match OOP and functional programming approaches. It is very easy to mess things up when using both these concepts, but I am going to make your life a little easier using reactive programming and BLoC (Business Logic Component) library.

read more “BLoC in Flutter: Implement Clean, Flux-like Architecture”

Code Review: Redux

Redux is a state management library used by millions. It provides a simple way to manage your global state, subscribe to it and update it safely. Most of you know what it is, but not many have an idea of how it works under the hood. In this article, I will show you how this project is structured, how it was written and the philosophy behind it. By the end of the reading, you can expect to know how Redux was designed and be able to read its source code freely.

read more “Code Review: Redux”

Managing React Native Form State with Redux-Form

Chances are, you have had to implement some kind of a form while developing your mobile apps. It may be a simple login form or a complex reporting system, nevertheless, you will face some challenges. How do you validate the data? Where do you store the form state? How do you control the form’s lifecycle? Answers to these and many other questions are waiting below, where I tell you how to use Redux Form with React Native.

read more “Managing React Native Form State with Redux-Form”

Advanced testing in React Native with Jest: Redux integration

This post is part of my series on unit testing with Jest in React Native. You can find the introduction here.

By now you should have a solid understanding of how testing works in React Native. But there is one important concept left to go over, that is integrating redux into your tests. Redux is the industry standard for global state management in React applications. Even though React Context is supposed to replace Redux, it is not there yet. So how do we test Redux-connected components with Jest and react-native-testing-library?

read more “Advanced testing in React Native with Jest: Redux integration”