Home  >  Article  >  Web Front-end  >  What editor should I use to write react?

What editor should I use to write react?

藏色散人
藏色散人Original
2020-12-24 09:02:034961browse

You can use a variety of editors to write react, such as: 1. Atom, a cross-platform text editor; 2. Visual Studio Code, a cross-platform source code editor; 3. WebStorm editor; 4. Sublime Text; 5. Vim, a highly configurable text editor and more.

What editor should I use to write react?
The operating environment of this tutorial: windows7 system, React17 version, DELL G3 computer. This method is suitable for all brands of computers.

Recommendation: "react video tutorial"

Atom

Atom is specialized A cross-platform text editor launched for programmers. It is a modern, easy-to-use, and controllable text editor. Atom is widely used by developers in many programming languages. It has a large and active community that has produced many useful plug-ins.

Official website: https://atom.io/

Features:

Cross-platform editing

Built-in package manager

Smart Autocomplete

File System Browser

Multiple Panes

Find and Replace

Visual Studio Code

Visual Studio Code is a cross-platform source code editor developed by Microsoft for Windows, Linux and OS X for writing modern web and cloud applications. . It is free and open source and supports debugging, embedded Git controls, syntax highlighting, smart code completion, code snippets, and code refactoring.

Official website: https://code.visualstudio.com/

Features:

Built-in Git commands

Extensible and customizable

Install the corresponding plug-in

Necessary: ​​ESLint, DocumentThis, EasyLess, Complete JSDoc Tags, vscode-flow-ide, React native Tools, vscode-wechat, npm, babel-javascript, debugger for chrome, git lens, node debug 2.

Optional: javascript (ES6) code snippets, reactjs code snippets, react-native/react/redux snippets for es6/es7, highlight bad chars, color highlight, Path Intellisense, partial diff

WebStorm

WebStorm is built on the open source IntelliJ platform that JetBrains has developed and refined for over 15 years. It offers tight integration with VSC, local history functionality, has a vibrant plugin ecosystem, is fully configurable, and offers a host of other features. WebStorm provides advanced support for React and JSX and provides core coding assistance for React Native applications.

Official website: https://www.jetbrains.com/webstorm/

Features:

Intelligent coding assistance

Support Latest Technology

Version Control System

Seamless Tool Integration

Debugging, Tracing and Testing

Built-in Terminal

Sublime Text

Sublime Text is a text editor (paid software, you can try it indefinitely, but there will be an activation prompt pop-up window), and it is also an advanced code editor. Sublime Text was developed by programmer Jon Skinner in January 2008. It was originally designed as a Vim with rich extension functions.

Sublime Text has a beautiful user interface and powerful features such as code thumbnails, Python plug-ins, code snippets, etc. Key bindings, menus and toolbars can also be customized. The main features of Sublime Text include: spell check, bookmarks, complete Python API, Goto function, instant project switching, multi-selection, multi-window and more. Sublime Text is a cross-platform editor that supports Windows, Linux, Mac OS X and other operating systems.

Official website: https://www.sublimetext.com/

Features:

Goto Anything function

Multiple selections

Command Terminal

Distraction Free Mode

Split Editing

Instant Project Switch

Plug-in API

Customize anything

Cross-platform

Sublime Text Common Package

babel-sublime - Syntax definition of ES6 JavaScript with React JSX extension.

react-native-snippets - Collection of snippets for Sublime Text for react native

Vim Editor

Vim is highly configurable A text editor that allows you to create and change any type of text very efficiently. Most UNIX systems support it in the form of "vi". Many developers like to use Vim for various editing tasks. Vim is very stable and constantly evolving to get better.

Official website: http://www.vim.org/

Features:

Persistent, multi-level undo tree

Extensive plug-in system

Supports hundreds of programming languages ​​and file formats

Powerful search and replace capabilities

Ability to integrate with many tools

Vim plugin

vim-jsx - Provides syntax highlighting and indentation for JSX.

vim-react-snippets - A set of snippets built for Vim to be used with Facebook's React library.

vim-babel - A set of snippets built for Vim to be used with Facebook's React library.

Spacemacs Editor

Spacemacs is a community-driven Emacs distribution - the best editor is neither Emacs nor Vim, it's Emacs and Vim combined !

Official website: http://spacemacs.org/

Features:

Key bindings are organized using mnemonic prefixes

Discoverable - Innovative real-time display of available keybindings.

Similar functions have the same key

A simple query system can quickly find available layers, packages, etc.

Community-driven configuration provides powerful user-tunable packages so bugs can be quickly fixed.

Extensions

React layer - ES6 and JSX configuration layer for React. It will automatically recognize .jsx and .react.js files. A wrapper for React integration.

TextMate Editor

TextMate is not an IDE, but through the use of its powerful snippets, macros, and unique scoping system it can often provide even programming language specific IDEs are lacking features. React doesn't support it directly, but it's easy to get support for JSX, which most React code is based on, with the help of the plugin below.

Official website: https://macromates.com/

Features:

CSS selector can determine the scope of operations and settings

Quick overview and navigation pop-up

Integrate your favorite scripting language as a plug-in

Run Shell commands from the document

Code highlighting

Works with Xcode and builds Xcode projects

Plugin

javascript-jsx.tmbundle - Textmate Bundle for JSX (React). Syntax highlighting is currently supported.

The above is the detailed content of What editor should I use to write react?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn