Среда разработки для Web

Что такое среда разработки

В общем случае, кодирование Web проекта представляет собой интерактивный процесс - поменял что то в коде программы, посмотрел результат работы в browser.

Я сразу хочу сказать что в основном речь сейчас идёт о разработке конечной функциональности - а именно страниц. Всякие более глубокие вещи, такие как разработка концепции, создание структуры баз данных, создание библиотек - это тема отдельного обсуждения. Эта статья охватит круг утилит которые самодостаточны для успешной Web разработки

Итак, минимальный джентельменский набор инструментов Web разработки это:
  • Текстовый редактор (любой)
  • Браузер (любой)
  • Способ доставки файлов от редактора к серверу

Далее же речь пойдёт о выборе наиболее подходящих серверов, редакторов, браузеров, одного или нескольких, для одних или других ситуаций.

Браузер

Хотя введение Web стандартов серьёзно улучшило ситуацию с совместимостью кода, бывает так что в начале разработки код работает только в одном браузере, а ещё чаще - работает везде кроме IE7 и/или IE6. Создатели Internet Explorer очень сильно старались усложнить жизнь web разработчикам (есть и внутренние документы Microsoft подтверждающие данное утверждение), в результате чего то, что написано по стандартом работает везде, кроме самого популярного браузера - IE7.

Требования совместимости напрямую связаны с целевой аудиторией (пользователями) нашего Web приложения. Как правило, мы проверяем наш код в: IE7, IE6, Firefox, Opera, Konqueror, Safari on Mac.

Задачу проверки кода на совместимость довольно сложно осуществить техничкски, так как некоторые браузеры заточены только под одну операционную систему. Меньше всего проблем с Firefox, Opera - это многоплатформенные браузеры, работают везде. А вот IE работает только под Windows (обычно), а Safari - только под Mac OS. Есть несколько вариантов решения данной проблемы, далее описаны наиболее популярные.

Работаем в Linux

Линукс имеет в своём арсенале Wine - эмулятор Windows, который позволяет запускать приложения без потери производительности. Есть готовый скрипт на http://www.tatanka.com.br/ies4linux/page/Main_Page, который устанавливает IE6 под Linux. Автор этого скрипта также обещает скорый релиз эмуляции IE7. Таким образом, ипользуя только IE6, Firefox, Opera, Konqueror мы достигаем 95% совместимости кода. Почему 95% ? Если код работает в этих браузерах - очень вероятно что он будет работать и в IE7 (что то среднее между IE6 и Opera) а Safari пользуется тем же ядром что и Konqueror (KHTML, Webcore).

Для FreeBSD и Linux также есть более полный но довольно непроиводительный вариант запуска Windows приложений - используя Vmware, Qemu. К тому же Vmware это коммерческий, довольно дорогой продукт.

Тестирование в удалённом доступе + Мультисистемный вариант (более одной машины)

Этот вариант более сложен для реализации в домашних условиях, но работает довольно неплохо в оффисе. Он предполагает собой то, что программист (или дизайнер) работает в одной операционной системе, но использует программы для удалённого доступа на другой компьютер. Так, например наш дизайнер, работая совместно с Windows может запустить VNCServer на Linux или FreeBSD для того чтобы посмотреть отрисовку в Konqueror.

Более дорогой, но не всегда более удобный вариант - поставить рядом PC/Windows, Mac и PC/Linux и проверять работу во всех. У этого варианта три основных минуса: занимает много места на столе, менее удобен (т к вместо одной пары клавиатура/мышь их три) и наиболее дорогой в реализации.

Текстовый редактор

Требования к текстовому редактору

Я бы хотел заострить особое внимание на тех фичах редактора, которые особенно необходимы для Web разработки, т.е. те, использование которых правильно способно улучшить или ускорить нашу работу.

  • Сетевое (удалённое) редактирование и/или запуск в терминале
  • Поддержка языка программирования, в т ч HTML, CSS, Javascript
  • Встроенный файл-браузер
  • Одновременное редактирование нескольких файлов
  • Поддержка нескольких выделений одновременно
  • Глобальный search/replace
  • Поддержка паттернов рефакторинга
  • Интеграция с системой управления версиями

Сетевое (удалённое) редактирование и/или запуск в терминале

Хотя наиболее правильной и удобной является установка сервера разработки (development server) на машине разработчика, всё таки бывают ситуации когда сервер находиться на другой машине. Это может быть как необходимость подправить код прямо на production сервере, так и просто работа с терминального сервера на сервере разработок. В таком случае, редактор в идеале должен уметь работать с файлами по сети, и/или запускатся в терминале.

Запуск в терминале не самое удачное решение так как многие функции среды разработки (как удобное управление мышью, фонты, многообразие цветов, кобминации клавиш) теряються.

Средним решением является использованием сетевой файловой системы типа fusefs+(ssh,ftp), или SMB которая позволяет монтировать удалённые каталоги для работы с ними.

Поддержка языка программирования, в т ч HTML, CSS, Javascript

Это довольно важный момент, который в состоянии повлиять на скорость и удобство программирования. Разработана уже целая масса фич, которые позволяют улучшить и упростить работу. Подсветка синтаксиса помогает охватить код одним взглядом и выделить только необходимое на данный момент. Code Browser позволяет видеть как локальный так и внешний контест и предоставляет функции ссылок на окружение. Подсветка синтаксиса также помогает быстро находить синтаксические ошибки. Запуск программы напрямую, или проверка синтаксиса, позволяет быстро понять где ошибка и исправить её, без необходимости отправки кода на сервер для проверки. Автоматическая расстановка тегов и их параметров в HTML/XML, проверка синтаксиса, могут серьёзно упростить работу.

Halogen - что мы рекомендуем

Браузер разработчика

Рекомендованным браузером является Firefox. Столь категоричная рекомендация только потому как в этом браузере реально реализованы довольно удобные механизмы просмотра и отладки как HTML, так и CSS, Javascript кода.

Firefox рекомендуется комплектовать следующим набором плагинов:
  • Firebug
  • Web developer
  • Russian hotkeys bugfix
  • British English dictionary
  • Russian spell dictionary
  • Selenium IDE
  • YSlow

Кратко о некоторые плагинах. Selenium IDE это быстрая и легкая в использовании система тестирования сайта. Firebug совместно и Web Developer - полнофункциональное IDE для конечной отдадки Web приложений. YSlow расскажет что стоит оптимизировать на странице.

Редактор разработчика

Если говорить об редакторе, обладающем полным набором фунциональности описанной выше - то скорее всего сюда попадает как Emacs так и Quanta. В реальности же, особенно тем кто начинает Web разработку после Windows надо ставить себе что то простое и понятное, пусть без кучи наворотов но быстро позволяющее начать работать. Тут можно наверное порекомендовать редактор Kate, который умеет делать почти всё что нужно.

Вообще - текстовый редактор это тема которая очень индивидуальна и всегда вызывала и будет вызывать flamewars и неоднозначную реакцию. Очень многое зависит от того каким предыдущим опытом обладает человек и до какой степени готов учиться чтобы добиться прироста производительности.

Редакторы на которые стоит обратить внимание, при разработке Python/Web приложений:

  • Emacs
  • Kate
  • vim (gvim)
  • KDE/Quanta
  • Eric4
  • SciTE
  • mcedit
  • IDLE
  • Eclipse/PyDev
  • Ulipad

Вообще, хоть капельку определиться в мире Python разработки можно только попробовав 70% из вышеперечисленного. Наиболее важными я считаю такие фичи (и наиболее часто мною используемые: поддержка синтаксиса Python, CSS, HTML (подсветки, интерпретатор кода, проверка кода), функции refactoring, быстрый поиск файла/функции по проекту, интерпретация/запуск кода по месту, подветка ошибок, собственно говоря скорость работы редактора (не люблю когда редактор не успевает отображать символы которые я набираю).


(статья не полная, будет ещё модифицироваться и дописываться. пишете вопросы на mailto:alex@koval.kharkov.ua).

Comments: 0

No comments.

Post a comment

Guests can\'t leave comments.