Must-See JavaScript Dev Tools
No love for react-devtools [0]? I&#x27;m amazed it wasn&#x27;t even an honorable mention, considering he mentioned react and redux (which is probably generally used with react).<p>I&#x27;m also surprised he didn&#x27;t mention flowtype [1], which is by Facebook and is supported by Babel! If you&#x27;re writing React, you&#x27;re probably already using Babel, so using flow is very low friction.<p>Furthermore, if you&#x27;re interested in runtime assertions, you can use babel-plugin-typecheck [2], which will convert your flowtype annotations into assertions. If we&#x27;re looking to be pragmatic, IMO, this is the optimal path to take. The library that Elliot is working on looks interesting, but even he recognizes in its page that it&#x27;s still a work-in-progress.<p>If you&#x27;re writing a modern JS app and you wanna take advantage of all the ES6 goodies, you&#x27;ll pick up babel. And if you&#x27;re using babel, you can get jsx and flowtype for free. It&#x27;s ridiculous to try and build a JS app without some sort of bundler, whether it&#x27;s browserify or webpack. And if you&#x27;re gonna use a bundler, pulling in a transpiler like babel is really easy and it lets you write much saner code.<p>Oh, and if you&#x27;re already drinking the Facebook kool-aid with react, jsx, and flowtype, you&#x27;ll wanna give nuclide a shot. As I understand it, it has nice flow support, with stuff like &quot;click-to-define&quot; and inline linting [3].<p>I&#x27;m using flowtype annotations with the babel plugin I mentioned above, but due to my usage of non-standard features, I can&#x27;t successfully run flow itself over my codebase. I&#x27;ll also note that my experience with nuclide when I last tried it was underwhelming.<p>[0] <a href="https:&#x2F;&#x2F;github.com&#x2F;facebook&#x2F;react-devtools&#x2F;" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;facebook&#x2F;react-devtools&#x2F;</a><p>[1] <a href="http:&#x2F;&#x2F;flowtype.org&#x2F;" rel="nofollow">http:&#x2F;&#x2F;flowtype.org&#x2F;</a><p>[2] <a href="https:&#x2F;&#x2F;github.com&#x2F;codemix&#x2F;babel-plugin-typecheck" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;codemix&#x2F;babel-plugin-typecheck</a><p>[3] <a href="http:&#x2F;&#x2F;nuclide.io&#x2F;docs&#x2F;flow&#x2F;" rel="nofollow">http:&#x2F;&#x2F;nuclide.io&#x2F;docs&#x2F;flow&#x2F;</a>