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

Нет двоих схожих разработчиков, поэтому здесь предоставлено изобилие редакторов кода, из которых можете выбрать лучший для себя. Чтобы понять, какой из них лучший, мы будем оценивать разные критерии по 5 бальной шкале. Мы обратим внимание на:

• Удобство использования - насколько редактор прост для новичков, насколько интуитивно понятен, когда мы открываем его впервые.
• Мощность - критерий всех новшеств, возможностей редактирования кода, автодополнение, режимы редактирования и т.д.
• Расширяемость - поддерживает ли редактор плагины, дополнительные библиотеки.
• Эстетика - мы любим красоту в нашей работе, насколько среда приятная на вид, насколько аккуратно выглядит код в ней.
• Скорость - насколько быстро запускается редактор, насколько быстро открывает большие файлы.
• Кросс-платформенность - доступен ли редактор для нескольких операционных систем.
• Цена - самая дешевая цена, получает наивысшую отметку.

Редакторы кода предоставлены в группах, которые предназначены для конкретных типов разработчиков.

Вы спросите, кто такие гуру? В основном, это люди которые использовали редакторы программного кода еще до того как вы родились. Инструменты этой группы тяжелые и широки. Они могут запускаться с терминального окна и согласно UNIX традициям, все их настройки определяются в файле конфигурации.

Выпущен в 1991 году. Универсальный и мощный редактор получил множество поклонников по всему миру. Что делает его особенным среди других, это технология командной строки. Вместо простого написания кода, вы выбираете режим ввода для текста, запускаете поиск и используете еще больше указаний. Этот редактор импортирован на всех известных операционных системах. Vim также может быть расширен с помощью скриптов и плагинов. Это бесплатный софт, который уже инсталлирован на многих Linux системах.

Разработка Emacs началась в далеких 1970-х и продолжается до сих пор. Этот редактор известен своей расширяемостью. Это один из первых редакторов, который поддерживает подсветку кода, автоматическое выравнивание кода и поддержку многих программных языков. Подобно Vim, он также кросс-платформенный и может использоваться через терминальное окно или графический интерфейс. Emacs это бесплатный и открытый ресурс.

Редакторы кода в этой категории полностью вооружены средствами разработки. Они просты в использовании и располагают мощными средствами. Разработчики могут писать, компилировать, тестировать и запускать в одном приложении.

Eclipse чаще всего используется для разработки Java приложений. Этот софт поддерживает плагины, которые делают возможной поддержку дополнительных языков программирования. Есть плагины для C/C++, Ruby, PHP и других. Eclips предлагает мощных хинтинг кода, построенный на документациях и проверке синтаксиса в реально м времени. Большие компании, например Google, предоставляют свои средства разработки для этой платформы. Вы можете легко создавать приложения для Android и App Engine. Eclipse бесплатный и открытый ресурс.

Aptana это среда разработки предназначена для тяжелых AJAX приложений. Эта среда поддерживает большинство популярных веб языков: PHP, JavaScript, HTML, CSS, Ruby, Python и другие с помощью плагинов. Также есть Git интеграция, возможность тестировать приложение на локальном сервере, и множество полезных сниппетов кода для каждого языка программирования. Подобно Eclipse, Aptana бесплатный и открытый ресурс.

Еще одна среда для Java, но как и Eclipse, может быть расширена для дополнительных языков: PHP, Python, C/C++ и других. Приложение запускается на Linux, Windows и OSX. Netbeans может ускорить процесс разработки десктопных приложений с помощью Drag and Drop конструктора. Негативной стороной является производительность - Netbeans может тормозить на больших проектах. Этот редактор кода бесплатный и открытый ресурс.

Dreamweaver это часть приложений Adobe Suite предназначенных для веб дизайнеров. Он поддерживает только наиболее популярные языки веб программирования - PHP, ASP.NET, JavaScript, HTML, CSS. Очень удобный для новичков, с поддержкой WISIWYG редактирования, живого просмотра, тестирование на удаленном сервере и разработка приложений с помощью jQuery mobile и Phonegap. Dreamweaver доступен на OSX и Windows. Если покупать весь пакет приложений за 399$, нет смысла ею пользоваться. Но если купить отдельно, может быть в этом что-то есть. Еще проще будет .

Visual Studio это «все в одном», среда разработки для Windows. Этот редактор поддерживает большое количество языков: C/C++, C#, VB.NET и F# которые встроены в среду. Имеет мощные средства для автозавершения кода, подстрочная документация, проверка ошибок, дебаггинг, дизайн форм, создание схем баз данных и многое другое. Цена начинается с 500$, но экспресс версия программы доступна бесплатно.

Xcode это решение от Apple для разработки OSX и iOS приложений. Поддерживает C, C++, Objective-C, Objective-C++, Java, AppleScript, Python и Ruby. С помощью Xcode, вы можете писать, проводить дебаггинг, делать тестирование приложений. Имеет конструктор интерфейсов и эмулятор мобильных устройств, для тестирования iOS приложений. Xcode использовали, как платный редактор, но сейчас они предлагают бесплатно.

Coda это «все в одном» редактор для веб разработчиков. Поддерживает передачу файлов через протокол FTP, навигацию по коду и файловой структуре, сайты и группы сайтов, управление MySQL и многое другое. С новым Coda 2, вы можете использовать iPad для просмотра. Стабильная цена 99$, но вы можете получить по дисконту за 75$.

Эти редакторы кода красивые, легкие, просты в использовании и расширяемы. Очень много разговоров о них, многие предоставляют плагины, пишут статьи, и предлагают решения как сделать лучше тот или иной редактор.

TextMate в основном графический текстовый редактор для OSX. Поддерживает макросы, хранение кода, сниппеты, интеграцию shell, управление проектами. Text Mate 2 предположительно будет предоставлен со всем что только можно. Редактор стоит около 50$.

Sublime это красивый кросс-платформенный редактор. Он быстрый и богат функционалом, для практически каждого языка программирования. Поддерживает несколько выделений, сворачивание кода, макросы, проекты и другое. Также возможно полноэкранное редактирование, которое выглядит превосходно на больших мониторах. Запускается на Linux, Windows и OSX. Этот редактор предоставляется с неограниченным тестовым периодом, но вам нужно купить лицензию за 59$, которая может быть использована на каждом компьютере.

Этот мощный и легкий редактор должен быть у каждого разработчика, который пользуется Windows. Хотя название нагадывает расширенный блокнот, это могучий инструмент. Он прост для новичков, но он также подходит для профессионалов. Notepad++ поддерживает каждый из популярных языков программирования. Поддерживает разбиение рабочей среды на два окна редактирования, FTP браузер, макросы и мощные возможности редактирования текста. Notepad++ абсолютно бесплатный. Его можно .

TextWrangler это бесплатный и легкий редактор для OSX. Поддерживает все языки программирования. Предлагает мощный функционал поиска и замены, манипуляции с текстом, сравнение файлов, FTP поддержка и многое другое.

CodeLobster обладает простым и мощным функционалом для веб программиста. Подходит для всех версий ОС Windows: 8, 7, Vista, XP, 2003, 2000, ME, Server. Гибкая настройка рабочей среды, всплывающие подсказки по функциям, отладка, и todo список. Этот редактор рекомендован именно для веб разработчика, он легко расширяется для работы с различными фреймверками: CakePHP, CI, Drupal, JQuery, Yii, Smarty, Symfony, WP, Facebook. Облегченный вариант редактора доступен бесплатно. С набором инструментов 40$, в полном наборе плагинов и расширений более 100$.

Не смогли найти свой редактор в этом списке? Расскажите нам, какой ваш любимый редактор в комментариях ниже!

Инструменты для создания сплывающих меню и других подобных элементов для своего сайта!

↓ Новое в категории "JavaScript, java ":

Бесплатная
Namo WebEditor 2006 Suite является профессиональным и очень мощным конструктором сайтов. Конструктор может работать в двух режимах одновременно: визуальном и ручном кодировании. Работа с конструктором не требует знаний HTML или же других языков программирования, так как программа сама генерирует код.

Бесплатная
HTML TreeView Generator 1045 является простым инструментом, который создаёт на web-странице древовидные раскрывающиеся HTML-списки. Причем при применении HTML TreeView Generator для их создания любому пользователю можно обойтись без наличия знаний в языках javascript, HTML или CSS. Также данное приложение может осуществлять импорт проектов среды Visual Folder Tree Builder.

Бесплатная
Greasemonkey 0.9.2 – это очень полезное дополнения для известного браузера Mozilla Firefox. При помощи дополнения Greasemonkey у вас будет возможность самостоятельно писать пользовательские страницезависимые Java-скрипты. Благодаря данному дополнению к браузеру Mozilla Firefox вы сможете довольно быстро и легко внести множество новых функций по изменению вида открываемой вами страницы в интернете.

Бесплатная
Apycom Java Menus and Buttons 5.00 является пакетом, который может создавать навигационные блоки для веб-сайтов. Уникальность программы Drop Down Menus and Buttons заключается в том, что она позволяет осуществлять свою работу не только профессионалам, но и начинающим веб-дизайнерам для создания, как простейших выпадающих меню, так и для величественных трехмерных панелей или кнопок с множеством функциональных возможностей, устанавливаемых самостоятельно.

Бесплатная
Antechinus javascript Editor 9.0 build 3 – это удобный и мощный редактор, который содержит все необходимые функции, которые помогут в написании или редактировании кода javascript. Программа Antechinus javascript Editor содержит порядка 30 примеров по добавлению javascript на ваши веб-странички.

Бесплатная
Anfy 2.1 является библиотекой, которая содержит 52 приложения основанных на технологии Java и предназначенных для создания навигационных меню и визуальных эффектов. Библиотека Anfy благодаря наличию в своём составе таких приложений, как Water, Tree Menu, Fireworks, Lake, Text Scroll, Fade banner или Anfy Cam даёт возможность придать новый вид вашей веб-странице с рабочим столом, графикой и экранной заставкой.

Бесплатная
Adobe Edge 1.0.0.38.9626 – это качественный продукт от компании Adobe, который предназначен для работы в качестве профессионального инструмента по добавлению на сайты интерактивных элементов при помощи стандартов HTML5, javascript и CSS3 и, не используя для этого технологию Flash.

Бесплатная
Сборник javascriptS 7.0 представляет собой этакий сборник, который содержит в себе больше чем 230 различных скриптов. «Сборник javascriptS» легко поможет вам оформить свой сайт таким образом, какое у вас будет желание. Этот набор DHTML и javascript имеет возможность осуществлять работу в Internet Explorer или же Netscape Navigator.

Бесплатная
Коллекция javascript 1.0 представляет собой увлекательную выборку скриптов выполненную на языке javascript. «Коллекция javascript» может использовать подключения в код HTML, который дополняет её способности. Благодаря возможностям приложения «Коллекция javascript» вы можете создавать клавиши с анимацией выполнять такие действия, как переадресация на другой документ и многое другое.

Бесплатная
MenuEditor1 1.0.3.122 инструмент, который практически самостоятельно создаёт полноценное меню на страницах интернета. Программа MenuEditor позволяет осуществлять создание меню с профессиональным качеством даже наиболее неискушённым пользователям, что довольно сильно отличает её от аналогичных приложений.

Рассмотрим особенности создания динамики на странице, обработки форм, а также работы со слоями и стилями.
JavaScript - это объектно-ориентированный язык программирования сценариев с синтаксисом, немного аналогичным синтаксисам языков C, Perl и Python . Несмотря на то что язык имеет схожее название с языком программирования Java, ничего общего, кроме части названия, у них нет.

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

Сеть Интернет построена по технологии «клиент-сервер ».
Серверы - это компьютеры или программы, которые предоставляют какие-либо сервисы клиентам, например веб-сервер или сервер электронной почты.
Клиенты - это компьютеры или программы, которые используют то, что предлагают серверы, например веб-браузеры или почтовые клиенты.

Сценарии JavaScript - это небольшие программы, которые выполняются на компьютере пользователя при загрузке с сервера вместе с веб-страницами.

С самого начала своего развития язык JavaScript применялся для написания различных клиентских сценариев. Они широко применялись для решения таких задач, как, например, проверка информации, введенной пользователем в форму, перед ее отправкой на сервер или программирование ответных реакций на действия пользователя, делающие веб-страницы интерактивными. Сегодня с помощью языка JavaScript создаются уже целые веб-приложения, некоторые из них мало чем уступают своим настольным «собратьям». Хорошие примеры таких веб-приложений можно найти среди сервисов компании Google, например Google Calendar - многофункциональный органайзер в веб-браузере и Google Doc & Spreadsheet - текстовый и табличный редактор, позволяющий работать с офисными документами прямо в окне веб-браузера. Для создания динамического содержимого веб-страниц используется язык создания динамических страниц HTML Dynamic HTML (Динамический HTML), ключевой частью которого является опять же JavaScript.

Язык JavaScript применятся не только в Интернете, но и в таких программах, как, например, Adobe Dreamweaver, Adobe Acrobat Reader и Adobe Photoshop для расширения их возможностей, аналогично использованию языка Visual Basic в Microsoft Office.

Теперь рассмотрим создание сценариев и способы их внедрения в HTML-документ.

Разберем все этапы создания JavaScript-сценария - от организации рабочего окружения до подключения кода к HTML-документу.

Для работы над сценариями подойдет практически любой текстовый редактор, позволяющий создавать обычные текстовые файлы и сохранять их с расширением htm или html. Например, в операционной системе Windows в числе стандартных есть два подходящих текстовых редактора - Блокнот и WordPad. Существуют также редакторы, специально разработанные для создания веб-страниц, например Microsoft FrontPage и Adobe Dreamweaver (ранее известный как Macromedia Dreamweaver). Такие редакторы позволяют создавать веб-страницы с помощью визуальных инструментов, а затем переключаться в режим отображения кода и вносить нестандартные изменения, например добавлять сценарии. В отличие от обычных текстовых редакторов, в таких редакторах подсвечивается синтаксис языка HTML и JavaScript, что очень удобно.

Кроме того, в Интернете вы можете найти большое количество других текстовых редакторов, которые позволяют создавать веб-страницы и подсвечивать синтаксис языков HTML и JavaScript. Эти редакторы имеют также много других полезных возможностей, которые существенно упрощают процессы создания веб-страниц и разработки сценариев. Многие такие редакторы распространяются бесплатно или условно бесплатно, и, возможно, какой-нибудь из них придется вам по душе.

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

Веб-разработчикам приходится считаться, в основном, с особенностями веб-браузера Microsoft Internet Explorer. Следовательно, свои веб-страницы нужно обязательно протестировать в этом веб-браузере, который имеется в каждой операционной системе Windows.
Большой популярностью пользуются также веб-браузеры Mozilla Firefox и Opera, которые стремятся максимально соответствовать стандартам. Mozilla Firefox можно загрузить с сайта http://www.mozilla.ru/, а Opera - с сайта .

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

Существует немало программ для отладки сценариев на JavaScript. Например, отладчик Microsoft Script Debugger имеет все необходимое для успешной отладки сценариев на JavaScript. Он применяется совместно с веб-браузером Microsoft Internet Explorer. Этот наладчик распространяется бесплатно компанией Microsoft, его можно загрузить с сайта . Кроме того, данный отладчик распространяется вместе с редактором Microsoft FrontPage в рамках программы Microsoft Script Editor, которая практически не отличается от Microsoft Script Debugger.

Существуют также и другие отладчики, например для веб-браузера Mozilla Firefox они созданы в виде расширений. В частности, отладчик FireBug можно загрузить с сайта , причем если на эту страницу перейти в веб-браузере Mozilla Firefox, то отладчик сразу же установится.

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

Рассмотрим встраивание сценариев в веб-страницы.
Сценарии внедряются в HTML-документ тремя стандартными способами:

Как известно, для создания на веб-страницах гиперссылок применяется контейнерный тег

имеющий атрибут href для указания адреса страницы или файла, к которому приведет гиперссылка. Однако вместо адреса данный атрибут может содержать и JavaScript-сценарий, если перед сценарием поставить слово javascript: (со знаком двоеточие). Пример такой гиперссылки следующий:

Нажмите сюда

Когда пользователь щелкает кнопкой мыши на гиперссылке, интерпретатор сценариев JavaScript получает код

Alert("Привет, мир!");

и исполняет его, в результате чего на экране появляется диалоговое окно (рис. 2.1).

Рис. 2.1. Результат перехода по гиперссылке

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

Встраивание сценариев для обработки событий

Поведение каждого элемента зависит от событий, которые постоянно происходят в веб-браузере. Допустим, пользователь выполнил следующие действия: щелкнул кнопкой мыши на тексте, переместил указатель мыши и загрузил HTML-документ. Веб-браузер сам решает, как реагировать на каждое событие, однако вы можете «перехватить» отдельные события и задать для них новое поведение. В языке HTML многие теги имеют атрибуты, соответствующие различным событиям. Эти атрибуты могут содержать код языка JavaScript, который выполняется в ответ на событие, например:

Это простой текст

Контейнерный тег

просто объединяет текст в параграфы, однако на него возлагается еще одна функция. Если вы определите атрибут onclick, то ваш текст будет реагировать на щелчок кнопкой мыши. Результат обработки кода приводится на рис. 2.2.

Рис. 2.2. Результат щелчка кнопкой мыши на тексте

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

Встраивание сценариев в тег

В HTML есть специальный контейнерный тег

Если при разборе кода HTML-документа веб-браузер встретит этот тег, то он интерпретирует последующий до закрывающего тега

текст как сценарий на каком-либо языке. Язык сценария указывается с помощью атрибута type. Например, для указания языка JavaScript используется следующий код:

Здесь располагается код сценария

Этот атрибут можно и не указывать, так как значение «text/javascript» является значением по умолчанию.

В коде сценария можно использовать комментарии - текст, который игнорируется интерпретатором JavaScript. Комментарии // и

// Это первый комментарий // Второй комментарий, далее идет код Код сценария ... // Код на JavaScript ...