Code Editing Tools

A source code editor is a text editor program designed specifically for editing source code of computer programs by programmers. It may be a standalone application or it may be built into an integrated development environment (IDE) or web browser. Source code editors are the most fundamental programming tool, as the fundamental job of programmers is to write and edit source code.

— Wikipedia

Front-end code can minimally be edited with a simple text editing application like Notepad or TextEdit. But, most front-end practitioners use a code editor specifically design for editing a programming language.

Code editors come in all sorts of types and size, so to speak. Selecting one is a rather subjective engagement. Choose one, learn it inside and out, then get on to learning HTML, CSS, DOM, and JavaScript.

However, I do strongly believe, minimally, a code editor should have the following qualities (by default or by way of plugins):

  1. Good documentation on how to use the editor
  2. Report (i.e., hinting/linting/errors) on the code quality of HTML, CSS, and JavaScript.
  3. Offer syntax highlighting for HTML, CSS, and JavaScript.
  4. Offer code completion for HTML, CSS, and JavaScript.
  5. Be customizable by way of a plug-in architecture
  6. Have available a large repository of third-party/community plug-ins that can be used to customize the editor to your liking
  7. Be small, simple, and not coupled to the code (i.e., not required to edit the code)
Code Editors: [^1]
Online Code Editors:
Shareable & Runnable Code Editors:

Used to share limited amounts of immediately runnable code. Not a true code editor but a tool that can be used to small amounts of immediately runnable code in a web browser.

ADVICE:

[^1] I recommending using Visual Studio Code because of the quality of the tool and the continuous improvements made to the editor that likely won’t stop or slow due to the fact that Microsoft is behind the tool.