Просмотров: 2 363

jsFiddle. Редактор кода «в облаках». Как тестировать веб-страницы онлайн?

У меня появилась задача: нужно иметь возможность тестировать HTML, CSS или Javascript код онлайн, прямо в браузере. Важно, чтобы этот код могли посмотреть и в случае необходимости подкорректировать другие люди.

Нужен, своего рода, редактор кода «в облаках».

Дело в том, что я собираюсь открывать на этом сайте раздел с практикой, в котором буду публиковать исходные коды, каких-то веб-страниц. Такой редактор очень бы пригодился.

Похоже, что мне удалось найти подобный редактор, причем пользоваться им можно совершенно бесплатно. Называется он jsFiddle.

jsfiddle

Вот ссылка на официальный сайт:

//jsfiddle.net/

Давайте посмотрим, что и как можно с его помощью делать:

1. Самое главное — можно добавлять и редактировать HTML, CSS, Javascript-код и просматривать результат его отображения в браузере.

jsfiddle

4 окна. Вводим соответствующий код в любое из них и получаем то, как будет работать страница в браузере в окне «Result».

Для этой задачи сервис и разрабатывался. После того, как вы внесли изменения, чтобы увидеть результат, нужно нажать на кнопку Run.

05-03-2013 6-46-40

2. Подключение сторонних библиотек javascript (Jquery, Prototype и др.)

05-03-2013 6-48-10

3. Тестировать отображение на мобильных устройствах.

05-03-2013 6-49-40

4. Создавать архив из тестируемых веб-страниц и делиться ими в соц. сетях и на своем сайте.

Вот как может выглядеть вставленный код:

Либо, можно давать ссылку сразу в редактор в нужных местах веб-страницы. Это может выглядеть так:

//jsfiddle.net/dimachen/sjcbm/2/

 

Можете, для примера, потренироваться на этом полигоне.

В общем, сервис впечатляет, очень удобно. Думаю, что в ближайшее время буду активно им пользоваться. Это как раз то решение, которое в настоящий момент мне необходимо.