Flow is a static type checker for JavaScript

πŸ”₯

Static type checking is the process of verifying the type safety of a program based on analysis of a program's text (source code). If a program passes a static type checker, then the program is guaranteed to satisfy some set of type safety properties for all possible inputs.

https://en.wikipedia.org/wiki/Type_system#Static_type_checking

TL;DR it eliminates reduces bugs in your code

πŸ›

$ npm install -g flow-bin
$ flow bin
$ flow

Flow's "Hello World"

Other installation methods β€” https://flowtype.org/en/docs/install/

Demo: hello-world.js via CLI

My favourite way to run Flow...

πŸƒ

πŸ’

...is with Nuclide

Also by Facebook...

Hello World in Atom + Nuclide

βš›οΈ

Demo: hello-world.js & hello-world-typed.js

Primitives

πŸ”§

Demo: primitives.js

Arrays

[🐱,🐱,🐱]

Demo: arrays.js

Functions

🏭

Demo: functions.js

Classes

🏫

Demo: classes.js

Aliases

πŸ‘½

Demo: aliases.js

Modules

🍱

Demo: modules.js

$ npm install -g flow-typed
$ npm install
$ flow-typed install

3rd party code

Demo: modules.js

The benefits of Flow for me

  • The syntax is fairly simple
  • You can integrate it into one file of a huge legacy project
  • It actually helps reduce bugs
  • It integrates with most tools you already use (Babel, CLI, etc...)
  • It’s self documenting
  • Saves you pressing ⌘+R alot
  • Leaves less to worry about when updating code down the line

When to use Flow?

  • Larger projects
  • When multiple people are touching the code
  • You anticipate refactoring
  • Code you may come back to after a period of time

Team benefits I’ve already seen

πŸ’ͺ🏻

Bonus round

πŸŽ‰

Amazing React support!

🍩

Demo: react.js

@BenjaminReid

πŸ‘‹

Made with Slides.com