React is a JavaScript framework by Facebook for creating scalable applications. It is used to create many popular apps that you use every day as Instagram, Facebook, Walmart, and Gyroscope.
The React Native is yet another React port for creating mobile apps for Android and iOS. It is used by dozens of global companies such as Skype, Facebook, Instagram, Airbnb, Wix, and Uber.
While many developers prefer to use agonistic IDEs, and code editors such as VS Code, and Atom, there are many React specific IDEs and code editor that come with a dozen of useful features and options.
In this post, we review some of these React IDEs, that will help developers speed up their production time, and enjoy their work on their React projects.
1- Reactide
Reactide is a free open-source React IDE that comes with a built-in Node.js server, a browser simulator and a powerful file manager.
It supports component visualization, and offers a a simple configuration manager to manage multiple configuration at once.
Reactide is available for Windows (7,8,10), Linux (Debian, Ubuntu, Linux Mint) and macOS (10.10+).
Hamza Mousa
2- Deco IDE
Deco IDE is an old but fairly usable IDE for React Native development. It comes with a developer-friendly interface, and allows developers to run their app directly in iOS and Android simulators.
The IDE comes with a component manager which aid developer to search, find and use React Native components in secs.
Hamza Mousa
3- Utopia
Utopia is a powerful React IDE that is based on VS Code, but comes with dozens of React-specific features. It allows designers and developers to design, edit and modify the components visually, without the need to touch the code.
We wrote a quick review about it here.
Hamza Mousa
4- React Studio
React Studio is not another React IDE, it is aiming to help designers build their React apps visually, with limited interaction to the code, but still it exports the project into a readable code that can be edited in any code editor.
React Studio is free to download for macOS 10.12+, but it is not yet available for Windows or Linux.
Hamza Mousa
5- Rekit and Rekit Studio
Rekit is a complete React framework that takes care of many tasks for developers, but it also comes with a powerful web-based React Studio that help developers manage their app, visualize their routes, events, and more.
The project is free and open-source, which anyone can download, and use totally free of charge.
6- React Proto
React Proto is not actually an IDE, it is a prototyping tool that utilizes React to produce functional React code.
React Proto is available for Windows, macOS and linux.
7- VS Code
VS Code is an open-source code editor and IDE that has a vast ecosystem of extensions, plugins, and themes. React plugins have no shortage in the VS Code extensions directory, which turn your installation into a powerful React IDE.
Here is a tutorial by freeCodeCamp that will help you setup your VS Code for React development.
Reed Barger
8- Reacto
Reacto is a free open-source React IDE with a package manager that support autocomplete, and comes with a powerful component editor.
Unfortunately, Reacto is no longer maintained by its developer, but it is released as an open-source project under the MIT license.
9- Nuclide
Nuclide is an IDE for React Native. It can be installed on Linux, and macOS. It is built on top of the Atom-IDE and uses its package manager to manage its ecosystem.
However, the open-source version is retired, but it can be accessible through the Facebook Open Source Archive.
Recommendations
Our first recommendation is Utopia as it is easy to use and comes with many useful features for both designers and developers.
Our second pick for developers is Reactide, which is a full-featured React IDE.
However, If you want to prototype something quick with React, we recommend React Proto, It came a long way to aid designers export a full functional React code from the design canvas.
For React Native, Deco IDE is a good choice, but you have to consider that even it is functional, it did not receive updates for some time.
