Type checkers help to identify certain types of problems before you even run your code.
As the application you're working on grows, you'll definitely want to add some kind of prop type checking - you don't want bugs you'll work on for hours or days before you realize you just sent an empty array instead of an object! It helps to annotate variables, functions, and it helps to detect mistakes early.
At most of the places, you'll find people talking about using type checking extensions such as Flow and, Typescript for React projects.
You can use something like Typescript to cover your whole app with checks. While TypeScript can be quite useful and nice, you may not want to enforce the type checking of every single function and variable.
Static type checkers like Flow and TypeScript identify certain types of problems before you even run your code. They can also improve developer workflow by adding features like auto-completion. For this reason, I recommend using Flow or TypeScript instead of PropTypes for larger codebases.
To use Flow, you need to:
- Add Flow to your project as a dependency.
- Ensure that Flow syntax is stripped from the compiled code.
- Add type annotations and run Flow to check them.
If you don't want to go all the way to add Flow, Typescript to your small-medium sized project, you can use PropTypes which comes as a standard react package, although not in the core library.
To get started with PropTypes I wrote a beginner level tutorial which you can read here for free.
Hey there, I am Imran, the author of this post. I maintain a publication website and a YouTube channel where I post tutorials, courses, blogs about software development for free. You can check'em out here :
Read the latest Software Development articles, tutorials, news specially curated.
Subscribe for tutorials and new videos.