Panic Diet Coda

Изучаем iPad-приложение для веб-разработки
Планшеты (и Apple iPad в частности) большинством пользователей не воспринимаются как устройства для профессиональной деятельности. В этом есть свой резон: действительно, в отличие от ноутбука, планшеты предназначены в первую очередь для потребления контента. Однако, чем дальше, тем все больше появляется приложений, которые позволяют использовать планшеты и для весьма неожиданных (в таком контексте) профессиональных задач. Сегодня мы расскажем как раз о таком приложении, весьма заслуживающем, на наш взгляд, внимания.

Приложение называется Diet Coda и предназначено оно для HTML-верстки и веб-разработки. Diet Coda включает FTP-клиент, терминал и редактор HTML, PHP, JS, CSS. Создала этот продукт компания Panic, известная благодаря пакету разработки Coda для OS X. Многие разработчики и верстальщики считают Coda лучшим подобным инструментом для Mac. Или же, по крайней мере, лучшей альтернативой Adobe Dreamweaver, чья Mac-версия продается за совершенно неадекватные, заоблачные деньги. В отличие от Dreamweaver пакет Coda стоит всего около 100 долларов, что для профессионального приложения — вполне либерально.

В конце мая Panic выпустила вторую версию Coda для OS X, а кроме того — Diet Coda для iPad. Уже по одному только названию приложения несложно догадаться, что это «облегченная» версия Coda. На первый взгляд, идея верстки и написания кода на iPad кажется бредовой. Например, сама идеология операционной системы iOS такова, что в ней крайне неудобно работать с файлами, а следовательно и создавать свою файловую структуру на сервере. Кроме того, сложно поверить, что все необходимые инструменты для создания и редактирования сайтов могут быть размещены на небольшом пространстве экрана планшета.

Но разработчики Panic смогли это сделать. И даже больше того: простоту, к которой привыкли пользователи iPad и которую подсознательно ждешь от любого iPad-приложения (даже профессиональной направленности) они смогли соединить с впечатляющей функциональностью.

Интерфейс стартовой страницы Diet Coda во многом похож на «взрослую» Coda (см. скриншот ниже).

Первое, что вы видим, когда запускаем приложение — это выбор сайтов и возможность создать (добавить) новый. Процесс добавления сайта или SSH-сервера элементарен и очень близок к тому, что мы видим в Coda на OS X.

Создав сайт, мы видим в левой части экрана его папки и файлы на FTP, а в правой — информацию о выбранных файлах и папках, а также кнопки, позволяющие совершать различные операции с ними. Среди этих операций: удалить файл/папку, дублировать, переместить, копировать ссылку, путь или URL, а также — редактировать с помощью Diet Coda.

Жмем на эту кнопку — и видим код страницы.

Как и во «взрослой» Coda, весь синтаксис здесь выделяется, в результате чего код становится понятным и наглядным.

Также имеется режим предпросмотра, позволяющий прямо в Diet Coda увидеть вашу веб-страницу в том виде, как это будет выглядеть в браузере (хотя некоторые отличия, разумеется, будут).

Вся навигация и настройки вынесены на верхнюю панель. Там же находится и кнопка сохранения изменений. После того, как вы внесете изменения в документ, достаточно нажать на зеленую кнопку в правом верхнем углу — и изменения будут применены сразу на сайте. Это очень удобно, когда надо внести какие-то мелкие поправки в страницу сайта. Все операции занимают буквально несколько секунд!

А если тапнуть по розово-фиолетовой кнопке в левом углу, то тогда мы увидим список прежде открытых документов. Причем, документы отображаются в виде квадратных иконок, что помогает пользователю Apple-устройств сразу понять, как их удалить в случае необходимости: просто нажимаем и удерживаем — после чего иконки начинают дрожать, а в верхнем их углу появляется крестик.

Еще Diet Coda имеется набор шаблонов, которые можно дополнить и своими шаблонами тоже.

В Терминале доступны два варианта отображения: с черным фоном (a la Windows) и с белым (a la Mac).

Отдельного внимания заслуживает виртуальная клавиатура, которая отличается от стандартной iPad-клавиатуры дополнительным верхним рядом клавиш. В зависимости от ситуации набор клавиш в ней может варьироваться. Вот, например, как выглядит эта клавиатура при HTML-верстке.

Очевидно, что все клавиши в верхнем ряду очень полезны, их постоянно приходится использовать. Впрочем, разумеется, виртуальную клавиатуру можно и скрыть, если она не нужна. А если подключить к планшету Bluetooth-клавиатуру — тогда без виртуальной вполне можно и вовсе обойтись, высвободив, таким образом, экранное пространство.

Выводы

В общем, все это выглядит очень привлекательно. Но сразу встает вопрос: а в чем, как говорится, подвох? В чем минусы приложения? Помимо самого очевидного (размер экрана и скудный набор настроек), это сложности работы с иллюстрациями. Допустим, у вас есть картинка. Вам ее надо добавить на сайт. Единственный способ это сделать — это загрузить уже готовую (прежде отредактированную вами) картинку на сервер и обязательно посмотреть ее разрешение. После чего мы уже с помощью Diet Coda можем переместить ее в нужную папку на сервере, дать ей нужное имя. Последний этап — выделить картинку, нажать Copy tag, скопировав путь к картинке в буфер обмена, далее открыть нужный нам HTML-файл и вставить там путь к картинке, вручную прописав ее разрешение (непонятно, почему Diet Coda не может разрешение прописывать самостоятельно?). В общем, операция длительная и мучительная. И это только один пример, одно ограничение.

Поэтому, конечно, Diet Coda не заменит вам полноценного инструмента для верстки — Coda, Dreamweaver или чего-то подобного. Но для всех, чья работа связана с HTML-версткой или веб-разработкой, Diet Coda будет очень приятным дополнением к основному «арсеналу». Во-первых, теперь в отпуск не обязательно брать большой ноутбук — если возникнет необходимость что-то подправить по мелочи, это можно сделать и с помощью Diet Coda. Во-вторых, Diet Coda вас выручит в тех ситуациях, когда вы вдали от компьютера или же просто его выключили. Например, лежите вы вечером в кровати, уже собираясь засыпать, как вам пишут коллеги, что на сайте опечатка, и ее нужно поправить. Прежде вам пришлось бы вставать, включать компьютер, ждать, пока он загрузится, включать громоздкий пакет для верстки, загружать с сайта эту страницу, исправлять, потом выключать компьютер… Теперь же вы можете не вставая с кровати, взять iPad и за несколько секунд сделать то же самое.

Главная ценность Diet Coda — в очень хорошо продуманном интерфейсе (одновременно понятном и знатокам Coda для Mac, и пользователям iPad) и сбалансированном наборе возможностей. А также, конечно, невысокой цене, которая, вкупе в вышеописанным, делает покупку Diet Coda оправданной для всех обладателей iPad, профессионально связанных с созданием сайтов.




4 сентября 2012 Г.

Panic Diet Coda: iPad- -

Panic Diet Coda

iPad- -

( Apple iPad ) . : , , . , , , ( ) . , , , .

Diet Coda HTML- -. Diet Coda FTP-, HTML, PHP, JS, CSS. Panic, Coda OS X. Coda Mac. , , Adobe Dreamweaver, Mac- , . Dreamweaver Coda 100 , — .

Panic Coda OS X, — Diet Coda iPad. , «» Coda. , iPad . , iOS , , . , , .

Panic . : , iPad iPad- ( ) .

Diet Coda «» Coda (. ).

, , — () . SSH- , Coda OS X.

, FTP, — , , . : /, , , , URL, — Diet Coda.

— .

«» Coda, , .

, Diet Coda - , ( , , ).

. . , , — . , - . !

- , . , , Apple- , : — , .

Diet Coda , .

: (a la Windows) (a la Mac).

, iPad- . . , , HTML-.

, , . , , , . Bluetooth- — , , , .

, . : , , ? ? ( ), . , . . — ( ) . Diet Coda , . — , Copy tag, , HTML- , (, Diet Coda ?). , . , .

, , Diet Coda — Coda, Dreamweaver - . , HTML- -, Diet Coda «». -, — - , Diet Coda. -, Diet Coda , . , , , , , . , , , , , , , … , iPad .

Diet Coda — ( Coda Mac, iPad) . , , , , , Diet Coda iPad, .