Since most applications can be represented by state machines, it is beneficial to make valid states in your program as clear as possible and invalid states impossible. This will enhance the readability, and maintainability of your code to everyone who sees it, including future you. In the rest of this article we will discuss one strategy for making invalid states impossible with an example in tsx and React. Replacing Booleans With Types Below you will find a tiny React component that displays fish from a fictional API.

Are you currently the only one on your engineering team who can read and understand your code? If you left for a new job, how often would your teammates need to call you in order to maintain the code you left them? Let’s talk about how to not get calls after you leave a job. Visual Hierarchies Visual hierarchies are a powerful tool. As readers they allow us to scan, giving us a sense of the main flow.