20个在线代码编辑器和开发工具

admin管理员组

文章数量:1532347

2024年3月9日发(作者：)

20个在线代码编辑器和开发工具

1. BluePen Editor

BluePen Editor is a PHP-powered CSS editor that can be

installed to any static or dynamic website and makes live

CSS editing possible. Once triggered (with a bookmarklet),

it opens the editor widget and makes all HTML elements

hoverable so that blupePen can locate the CSS rules of

them (like Chrome Dev Tools).

Source

2. Dirty Markup Dirty Markup is a free web-based

application for cleaning up such code very easily. It has

support for HTML(5), CSS and JavaScript by combining

the powers of the popular HTML Tidy, CSS Tidy and JS

Beautify.

The editor used is the simple + functional AceEditor and

there are multiple options for each beautifier to get the best

results.

Source

3. Rendra Online HTML5 Editor Rendera is an online

HTML5 editor which renders a realtime preview of your

current work also transform your current work into CSS,

Rendera supports HAML and SASS. Rendera makes

learning HTML5 and CSS3 easy and it is built with

CoffeeScript and Sinatra.

Source

4. Maqetta Maqetta is an open source project that provides

WYSIWYG visual authoring of HTML5 user interfaces. The

Maqetta application itself is authored in HTML, and

therefore runs in the browser without requiring additional

plugins or downloads. Maqetta is available under a

commercial-friendly open source license. You can

download the source code and install it on your own server,

customize the code to fit your needs and/or contribute

improvements to the open source project.

Source

5. Amy Editor Amy Editor is a collaborative text and source

code editor for developers. It support JavaScript, Ruby,

PHP, C#, Java, HTML, YAML, etc… programming

languages. It has Syntax Highlighting, Smart indentation

for each language, Code folding, Unlimited undo/redo,

Customizable key shortcuts, etc… You can easily change

the color themes of the editor easily.

Source

6. JS Bin JS Bin is a webapp specifically designed to help

JavaScript and CSS folk test snippets of code, within some

context, and debug the code collaboratively.

JS Bin allows you to edit and test JavaScript and HTML.

Once you’re happy you can save, and send the URL to a

peer for review or help. They can then make further

changes saving anew if required.

Source

7. CSSDesk CSSDesk is an Online CSS Sandbox. It

allows people to quickly test snippets of CSS code, and

watch the result appear live. I had very high ambitions for

the project. There are line numbers and syntax highlighting

appear live in the text box as you type. One of the greatest

things is that it allows users to share their code with others

as well.

Source

8. Editpad EditPad is simple and minimal. No syntax

highlighting, no project management…Just a plain page to

type your text without any distractions.

Source

9. RegExr RegExr is an online tool for editing and testing

Regular Expressions (RegExp / RegEx). It provides a

simple interface to enter RegEx expressions, and visualize

matches in real-time editable source text. It also provides a

handy RegExp snippet sidebar with descriptions and

usage examples to make it easier to learn Regular

Expressions through trial and error.

Source

10. Codeanywhere Codeanywhere is a code editor in a

browser with an integrated ftp client, and all popular web

formats are supported (HTML, PHP, JavaScript, CSS, and

XML).

Source

11. 9ne 9ne (Pronounced Nine) is a nice online text editor,

based on the well known GNU Emacs. 9ne provides most

of the basic Emacs functionalities and currently supports

XML and Javascript syntax highlighting modes.

Source

12. Drawter Drawter is a tool written in JavaScript and

based on jQuery library. It provides you the possibility to

literally draw your website’s code. It runs on every single

web-browser which makes it really useful and helpful.

Each tag is presented as a layer you have drawn.

Source

13. Shift Edit Shift Edit provides code completion, syntax

highlighting, live editing, revision history and many more.

Source

14. Darkcopy DarkCopy is a simple, full-screen text editor

for distraction free writing. DarkCopy is for anyone who

enjoys the simplicity of a typewriter, and wants to increase

productivity by focusing only on writing.

Source

15. jsFiddle jsFiddle is a shell editor that eases writing

JavaScript code by creating a custom environment based

on popular JS frameworks. You can select the framework

& the version of your choice (MooTools, jQuery, Dojo,

Prototype, YUI, Glow,Vanilla). Also, if there is, you can add

a complimentary framework like jQuery UI or MooTools

More A great feature is the ability to save & share the

code created with a unique URL generated. Optionally,

jsFiddle has an embedding feature too. It is an almost

perfect platform for trying & sharing your JavaScript

code without the need of a website.

Source

16. Cloud9IdE Cloud9 IDE is an open source application

that aims to provide a powerful and focused IDE for

JavaScript developers. It is powered by the

platform + makes use of HTML5, , and

many other projects. The application has a pretty fast text

editor with bundled syntax highlighting support for JS,

HTML, CSS and mixed modes. Cloud9 IDE has integrated

debuggers for and Google Chrome which can be

started, paused and stopped from the IDE.

Source

17. Dabblet Dabblet is an interactive playground for quickly

testing snippets of CSS and HTML code. It uses

-prefix-free, so that you won’t have to add any prefixes in

your CSS code. You can save your work in Github gists,

embed it in other websites and share it with others.

Source

18. JS Hint JSHint is a community-driven tool to detect

errors and potential problems in JavaScript code and to

enforce your team’s coding conventions. It is very flexible

so you can easily adjust it to your particular coding

guidelines and the environment you expect your code to

execute in. The goal is to help JavaScript developers write

complex programs without worrying about typos and

language gotchas.

Source

19. is a coding community for front-end

engineers such as web designers, mark-up engineers, and

JavaScript engineers. This is an online editor where you

can try running your codes as you write. You can save your

codes online as well as show them to the public as your

work. Don’t worry even if you are not confident in your skill!

Arrange shared codes and learn cutting-edge techniques.

Source

20. Gist Box

Finally I am adding Gist Box which lets you easily organize

code snippets. Your library is saved to the cloud for backup.

Never worry about snippets getting lost in the shuffle.

GistBox was built on standard HTML5 technologies. On

the go or at the office, you’ll always have GistBox.

本文标签： 编辑器代码