11 Top React Native Developer Tools for 2020

Useful React Native developer tools you should know in 2020.

SaidHayani@
Bits and Pieces

--

Here are 10 tools you should use if you want to build React Native apps.

1. Nuclide

Nuclide

Nuclide is a package by Facebook that is integrated with Atom editor. It is especially used to build mobile apps with React Native. It comes with great features like elements inspection and allows you to live edit React Native elements.

2. Bit for React Native

Example: searching for shared React components in bit.dev

Bit is a great way to build your team’s next-gen React Native component library. It solves the problem of sharing and collaborating on UI components across repositories. It’s also a powerful way to compose UIs with shared components, independently developed, versioned and updated.

In the bit.dev platform you can host and organize your components. Bit.dev leverages Bit’s CLI tool to let you version and push independent components from any local project to a collection on Bit.dev- where they are organized, documented, rendered, and can be installed/imported.

Example: isolating and sharing React components

In Bit.dev your team can search, render, install and even update any component from any new project. On the platform, features like auto component-docs, rendered sandbox and more are all available out-of-the-box.

Bit does its magic by tracking each component’s dependencies and versioning it as a stand-alone unit of code. It also makes sure shared components are truly reusable by building and testing them in an isolated environment, before exporting them from their local projects to a collection in bit.dev.

3. Visual Studio Code + “React Native — Full Pack”

Visual Studio Code is one of the best tools for programming. It’s my favorite editor and I use it personally every day in my work. To make it work perfectly with React Native, I use the “React Native — Full Pack” extension — and it does exactly what it says on the tin. “React Native — Full Pack” contains a full pack of all the available React native tools in Visual Studio Code.

4. Xcode

Xcode is Apple’s development environment tool, for ios, MacOs, etc. Xcode is your tool to bulletproof your React Native apps for iOS. I personally use Xcode not just to build apps but also for debugging and installing iOS packages. Xcode also enables a custom build configuration.

5. Android Studio

The “Xcode version” for android. Android Studio enables building and debugging React Native apps.

6. React Native debugger

React Native debugger is my favorite tool so far. Most of my work is done with Redux and this tool has Redux dev-tools integrated by default(!) You can also inspect React Native elements and edit the UI — that makes it my top tool🙌.

7. React devtools

React devtools are mostly used to debug Reactjs components it can be used to debug React native code as well. It has some limitations, especially in the native debugging level. The latest version has support for live editing and inspecting the styles for React native.

8. Reactotron

https://github.com/infinitered/reactotron

reactotron is a desktop application by InfiniteRed for debugging and inspecting React Native. They have recently added support to Reactjs as well. This tool gives you everything you need to debug a React Native app.

9. react-native CLI

It’s the official CLI for React Native. It’s great for automating jobs like linking, starting the packager and building the app.

The react-native CLI also supports custom configurations. For example, you can use the CLI to install React Native project pre-configured with a specific package like TypeScript or even complete boilerplates.

 react-native init MyApp --template myCustomTemplate // Ex: react-native-firebase-template 

10. Ignite CLI

Ignite is a CLI by InfiniteRed for React Native. It’s a great way to start with awsome boilerplates. The CLI has other uses like generating screens, reducers, Containers, etc.

// to generate a screenignite generate screen HomeScreen// install cutom biolerplate 
ignite new MyNewAppName -b ignite-andross

I work mostly with Redux, redux-saga and this CLI saves me a lot of time!

11. Expo

Expo is a platform for building React Native apps. It comes with its own CLI.

Expo made it so much easier to build and test React Native apps. It provides easy to use APIs and components to work with.

--

--