What are the html editing software?-Front-end Q&A-php.cn

html editing software includes: Nuclide, Atom, Sublime Text, Visual Studio Code, Vim editor, GNU Emacs editor, Spacemacs editor, Deco IDE, WebStorm, TextMate editor, etc.

What are the html editing software?

The operating environment of this tutorial: Windows 7 system, HTML5 version, Dell G3 computer.

There are many editors on the market for development work. I often feel entangled in how to choose a useful editor for different programming languages. During the subsequent development of React Native, I did some exploration and research on the corresponding editors. This article summarizes some editors and IDEs that are very suitable for mobile application development.

1. Nuclide

Github project address: facebook / nuclide(https://github.com/facebook/nuclide)
Documentation:
- Nuclide with React Native: https://nuclide.io/docs/platforms/react-native/
Licence: Open source
Features:
- Remote development
- Developing Hack
- Support Mercurial
- Working set

Nuclide is a single one built on top of Atom package, which provides programmability and has a very active community. It provides a first-class development environment for React Native, Hack and Flow projects.

2. Atom

## Official website: https://atom.io/

Github project address: atom(https://github.com/atom)
Documentation:
- Setup: http://flight-manual.atom.io/
- Atom with React Native: https://blog.sendbird.com/tutorial-build-a-messaging-app -using-react-native/
Supported platforms: Windows, Mac, Linux
Licence: Open source
Features:
- Cross-platform editing
- Built-in package manager
- Smart auto-completion
- File system browser
- Multiple Pane
- Find and Replace

Atom 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.

Atom commonly used packages:

atom-react-native-autocomplete package - This package is for React-Native and provides automatic completion function for the Atom editor.
atom-react-native-css - This is a package with built-in React-Native components that support SASS and SCSS. React-native-css converts valid CSS, SASS to the Facebook subset of CSS.
react-native-snippets - This package is React Native snippets for Atom and Nuclide.
zenchat-snippets - It is a collection of snippets for react-native, redux and ES6.
atom-xcode - For integrating Mac Xcode and atom. Once installed, the iOS simulator can be controlled within atom.
language-babel - Contains syntax for all versions of JavaScript, including ES2016 and ESNext, JSX syntax for Facebook React, and etch for Atom.

Recommended tutorial: "html video tutorial"

3. Sublime Text

Official website: https://www.sublimetext.com/
Github project address: SublimeText(https://github.com/SublimeText)
Documentation:
- Settings: https://www.sublimetext.com/docs/3/
- SublimeText for React Native: https://zaicheng.me/2016/06/20/react- native-initial-setup/
- Setting SublimeText for React-JSX development: (http://www.nitinh.com/2015/02/setting-sublime-text-react-jsx-development/)
Supported platforms: Windows, Mac, Linux
Licence: Free download and trial, you need to purchase a License to continue using it.
Features:
- Goto Anything Function
- Multiple Selection
- Command Terminal
- Distraction Free Mode
- Split editing
- Instant project switch
- Plugin API
- Customize anything
- Cross-platform
Setting up React Native: nitinh.com/2015/02/setting-sublime-text-react-jsx-development/

Sublime Text is a sophisticated text editor for writing Code, markup, and write plain text. The community provides a large number of plug-ins to extend its functionality. Sublime Text has always been a favorite editor among developers.

Sublime Text common package

react-native-snippets - A collection of snippets for Sublime Text in react native
babel-sublime - Syntax definition for ES6 JavaScript with React JSX extension.

4. Visual Studio Code

Official website: https://code.visualstudio.com/
Github project address: Microsoft/vscode(https://github.com/Microsoft/vscode)
Documentation:
- Setup: https://code.visualstudio.com/docs
- Develop React Native applications using Visual Studio Code: https://blogs.msdn.microsoft.com /visualstudio/2016/02/22/develop-reactnative-apps-in-visual-studio-code/
Supported platforms: Windows, Mac, Linux
Features :
- Built-in Git commands
- Extensible and customizable

Visual Studio Code is developed by Microsoft for Windows, Linux and Source code editor for OS X development. It is free and open source and supports debugging, embedded Git controls, syntax highlighting, smart code completion, code snippets, and code refactoring.

Extension

ReactNative Tools - This extension provides a development environment for React Native projects. You can debug your code, quickly run react-native commands from the command terminal, and use IntelliSense to browse the objects, functions, and parameters of the React Native API.
Vim Editor

5. Vim Editor

Official website: http://www.vim.org/
Github project address: vim/vim(https://github.com/vim/vim)
Documentation:
- Vim documentation: http://www.vim.org/docs.php
- Setting up Vim for React-JSX: https:// jaxbot.me/articles/setting-up-vim-for-react-js-jsx-02-03-2015
License: Open Source
Supported platforms: Mac, Linux
Features:
- Persistent, multi-level undo tree
- Extensive plug-in system
- Support hundreds of programming languages and file formats
- Powerful search and replace capabilities
- Ability to integrate with many tools

Vim is a highly configurable text editor that can 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.

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.

6. GNU Emacs Editor

Documentation:
- Initial setup for React Native: http://www.cyrusinnovation.com/initial-emacs-setup-for-reactreactnative/
Supported platforms: Windows, Mac, Linux
Features:
- Complete built-in documentation, including novice tutorials.
- Supports Unicode encoding for almost all scripting languages.
- Highly customizable, using Emacs Lisp code or a graphical interface.
- Has a package system for downloading and installing extensions.

GNU EMACS is an extensible, customizable, free, and free text editor.

Extension

web-mode.el - It is an autonomous emacs main module for editing web templates. It is compatible with many languages, including JSX (React).

7. Spacemacs Editor

Github project address: syl20bnr/spacemacs(https://github.com/syl20bnr/spacemacs)
Documentation:
Supported Platforms: Windows, Mac, Linux
Features:
- 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.

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

Extensions

8. Deco IDE

Official website: https://www.decosoftware.com/
Github project address: decosoftware/deco-ide(https://github.com/decosoftware/deco-ide)
Documentation:
- Official documentation: https://www.decosoftware.com/docs
Supported platforms: Mac (only for iOS )
License: Open Source
Features:
- Component search and insertion
- Real-time adjustment
- New file holder

Deco is an IDE specially built for React Native. It is an all-in-one solution for writing React Native applications that can be downloaded and used without any environment setup. Deco improves the React Native development workflow by focusing on component reuse and enabling users to edit the UI in real time.

9. WebStorm

Documentation:
- Use external tools: https://blog.jetbrains.com/webstorm/2016/08/using-external-tools/
Supported platforms: Windows, Mac, Linux
Features:
- Supports the latest technology
- Seamless Tool Integration
- Debugging, Tracing and Testing
- Built-in Terminal

WebStorm is built on the open source IntelliJ platform, which 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.

10. TextMate Editor

Documentation:
Supported platforms: Mac
Features:
- Quick overview and navigation pop-up
- Integrate your favorite scripting language as a plug-in
- Run Shell commands from the document
- Code Highlighting
- Collaborate with Xcode and build Xcode projects

TextMate is not an IDE, but by using its powerful snippets, macros, and unique scoping system, it often Can provide functionality that even programming language-specific IDEs lack. 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.

Plugin

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

For more programming-related knowledge, please visit:

Programming Video

! !

The above is the detailed content of What are the html editing software?. For more information, please follow other related articles on the PHP Chinese website!