search
HomeWeb Front-endFront-end Q&AWhat are the html editing software?

What are the html editing software?

Mar 30, 2021 pm 02:35 PM
htmlcode editor

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


    ## Official website: https://nuclide.io/
  • Github project address: facebook / nuclide(https://github.com/facebook/nuclide)
  • Documentation:

    • Setup: https://nuclide.io/docs/editor/setup/
    • Nuclide with React Native: https://nuclide.io/docs/platforms/react-native/
  • Supported platforms: Windows, Mac, Linux
  • Licence: Open source
  • Features:

    • Built-in debugging
    • 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


    ## Official website: https://www.gnu.org/software/emacs/
  • Documentation:

    • Official documentation: https://www.gnu.org/software/emacs/documentation. html
    • Initial setup for React Native: http://www.cyrusinnovation.com/initial-emacs-setup-for-reactreactnative/
  • License: Follow the GPL
  • Supported platforms: Windows, Mac, Linux
  • Features:

    • Content-aware editing mode, including syntax coloring, suitable for multiple file types.
    • 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


    ##Official website: http://spacemacs.org/
  • Github project address: syl20bnr/spacemacs(https://github.com/syl20bnr/spacemacs)
  • Documentation:

    • Official Document: http://spacemacs.org/doc/DOCUMENTATION.html
  • License: Open Source
  • Supported Platforms: Windows, Mac, Linux
  • Features:

    • Key bindings 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.
Spacemacs is a community-driven Emacs distribution - the best editor is neither Emacs nor Vim, it's Emacs and Vim combined!

Extensions

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

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


    # Official website: https://www.jetbrains.com/webstorm/
  • Documentation:

    • Official documentation: https://www.jetbrains.com/webstorm/documentation/
    • Use external tools: https://blog.jetbrains.com/webstorm/2016/08/using-external-tools/
  • License: Charges (single user required in the first year Pay $129)
  • Supported platforms: Windows, Mac, Linux
  • Features:

    • Intelligent coding assistance
    • Supports the latest technology
    • Version Control System
    • 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


    ## Official website: https ://macromates.com/
  • Documentation:

    • Official documentation: http://manual.macromates.com/en/
  • License: Fee (Single user License is 48.75 euros)
  • Supported platforms: Mac
  • Features:

    • CSS selectors 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
    • 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!

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
CSS IDs vs Classes: which is better for accessibility?CSS IDs vs Classes: which is better for accessibility?May 10, 2025 am 12:02 AM

Classesarebetterforaccessibilityinwebdevelopment.1)Classescanbeappliedtomultipleelements,ensuringconsistentstylesandbehaviors,whichaidsuserswithdisabilities.2)TheyfacilitatetheuseofARIAattributesacrossgroupsofelements,enhancinguserexperience.3)Classe

CSS: Understanding the Difference Between Class and ID SelectorsCSS: Understanding the Difference Between Class and ID SelectorsMay 09, 2025 pm 06:13 PM

Classselectorsarereusableformultipleelements,whileIDselectorsareuniqueandusedonceperpage.1)Classes,denotedbyaperiod(.),areidealforstylingmultipleelementslikebuttons.2)IDs,denotedbyahash(#),areperfectforuniqueelementslikeanavigationmenu.3)IDshavehighe

CSS Styling: Choosing Between Class and ID SelectorsCSS Styling: Choosing Between Class and ID SelectorsMay 09, 2025 pm 06:09 PM

In CSS style, the class selector or ID selector should be selected according to the project requirements: 1) The class selector is suitable for reuse and is suitable for the same style of multiple elements; 2) The ID selector is suitable for unique elements and has higher priority, but should be used with caution to avoid maintenance difficulties.

HTML5: LimitationsHTML5: LimitationsMay 09, 2025 pm 05:57 PM

HTML5hasseverallimitationsincludinglackofsupportforadvancedgraphics,basicformvalidation,cross-browsercompatibilityissues,performanceimpacts,andsecurityconcerns.1)Forcomplexgraphics,HTML5'scanvasisinsufficient,requiringlibrarieslikeWebGLorThree.js.2)I

CSS: Is one style more priority than another?CSS: Is one style more priority than another?May 09, 2025 pm 05:33 PM

Yes,onestylecanhavemoreprioritythananotherinCSSduetospecificityandthecascade.1)Specificityactsasascoringsystemwheremorespecificselectorshavehigherpriority.2)Thecascadedeterminesstyleapplicationorder,withlaterrulesoverridingearlieronesofequalspecifici

What are the significant goals of the HTML5 specification?What are the significant goals of the HTML5 specification?May 09, 2025 pm 05:25 PM

ThesignificantgoalsofHTML5aretoenhancemultimediasupport,ensurehumanreadability,maintainconsistencyacrossdevices,andensurebackwardcompatibility.1)HTML5improvesmultimediawithnativeelementslikeand.2)ItusessemanticelementsforbetterreadabilityandSEO.3)Its

What are the limitations of React?What are the limitations of React?May 02, 2025 am 12:26 AM

React'slimitationsinclude:1)asteeplearningcurveduetoitsvastecosystem,2)SEOchallengeswithclient-siderendering,3)potentialperformanceissuesinlargeapplications,4)complexstatemanagementasappsgrow,and5)theneedtokeepupwithitsrapidevolution.Thesefactorsshou

React's Learning Curve: Challenges for New DevelopersReact's Learning Curve: Challenges for New DevelopersMay 02, 2025 am 12:24 AM

Reactischallengingforbeginnersduetoitssteeplearningcurveandparadigmshifttocomponent-basedarchitecture.1)Startwithofficialdocumentationforasolidfoundation.2)UnderstandJSXandhowtoembedJavaScriptwithinit.3)Learntousefunctionalcomponentswithhooksforstate

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.

VSCode Windows 64-bit Download

VSCode Windows 64-bit Download

A free and powerful IDE editor launched by Microsoft

SecLists

SecLists

SecLists is the ultimate security tester's companion. It is a collection of various types of lists that are frequently used during security assessments, all in one place. SecLists helps make security testing more efficient and productive by conveniently providing all the lists a security tester might need. List types include usernames, passwords, URLs, fuzzing payloads, sensitive data patterns, web shells, and more. The tester can simply pull this repository onto a new test machine and he will have access to every type of list he needs.

WebStorm Mac version

WebStorm Mac version

Useful JavaScript development tools

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Integrate Eclipse with SAP NetWeaver application server.