📜 ⬆️ ⬇️

jsFiddle - what kind of beast?

Recently, in the Chrome Web Store, I came across an application jsFiddle, a project of the British programmer Piotr Zalewa aka @zalun . In fact, this is another sandbox for web-programmers, but to say “next” I do not mean “useless to anyone”. I waited a long time for the moment when WYSIWYG will replace such sandboxes, and, it seems, I waited.

image


')
The jsFiddle workspace is divided into four parts, the dimensions of which can be changed (what a miracle, not frames!). As in all applications of this type, we separately write HTML code, separately JavaSript, separate CSS. The result is obtained in the iframe, looking at the code of which, I was convinced: the application does not attribute anything superfluous, no copyrights and other crutches. Syntax highlighting - everywhere. In general, it is felt that the author tried to make as many features as possible “a la IBM Eclipse”.

image

I did not fix anything, allowing the application to manage my code in its own way. As you can see, indents are very lame (their jsFiddle also puts attempts to put them automatically). And this is not a kosher tabulation, but poor cyclical spaces. We quarreled with the application for a long time about the closing tag, which for some reason it decided to move to the right.

image

With CSS layouts, everything is smooth: you can never look at the screen.

Now, in fact, to the features that distinguish jsFiddle from analogs. First, it is the ability to select the javascript libraries to be connected. The list includes Mootools, jQuery, Prototype, YUI, Glow, Dojo, Raphael, etc. You can select the version of the library, as well as the connection method: the library can be described in head, body, loaded by the onLoad or onDomReady event. There is a field for the attributes of the library, as well as a couple of settings.

image

Naturally, you can connect your JS file, both by editing html, and using a special field. There is no work with meta tags (it was possible to do more!). The truth is there is one possibility, which, though petty, but I, personally, delighted: the choice of html standard (yes, there is html5). JsFiddle has special Api for testing Ajax requests:

image

In fact, it is also very useful, because AJAX is not cross domain, but you need to test it somehow.

Examples of working with jsFiddle are in jsFiddle itself. And there are a lot of them and they, it seemed to me, are quite instructive. True, they are similar to magic. This one illustrates working with Canvas:

image

And this one (how is it ?!) - JQuery work with twitter:

image

You quickly understand that js in jsFiddle is not accidental. The application is actually exactly a JavaScript sandbox, which, unlike WYSIWYG, can be used. No matter how I searched, there are no suitable analogues in the Chrome Web Store. So, thanks to Piotr, as well as to another programmer: Oskar Krawczyk aka @Oskar.

jsFiddle - Chrome Web Store

Oh yes, this is a Stateless project, so welcome to the site .

@unnx

Source: https://habr.com/ru/post/126910/


All Articles