update

1-js/1-getting-started/1-intro/article.md

@@ -0,0 +1,143 @@
+# Введение в JavaScript
+
+Давайте посмотрим, что такого особенного в JavaScript, почему именно он, и какие еще технологии существуют, кроме JavaScript.
+[cut]
+## Что такое JavaScript?   
+
+*JavaScript* изначально создавался для того, чтобы сделать web-странички "живыми".  
+Программы на этом языке называются *скриптами*. Они подключаются напрямую к HTML и, как только загружается страничка -- тут же выполняются.
+
+**Программы на JavaScript -- обычный текст**. Они не требуют какой-то специальной подготовки.
+
+В этом плане JavaScript сильно отличается от другого языка, который называется Java.
+
+[smart header="Почему <u>Java</u>Script?"]
+Когда создавался язык JavaScript, у него изначально было другое название: "LiveScript". Но тогда был очень популярен язык Java, и маркетологи решили, что схожее название сделает новый язык более популярным.
+
+Планировалось, что JavaScript будет эдаким "младшим братом" Java. Однако, история распорядилась по-своему, JavaScript сильно вырос, и сейчас это совершенно независимый язык, со своей спецификацией, которая называется <a href="http://en.wikipedia.org/wiki/ECMAScript">ECMAScript</a>, и к Java не имеет никакого отношения.
+
+У него много особенностей, которые усложняют освоение, но по ходу учебника мы с ними разберемся.
+[/smart]
+
+Чтобы читать и выполнять текст на JavaScript, нужна специальная программа -- [интерпретатор](http://ru.wikipedia.org/wiki/%D0%98%D0%BD%D1%82%D0%B5%D1%80%D0%BF%D1%80%D0%B5%D1%82%D0%B0%D1%82%D0%BE%D1%80). Процесс выполнения скрипта называют *"интерпретацией"*.
+
+[smart header="Компиляция и интерпретация, для программистов"]
+Строго говоря, для выполнения программ существуют "компиляторы" и "интерпретаторы". 
+
+Компиляторы преобразуют программу в машинный код. Этот машинный код затем распространяется и запускается. 
+
+А интерпретаторы, в частности, встроенный JS-интерпретатор браузера -- получают программу в виде исходного кода. При этом распространяется именно сам исходный код (скрипт).
+
+Современные интерпретаторы перед выполнением преобразуют JavaScript в машинный код или близко к нему, а уже затем выполняют. 
+[/smart]
+
+Во все основные браузеры встроен интерпретатор JavaScript, именно поэтому они могут выполнять скрипты на странице.
+
+Но, разумеется, этим возможности JavaScript не ограничены. Это полноценный язык, программы на котором можно запускать и на сервере, и даже в стиральной машинке, если в ней установлен соответствующий интерпретатор.
+
+## Что умеет JavaScript?   
+
+Современный JavaScript -- это "безопасный" язык программирования общего назначения. Он не предоставляет низкоуровневых средств работы с памятью, процессором, так как изначально был ориентирован на браузеры, в которых это не требуется.
+
+Что же касается остальных возможностей -- они зависят от окружения, в котором запущен JavaScript. 
+
+В браузере JavaScript умеет делать все, что относится к манипуляции со страницей, взаимодействию с посетителем и, в какой-то мере, с сервером: 
+
+<ul>
+<li>Создавать новые HTML-теги, удалять существующие, менять стили элементов, прятать, показывать элементы и т.п.</li>
+<li>Реагировать на действия посетителя, обрабатывать клики мыши, перемещение курсора, нажатие на клавиатуру и т.п. </li>
+<li>Посылать запросы на сервер и загружать данные без перезагрузки страницы(эта технология называется &quot;AJAX&quot;).</li>
+<li>Получать и устанавливать cookie, запрашивать данные, выводить сообщения...</li>
+<li>...и многое, многое другое!</li> 
+</ul>
+
+## Что НЕ умеет JavaScript?   
+
+JavaScript -- быстрый и мощный язык, но браузер накладывает на его исполнение некоторые ограничения.. 
+
+Это сделано для безопасности пользователей, чтобы злоумышленник не мог с помощью JavaScript получить личные данные или как-то навредить компьютеру пользователя. 
+
+Этих ограничений нет там, где JavaScript используется вне браузера, например на сервере. Кроме того, различные браузеры предоставляют свои механизмы по установке плагинов и расширений, которые обладают расширенными возможностями, но требуют специальных действий по установке от пользователя
+
+**Большинство возможностей JavaScript в браузере ограничено текущим окном и страницей.**
+
+<img src="jslimit.jpg">
+
+<ul>
+<li>JavaScript не может читать/записывать произвольные файлы на жесткий диск, копировать их или вызывать программы. Он не имеет прямого доступа к операционной системе.
+
+Современные браузеры могут работать с файлами, но эта возможность ограничена специально выделенной директорией -- *"песочницей"*. Возможности по доступу к устройствам также прорабатываются в современных стандартах и частично доступны в некоторых браузерах.
+</li>
+<li>JavaScript, работающий в одной вкладке, не может общаться с другими вкладками и окнами, за исключением случая, когда он сам открыл это окно или несколько вкладок из одного источника (одинаковый домен, порт, протокол).
+
+Есть способы это обойти, и они раскрыты в учебнике, но они требуют внедрения специального кода на оба документа, которые находятся в разных вкладках или окнах. Без него, из соображений безопасности, залезть из одной вкладки в другую при помощи JavaScript нельзя. 
+</li>
+<li>Из JavaScript можно легко посылать запросы на сервер, с которого пришла страница. Запрос на другой домен тоже возможен, но менее удобен, т.к. и здесь есть ограничения безопасности. 
+</li>
+</ul>
+
+## В чем уникальность JavaScript?   
+
+Есть как минимум *три* замечательных особенности JavaScript:
+
+[compare]
++Полная интеграция с HTML/CSS.
++Простые вещи делаются просто.
++Поддерживается всеми распространенными браузерами и включен по умолчанию.
+[/compare]
+
+**Этих трёх вещей одновременно нет больше ни в одной браузерной технологии.** Поэтому JavaScript и является самым распространенным средством создания браузерных интерфейсов.
+
+## Тенденции развития.   
+
+Перед тем, как вы планируете изучить новую технологию, полезно ознакомиться с ее развитием и перспективами. Здесь в JavaScript всё более чем хорошо.
+
+### HTML 5
+
+*HTML 5* -- эволюция стандарта HTML, добавляющая новые теги и, что более важно, ряд новых возможностей браузерам.
+
+Вот несколько примеров:
+<ul>
+<li>Чтение/запись файлов на диск (в специальной "песочнице", то есть не любые).</li>
+<li>Встроенная в браузер база данных, которая позволяет хранить данные на компьютере пользователя.</li>
+<li>Многозадачность с одновременным использованием нескольких ядер процессора.</li>
+<li>Проигрывание видео/аудио, без Flash.</li>
+<li>2d и 3d-рисование с аппаратной поддержкой, как в современных играх.</li>
+</ul>
+
+Многие возможности HTML5 всё ещё в разработке, но браузеры постепенно начинают их поддерживать.
+
+[summary]Тенденция: JavaScript становится всё более и более мощным и возможности браузера растут в сторону десктопных приложений.[/summary]
+
+### EcmaScript 6
+
+Сам язык JavaScript улучшается. Современный стандарт EcmaScript 5 включает в себя новые возможности для разработки, EcmaScript 6 будет шагом вперёд в улучшении синтаксиса языка.
+
+Современные браузеры улучшают свои движки, чтобы увеличить скорость исполнения JavaScript, исправляют баги и стараются следовать стандартам.
+
+[summary]Тенденция: JavaScript становится всё быстрее и стабильнее.[/summary]
+
+Очень важно то, что новые стандарты HTML5 и ECMAScript сохраняют максимальную совместимость с предыдущими версиями. Это позволяет избежать неприятностей с уже существующими приложениями.
+
+Впрочем, небольшая проблема с HTML5 всё же есть. Иногда браузеры стараются включить новые возможности, которые еще не полностью описаны в стандарте, но настолько интересны, что разработчики просто не могут ждать.  
+
+...Однако, со временем стандарт меняется и браузерам приходится подстраиваться к нему, что может привести к ошибкам в уже написанном (старом) коде. Поэтому следует дважды подумать перед тем, как применять на практике такие "супер-новые" решения.
+
+При этом все браузеры сходятся к стандарту, и различий между ними уже гораздо меньше, чем всего лишь несколько лет назад.
+
+[summary]Тенденция: всё идет к полной совместимости со стандартом.[/summary]
+
+## Недостатки JavaScript
+
+Зачастую, недостатки подходов и технологий -- это обратная сторона их полезности. Стоит ли упрекать молоток в том, что он -- тяжелый? Да, неудобно, зато гвозди забиваются лучше.
+
+В JavaScript, однако, есть вполне объективные недоработки, связанные с тем, что язык, по выражению его автора (Brendan Eich) делался "за 10 бессонных дней и ночей". Поэтому некоторые моменты продуманы плохо, есть и откровенные ошибки (которые признает тот же Brendan). 
+
+Конкретные примеры мы увидим в дальнейшем, т.к. их удобнее обсуждать в процессе освоения языка.
+
+Пока что нам важно знать, что некоторые "странности" языка не являются чем-то очень умным, а просто не были достаточно хорошо продуманы в своё время. В этом учебнике мы будем обращать особое внимание на основные недоработки и "грабли". Ничего критичного в них нет, если знаешь -- не наступишь.
+
+**В новых версиях JavaScript (ECMAScript) эти недостатки постепенно убирают.** 
+
+Процесс внедрения небыстрый, в первую очередь из-за старых версий IE, но они постепенно вымирают. Современный IE в этом отношении несравнимо лучше.
+

1-js/1-getting-started/2-alternatives/article.md

@@ -0,0 +1,101 @@
+# Альтернативные браузерные технологии
+
+Современный JavaScript используется во многих областях. Если говорить о браузерах, то вместе с JavaScript на страницах используются и другие технологии.
+
+Самые извеcтные -- это Flash, Java, ActiveX/NPAPI. Связка с ними может помочь достигнуть более интересных результатов в тех местах, где браузерный JavaScript пока не столь хорош, как хотелось бы. 
+
+[cut]
+
+## Java   
+
+Java -- язык общего назначения, на нем можно писать самые разные программы. Для интернет-страниц есть особая возможность - написание *апплетов*.
+
+*Апплет* -- это программа на языке Java, которую можно подключить к HTML при помощи тега `applet`:
+
+```html
+<!--+ run -->
+<applet code="BTApplet.class" codebase="/files/tutorial/intro/alt/">
+  <param name="nodes" value="50,30,70,20,40,60,80,35,65,75,85,90">
+  <param name="root" value="50">
+</applet>
+```
+
+Такой тег загружает Java-программу из файла `BTApplet.class` и выполняет ее с параметрами `param`. Апплет выполняется в отдельной части страницы, в прямоугольном "контейнере". Все действия пользователя внутри него обрабатывает апплет. Контейнер, впрочем, может быть и спрятан, если апплету нечего показывать.
+
+Конечно, для этого на компьютере должна быть установлена и включена среда выполнения Java, включая браузерный плагин. Статистика показывает, что это около 80% компьютеров. Кроме того, апплет должен быть подписан сертификатом издателя (в примере выше апплет без подписи), иначе Java заблокирует его.
+
+**Чем нам, JavaScript-разработчикам, может быть интересен Java?**
+
+В первую очередь тем, что подписанный Java-апплет может всё то же, что и обычная программа, установлена на компьютере посетителя.
+
+При попытке сделать потенциально опасное действие -- пользователь получает вопрос, который выглядит примерно так:
+
+<img src="allow.png">
+
+Обойти это подтверждение или поменять его внешний вид нельзя. То есть, согласие посетителя действительно необходимо. 
+
+И если оно есть -- то Java-апплет может выполнять любые действия, в отличие от JavaScript.
+
+[compare]
++Java может делать *всё* от имени посетителя, совсем как установленная программа. В целях безопасности, потенциально опасные действия требуют подписанного апплета и доверия пользователя.
+-Java требует больше времени для загрузки.
+-Среда выполнения Java, включая браузерный плагин, должна быть установлена на компьютере посетителя и включена. Таких посетителей в интернет -- около 80%.
+-Java-апплет не интегрирован с HTML-страницей, а выполняется отдельно. Но он может вызывать функции JavaScript.
+[/compare]
+
+Подписанный Java-апплет -- это возможность делать все, что угодно, на компьютере посетителя, если он вам доверяет. 
+
+Java и JavaScript могут взаимодействовать, так что можно вынести в Java те вызовы, которым нужно обойти контекст безопасности, а для самой страницы использовать JavaScript.
+
+
+## ActiveX/NPAPI, плагины и расширения для браузера
+
+ActiveX для IE и NPAPI для остальных браузеров позволяют писать плагины для браузера, в том числе на языке C. Как и в ситуации с Java-апплетом, посетитель поставит их в том случае, если вам доверяет.
+
+Эти плагины могут как отображать содержимое специального формата (плагин для проигрывания музыки, для показа PDF), так и взаимодействовать со страницей.
+
+ActiveX при этом еще и очень удобен в установке. Лично я - не фанат Microsoft, но видел отличные приложения, написанные на ActiveX и я могу понять, почему люди используют его и привязываются к IE.
+
+## Adobe Flash   
+
+Adobe Flash -- кросс-браузерная платформа для мультимедиа-приложений, анимаций, аудио и видео. 
+
+*Flash-ролик* -- это скомпилированная программа, написанная на языке ActionScript. Ее можно подключить к HTML-странице и запустить в прямоугольном контейнере.
+
+В первую очередь Flash полезен тем, что позволяет **кросс-браузерно** работать с микрофоном, камерой, с буфером обмена, а также поддерживает продвинутые возможности по работе с сетевыми соединениями. 
+
+[compare]
++Сокеты, UDP для P2P и другие продвинутые возможности по работе с сетевыми соединениями
++Поддержка мультмедиа: изображения, аудио, видео. Работа с веб-камерой и микрофоном.
+-Flash должен быть установлен и включен. А на некоторых устройствах он вообще не поддерживается.
+-Flash не интегрирован с HTML-страницей, а выполняется отдельно.
+-Существуют ограничения безопасности, однако они немного другие, чем в JavaScript.
+[/compare]
+
+**JavaScript и ActionScript могут вызывать функции друг друга**, поэтому обычно сайты используют JavaScript, а там, где он не справляется -- можно подумать о Flash.
+
+## Dart
+
+Язык Dart предложен компанией Google как замена JavaScript, у которого, по выражению создателей Dart, есть [фатальные недостатки](http://lurkmore.to/%D0%A4%D0%B0%D1%82%D0%B0%D0%BB%D1%8C%D0%BD%D1%8B%D0%B9_%D0%BD%D0%B5%D0%B4%D0%BE%D1%81%D1%82%D0%B0%D1%82%D0%BE%D0%BA). 
+
+Сейчас этот язык, хотя и доступен, находится в стадии разработки. Многие из возможностей еще ожидают своей реализации, есть ряд проблем. Другие ведущие интернет-компании объявляли о своей незаинтересованности в Dart. Но в будущем он может составить конкуренцию JS, если его доведут до ума.
+
+Программы на языке Dart специальным инструментом могут быть преобразованы в JavaScript. Конечно, при этом часть важных возможностей Dart теряется.
+
+## CoffeeScript
+
+Язык [CoffeeScript](http://coffeescript.org) -- это "синтаксический сахар" для JavaScript, который короче и, местами, проще. 
+
+Этот язык напрямую в браузере не работает, но предлагается специальная программа для преобразования CoffeeScript в JavaScript, и при этом, так как CoffeeScript изначально задумывался как преобразуемый в JavaScript, результирующий код выглядит вполне хорошо и работает тоже.
+
+Есть и другие языки, которые написаны "поверх" JavaScript, например [TypeScript](http://www.typescriptlang.org/). 
+
+Строго говоря, это не альтернативные технологии, для их использования необходимо, как базу, хорошо знать и понимать JavaScript.
+
+Возможно, вы захотите изучить этот язык после того, как освоите JavaScript, многим он нравится. 
+
+## Итого
+
+Язык JavaScript уникален благодаря своей полной интеграции с HTML/CSS. Он работает почти у всех посетителей.
+
+**...Но хороший JavaScript-программист не должен забывать и о других технологиях.** Ведь наша цель -- создание хороших приложений, и здесь Flash, Java, ActiveX/NPAPI имеют свои уникальные возможности, которые можно использовать вместе с JavaScript.

1-js/1-getting-started/3-pre-coding/article.md

@@ -0,0 +1,111 @@
+# Справочники и спецификации
+
+В этом разделе мы познакомимся со справочниками и спецификациями.
+
+Если вы только начинаете изучение, то вряд ли они будут нужны прямо сейчас. Тем не менее, эта глава находится в начале, так как предсказать точный момент, когда вы захотите заглянуть в справочник -- невозможно, но точно известно, что этот момент настанет. 
+
+Поэтому рекомендуется кратко взглянуть на эту страницу и взять её на заметку, чтобы при необходимости вернуться к ней в будущем.
+
+[cut]
+
+## Справочники, и как в них искать
+
+Самая полная и подробная информация по JavaScript и браузерам есть в справочниках.
+
+Её объём таков, что перевести все с английского невозможно. Даже сделать "единый полный справочник" не получается, так как изменений много и они постоянно происходят.
+
+Тем не менее, жить вполне можно если знать, куда смотреть.
+
+**Есть три основных справочника по JavaScript на английском языке**: 
+
+<ol>
+<li>[Mozilla Developer Network](https://developer.mozilla.org/) -- содержит информацию, верную для основных браузеров. Также там присутствуют расширения только для Firefox, они помечены.
+
+Когда мне нужно быстро найти "стандартную" информацию по `RegExp` - ввожу в Google **"RegExp MDN"**, и ключевое слово "MDN" (Mozilla Developer Network) приводит к информации из этого справочника.
+</li>
+<li>[MSDN](http://msdn.microsoft.com) -- справочник от Microsoft. Там много информации, в том числе и по JavaScript (они называют его "JScript"). Если нужно что-то, специфичное для IE -- лучше лезть сразу туда. 
+
+Например, для информации об особенностях `RegExp` в IE -- полезное сочетание: **"RegExp msdn"**. Иногда к поисковой фразе лучше добавить термин "JScript": **"RegExp msdn jscript"**. </li>
+<li>[Safari Developer Library](https://developer.apple.com/library/safari/navigation/index.html) -- менее известен и используется реже, но в нём тоже можно найти ценную информацию.</li> 
+</ol>
+
+Есть ещё справочники, не от разработчиков браузеров, но тоже хорошие:
+
+<ol>
+<li>[http://help.dottoro.com]() -- содержит подробную информацию по HTML/CSS/JavaScript.</li>
+<li>[http://javascript.ru/manual]() -- справочник по JavaScript на русском языке, он содержит основную информацию по языку, без функций для работы с документом. К нему можно обращаться и по адресу, если знаете, что искать. Например, так: [http://javascript.ru/RegExp]().
+</li>
+<li>[http://www.quirksmode.org]() -- информация о поддержке тех или иных возможностей и несовместимостях. 
+Для поиска можно пользоваться комбинацией **"quirksmode onkeypress"** в Google.
+</li>
+</ol>
+
+## Спецификации
+
+Спецификация -- это самый главный, определяющий документ, в котором написано, как себя ведёт JavaScript, браузер, CSS и т.п.
+
+Если что-то непонятно, и справочник не даёт ответ, то спецификация, как правило, раскрывает тему гораздо глубже и позволяет расставить точки над i.
+
+### Спецификация ECMAScript
+
+Спецификация (формальное описание синтаксиса, базовых объектов и алгоритмов) языка Javascript называется <a href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript</a>. 
+
+Ее перевод есть на сайте в разделе [стандарт языка](http://javascript.ru/ecma).
+
+[smart header="Почему не просто &quot;JavaScript&quot; ?"]
+Вы можете спросить: "Почему спецификация для JavaScript не называется просто *"JavaScript"*, зачем существует какое-то отдельное название?"
+
+Всё потому, что JavaScript&trade; -- зарегистрированная торговая марка, принадлежащая корпорации Oracle. 
+
+Название "ECMAScript" было выбрано, чтобы сохранить спецификацию независимой от владельцев торговой марки.
+[/smart]
+
+Спецификация может рассказать многое о том, как работает язык, и является самым фундаментальным, доверенным источником информации.
+
+Мы живем во время, когда все быстро изменяется. Современный стандарт -- это <a href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMA-262 5.1</a> (или просто ES5), поддерживается всеми современными браузерами.
+
+Не за горами -- новая спецификация ES6, в которой предусмотрены еще много полезных возможностей, делающих разработку быстрее и веселее :)
+
+### Спецификации HTML/CSS 
+
+JavaScript -- язык общего назначения, поэтому в спецификации ECMAScript нет ни слова о браузерах. 
+
+Соответствующую информацию вы можете найти на сайте [w3.org](http://w3.org). Там расположены стандарты HTML, CSS и многие другие. 
+
+К сожалению, найти в этой куче то, что нужно, может быть нелегко, особенно когда неизвестно в каком именно стандарте искать. Самый лучший способ -- попросить Google с указанием сайта. 
+
+Например, для поиска `document.cookie` набрать [document.cookie site:w3.org](https://www.google.com/search?q=document.cookie+site%3Aw3.org). 
+
+Последние версии стандартов расположены на домене [dev.w3.org](http://dev.w3.org).
+
+## Итого
+
+Итак, посмотрим какие у нас есть источники информации.
+
+Справочники:
+<ul>
+<li><a href="https://developer.mozilla.org/">Mozilla Developer Network</a> -- информация для Firefox и большинства браузеров. 
+Google-комбо: `"RegExp MDN"`, ключевое слово "MDN".</li>
+<li><a href="http://msdn.microsoft.com/">MSDN</a> -- информация по IE. 
+Google-комбо: `"RegExp msdn"`. Иногда лучше добавить термин "JScript": `"RegExp msdn jscript"`.</li>
+<li>[Safari Developer Library](https://developer.apple.com/library/safari/navigation/index.html) -- информация по Safari.</li>
+<li><a href="http://help.dottoro.com">http://help.dottoro.com</a> -- подробная информация по HTML/CSS/JavaScript с учетом браузерной совместимости.
+Google-комбо: `"RegExp dottoro"`.</li>
+<li>[](http://javascript.ru/manual) -- справочник по JavaScript на русском языке. К нему можно обращаться и по адресу, если знаете, что искать. Например, так: [](http://javascript.ru/RegExp).
+Google-комбо: `"RegExp site:javascript.ru"`.
+</li>
+</ul>
+
+Спецификации содержат важнейшую информацию о том, как оно "должно работать":
+
+<ul>
+<li>JavaScript, современный стандарт [ES5 (англ)](http://www.ecma-international.org/publications/standards/Ecma-262.htm), и предыдущий [ES3 (рус)](http://javascript.ru/ecma).</li>
+<li>HTML/DOM/CSS -- на сайте [w3.org](http://www.w3.org).
+Google-комбо: `"document.cookie site:w3.org"`.</li>
+</ul>
+
+То, как оно на самом деле работает и несовместимости:
+
+<ul>
+<li>Смотрите <a href="http://www.quirksmode.org/">http://www.quirksmode.org/</a>. Google-комбо: `"innerHeight quirksmode"`.</li>
+</ul>

1-js/1-getting-started/4-editor/article.md

@@ -0,0 +1,70 @@
+# Редакторы для кода
+
+Для разработки обязательно нужен хороший редактор. 
+
+Тот, который вы выберете должен иметь в своем арсенале:
+
+<ol>
+<li>Подсветку синтаксиса.</li>
+<li>Автодополнение.</li>
+<li>"Фолдинг" (от англ. folding) -- возможность скрыть-раскрыть блок кода.</li>
+</ol>
+
+[cut]
+## IDE
+
+Термин IDE (Integrated Development Environment) -- "интегрированная среда разработки", означает редактор, который расширен большим количеством "наворотов", умеет работать со вспомогательными системами, такими как багтрекер, контроль версий, и много чего ещё.
+
+Как правило, IDE загружает весь проект целиком, поэтому может предоставлять автодополнение по функциям всего проекта, удобную навигацию по его файлам и т.п.
+
+Если вы еще не задумывались над выбором IDE, присмотритесь к следующим вариантам. 
+
+<ul>
+<li>Продукты IntelliJ: [WebStorm](http://www.jetbrains.com/webstorm/), а также в зависимости от дополнительного языка программирования [PHPStorm (PHP)](http://www.jetbrains.com/phpstorm/), [IDEA (Java)](http://www.jetbrains.com/idea/), [RubyMine (Ruby)](http://www.jetbrains.com/ruby/) и другие.</li>
+<li>Visual Studio, в сочетании с разработкой под .NET (Win)</li>
+<li>Продукты на основе Eclipse, в частности [Aptana](http://www.aptana.com/) и Zend Studio</li>
+<li>[Komodo IDE](http://www.activestate.com/komodo-ide) и его облегчённая версия [Komodo Edit](http://www.activestate.com/komodo-edit).</li>
+<li>[Netbeans](http://netbeans.org/)</li>
+</ul>
+
+Почти все они, за исключением Visual Studio, кросс-платформенные.
+
+Сортировка в этом списке ничего не означает. Выбор осуществляется по вкусу и по другим технологиям, которые нужно использовать вместе с JavaScript.
+
+Большинство IDE -- платные, с возможностью скачать и бесплатно использовать некоторое время. Но их стоимость, по сравнению с зарплатой веб-разработчика, невелика, поэтому ориентироваться можно на удобство.
+
+## Лёгкие редакторы
+
+Лёгкие редакторы -- не такие мощные, как IDE, но они быстрые и простые, мгновенно стартуют. 
+
+Основная сфера применения лёгкого редактора -- мгновенно открыть нужный файл, чтобы что-то в нём поправить.
+
+На практике "лёгкие" редакторы могут обладать большим количеством плагинов, так что граница между IDE и "лёгким" редактором размыта, спорить что именно редактор, а что IDE -- не имеет смысла. 
+
+Достойны внимания:
+
+<ul>
+<li><a href="http://www.sublimetext.com">Sublime Text</a> (кросс-платформенный, shareware).</li>
+<li>TextMate (Mac, платный)</li>
+<li><a href="http://www.scintilla.org/">SciTe</a> простой, легкий и очень быстрый (Windows, бесплатный).</li>
+<li><a href="http://sourceforge.net/projects/notepad-plus/">Notepad++</a> (Windows, бесплатный).</li>
+<li>Vim, Emacs. Если умеете их готовить.</li>
+</ul>
+
+## Мои редакторы
+
+Лично мои любимые редакторы:
+
+<ul>
+<li>Как IDE -- редакторы от Jetbrains: для чистого JavaScript [WebStorm](http://www.jetbrains.com/webstorm/), если ещё какой-то язык, то в зависимости от языка: [PHPStorm (PHP)](http://www.jetbrains.com/phpstorm/), [IDEA (Java)](http://www.jetbrains.com/idea/), [RubyMine (Ruby)](http://www.jetbrains.com/ruby/). У них есть и другие редакторы под разные языки, но я ими не пользовался.</li>
+<li>Как быстрый редактор -- <a href="http://www.sublimetext.com">Sublime Text</a>.</li>
+<li>Иногда Visual Studio, если разработка идёт под платформу .NET (Win).</li>
+</ul>
+
+Если не знаете, что выбрать -- можно посмотреть на них ;)
+
+## Не будем ссориться
+
+В списках выше перечислены редакторы, которые использую я или мои знакомые -- хорошие разработчики. Конечно, существуют и другие отличные редакторы, если вам что-то нравится -- пользуйтесь.
+
+Выбор редактора, как и любого инструмента, во многом индивидуален и зависит от ваших проектов, привычек, личных предпочтений.

1-js/1-getting-started/5-devtools/article.md

@@ -0,0 +1,112 @@
+# Консоль разработчика
+
+При разработке скриптов всегда возможны ошибки... Впрочем, что я говорю? У вас абсолютно точно будут ошибки, если конечно вы -- человек, а не <a href="http://ru.wikipedia.org/wiki/%D0%91%D0%B5%D0%BD%D0%B4%D0%B5%D1%80_(%D0%A4%D1%83%D1%82%D1%83%D1%80%D0%B0%D0%BC%D0%B0)">робот инопланетный</a>.
+
+Чтобы читать их в удобном виде, а также получать массу полезной информации о выполнении скриптов, в браузерах есть *инструменты разработки*.  
+
+**Для разработки рекомендуется использовать Chrome или Firefox.**
+
+Другие браузеры, как правило, находятся в положении "догоняющих" по возможностям встроенных инструментов разработки. Если ошибка, к примеру, именно в Internet Explorer, тогда уже смотрим конкретно в нём, но обычно -- Chrome/Firefox.
+
+В инструментах разработчика предусмотрена масса возможностей, но на текущем этапе мы просто посмотрим, как их открывать, смотреть в консоли ошибки и запускать команды JavaScript.
+
+[cut]
+
+## Google Chrome   
+
+Откройте страницу [bug.html](/devtools/bug.html). 
+
+В её JavaScript-коде есть ошибка. Конечно, обычному посетителю она не видна, нужно открыть инструменты разработчика.
+
+Для этого используйте сочетание клавиш [key Ctrl+Shift+J], а если у вас Mac, то [key Cmd+Shift+J].
+
+При этом откроются инструменты разработчика и вкладка Console, в которой будет ошибка.
+
+Выглядеть будет примерно так:
+
+<img src="chrome.png">
+
+
+<ul>
+<li>При клике на `bug.html` вы перейдёте во вкладку с кодом к месту ошибки, там будет и краткое описание ошибки. 
+В данном случае ошибка вызвана строкой `lalala`, которая интерпретатору непонятна. </li>
+<li>Здесь же вы можете набирать команды на JavaScript, например наберите `alert("Hello")` -- команду вывода сообщения. Мы познакомимся с этой и другими командами далее.</li>
+<li>Для запуска команды в консоли, нажмите [key Enter], для перевода курсора на следующую строку (если команда состоит из нескольких строк) --  [key Shift+Enter].</li> 
+</ul>
+
+Далее в учебнике мы подробнее рассмотрим отладку в Chrome в главе [](/debugging-chrome).
+
+## Firefox   
+
+Для разработки в Firefox используется расширение Firebug. 
+
+<ol>
+<li>Первым делом его надо установить.
+
+Это можно сделать со страницы <a href="https://addons.mozilla.org/ru/firefox/addon/firebug/">https://addons.mozilla.org/ru/firefox/addon/firebug/</a>.
+
+Перезапустите браузер. Firebug появится в правом-нижнем углу окна:
+
+<img src="firebug-gray.png">
+
+Если иконки не видно -- возможно, у вас выключена панель расширений. Нажмите [key Ctrl+\] для ее показа. 
+
+Ну а если ее нет и там, то нажмите [key F12] -- это горячая клавиша для запуска Firebug, расширение появится, если установлено.
+</li>
+<li>Далее, для того чтобы консоль заработала, её надо включить.
+
+Если консоль уже была включена ранее, то этот шаг не нужен, но если она серая -- выберите в меню `Консоль` и включите её:
+
+<img src="firefox_console_enable.png">
+</li>
+<li>Для того, чтобы Firebug работал без глюков, желательно сначала открыть Firebug, а уже потом -- зайти на страницу.
+
+С открытым Firebug зайдите на страницу с ошибкой: [bug.html](/devtools/bug.html).
+
+Консоль покажет ошибку:
+
+<img src="firefox.png">
+
+Кликните на строчке с ошибкой и браузер покажет исходный код. При необходимости включайте дополнительные панели.
+</li>
+</ol>
+
+Как и в Chrome, можно набирать и запускать команды, область для команд на рисунке находится справа, запуск команд осуществляется нажатием [key Ctrl+Enter] (для Mac -- [key Cmd]).
+
+Можно перенести её вниз. нажав на кнопочку <img src="firefox_console_down.png"> --  на рисунке она не видна, но есть справа-снизу панели разработки.
+
+Об основных возможностях можно прочитать на сайте <a href="http://firebug.ru">firebug.ru</a>.
+
+## Internet Explorer   
+
+Панель разработчика запускается нажатием [key F12].
+
+Откройте её и зайдите на страницу с ошибкой: [bug.html](/devtools/bug.html). Если вы разобрались с Chrome/Firefox, то дальнейшее будет вам более-менее понятно, так как инструменты IE построены позже и по аналогии с Chrome/Firefox.
+
+## Safari   
+
+Горячие клавиши: [key Ctrl+Shift+I], [key Ctrl+Alt+C] для Mac -- [key Cmd] вместо [key Ctrl].
+
+Для доступа к функционалу разработки через меню:
+
+<ol>
+<li>
+В Safari первым делом нужно активировать меню разработки.
+
+Откройте меню, нажав на колесико справа-сверху и выберите `Настройки`.
+
+Затем вкладка `Дополнительно`:
+<img src="safari.png">
+
+Отметьте `Показывать меню "Разработка" в строке меню`. Закройте настройки.
+</li>
+<li>Нажмите на колесико и выберите `Показать строку меню`.
+
+Инструменты будут доступны в появившейся строке меню, в пункте `Разработка`.</li>
+</ol>
+
+## Итого
+
+Мы разобрали, как открывать инструменты разработчика и смотреть ошибки, а также запускать простые команды, не отходя от браузера.
+
+Далее мы приступим к изучению JavaScript.

1-js/1-getting-started/index.md

@@ -0,0 +1,3 @@
+# Введение
+
+Про язык JavaScript и окружение для разработки на нём.