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.
Flow
Flow is a static type checker for your JavaScript code. It is developed at Facebook and is often used with React. It lets you annotate the variables, functions, and React components with a special type syntax, and catch mistakes early. You can read an introduction to Flow to learn its basics.
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.
PropTypes
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.
About Me
I’m a Senior Product Engineer from India, working in web and mobile development. I enjoy turning complex problems into simple, beautiful, and intuitive software. I blog to share my software knowledge with others.
My job is to build your idea so that it is functional and user-friendly but at the same time attractive. Moreover, I add a personal touch to your product and make sure that is eye-catching and easy to use. I aim to help you validate and scale your startup most creatively.
Top comments (0)