A detailed look at how React.useEffect works


An essential tool to writing bug-free software is to maximize the predictability of your program. One strategy is to minimize and encapsulate side effects. In layman’s terms, a side effect is defined as a procedural change that was not communicated within its scope, otherwise known as a secondary, typically undesirable effect.

In programming, a side effect is a state change that occurs outside of its local environment. Stated differently, a side effect is anything that interacts with the outside world (i.e. outside of the local function that’s being executed). …

A detailed look at how React.useState works


Since the additions of React Hooks in React 16.8, functional components allow for side effects and state management. Within state management in React, there are two hooks that can be utilized: useState and useReducer. This article will guide you on using useState for state management.

Mental Model

React ships with useState hook (function) and can be accessed through React.useState. The method takes a single argument, the initial value for that piece of state. It then returns an array, where the 0th index is the actual state and the 1st index is used to update that state.

The conventional and more precise way…

Jimmy Phong

Software developer with a liking to avocados www.jayacados.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store