JavaScript Static Typing

If you are reading this, you have made the decision to write your app almost exclusively in JavaScript (JSX is JavaScript). You are no longer crafting HTML pages or even HTML templates that have script tags at the bottom referencing JavaScript. You are not using JavaScript in a secondary role to add dynamic change to an HTML-based application. JavaScript's dynamic typing served well as minor player in an app. ReactJS, has an index.html. Everything else is JS. A dynamically typed language arguably does not scale as well as staticly typed programming languages. There is much more opportunity to introduce hard-to-find bugs in a loosely-typed system.

There are two predominant, general static type systems in the JavaScript world:

1. TypeScript - An open source system introduced and maintained by Microsoft.
2. Flow - An open source system introduced and maintained by Facebook

Before the introduction of those general JavaScript static typing systems, ReactJS introduced React.PropTypes. PropTypes is a static typing system focused exclusively on the properties received by a Component.

Though I love TypeScript's motto above, Flow's support into React is valuable. I found it simpler to understand and inflicted my own bias on TypeScript's maintainer to leverage Flow for my React app. That bias is not fair; there are lots of good things about TypeScript that I am choosing to pass on for the time being.

In my code, I use both Flow and React.PropTypes as redundant insurance policy if our project decides that general static typing is overkill. (Gawd forbid!) I may get push-back on Flow due to issue #6, the one with 237 comments as of this writing. babel-plugin-typecheck addressed that concern (at least for me), but cooler minds may not prevail.

Since this is a UT tutorial, I am not going to dive in further to static typing. A brief mention of static typing to inculcate a code quality culture just seemed prudent ahead of asserting code quality through UT's.

Allow me to leave Static Typing with a reference to this article on integrating Flow into your Bable world: Setting up Flow when you’ve already got Babel in place