Code Editing Tools

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.

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. Be customizable by way of a plug-in architecture
5. Have available a large repository of third-party/community plug-ins that can be used to customize the editor to your liking
6. Be small, simple, and not coupled to the code (i.e., not required to edit the code)

Code Editors: [^1]

• Sublime Text [$]
• [$]
• Visual Studio Code

Online Code Editors:

• [$]
• Codeanywhere [free to $]

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 share small amounts of immediately runnable code in a web browser.

• [free to $]
• jsbin.com [free to $]
• StackBliz

ADVICE:

Image source: https://stateofjs.com/2017/other-tools/