SVG Viewer From time to time I end up needing to add some SVGs to my code, and being able to see both the code and the image is 💯.Rainbow Brackets In RN, you usually end up having lots of brackets everywhere: this provides a small visual help to know which contains what.Path Intellisense Writing paths when importing components/containers/image always used to led to many mistakes… but then I found this small gem.

Git Blame When working on projects with many people, you need to know who did what, but be careful: it’s a double-edge sword ).

Color Highlight When writing colours in HEX, it may be hard to remember exactly what they look like - this small tool previews it where you write it.

Auto Rename Tag 3 extensions to simplify tags management.

Atom Keymap Having used Atom a lot before, this was the easiest way for me to keep keybindings I already learned.

Once I got the primary tools up and running, I needed to go back on the marketplace and add all those extensions that can be categorised, IMHO, as utilities: they all provide small extra features which I find useful. This will help you up get up & running quickly with these core features: check what I wrote in the various config files and replicate that in your setup.Īnd, of course, I added VSCode to the command line. If you are having an hard time setting them to work properly together, I’ve done most of the work for you in this repo over here, called react-native-starting-point.

These extensions are pretty self-explanatory, but highly recommend to read carefully the READMEs in order to properly set them up. Prettier - JavaScript formatter Which is literally a game changer - and if you are not into it, try reading my in-depth.ESLint (which requires ESLint, obviously) A Linter is conceptually a tool that runs through your code and tells you what you can do to write it “better”.Flow Language Support (which requires Flow) Why you need a static type-checker? Read here.Babel JavaScript Which is fundamental for proper styling, since we’ll use “future-JS” (ES6+).Using the previously mentioned article as a guide to navigating the huge sea of the VSCode marketplace, the first few extensions I decided to install were all related to helping me write good&readable code:

Wes bos visual studio code theme lint