A brief motivation for the importance of static type safety in larger codebases. Comparison of different static type-checkers options for front-end code: TypeScript, Flow, Reason, Elm. Trade-offs and recommendations.
const user = [0, 1, 2]; document.bodi.innerHTML = greeter(user); tsc greeter.ts greeter.ts(8,15): error TS2339: Property 'bodi' does not exist on type 'Document'. greeter.ts(8,35): error TS2345: Argument of type 'number[]' is not assignable to parameter of type 'string'. TYPESCRIPT
EXCELLENT TYPE INFERENCE (NO TYPE DECLARATION BLOAT) BUCKLESCRIPT: COMPILES OCAML TO FAST/SIMPLE JS VERY EARLY STAGES... POPULAR USERS: MESSENGER.COM (~30%) FACEBOOK REASON + BUCKLESCRIPT
person main = text (greeter [0, 1, 2]) ELM elm make Greeter.elm -- TYPE MISMATCH --------------------------------------------------- Greeter.elm The argument to function `greeter` is causing a mismatch. 7| greeter [0, 1, 2]) ^^^^^^^^^ Function `greeter` is expecting the argument to be: String But it is: List number Detected errors in 1 module.
/ TYPESCRIPT OR ELM GREEN FIELD NODE PROJECT → FLOW / TYPESCRIPT GREEN FIELD REACT NATIVE → FLOW EXISTING CODEBASE (WEB, NODE, REACT NATIVE) → FLOW / TYPESCRIPT
type Props = { name: ?string }; REACT PROPTYPES flow src/components/App.js:31 <Greeter name={[1, 2, 3]} /> ^^^^ props of React element `Greeter`. This type is incompatible... CODEMOD-PROPTYPES-TO-FLOW