Что в JavaScript-инструментов?


Я ищу, чтобы начать писать сложное приложение в JavaScript для запуска в интернете. Раньше я писал небольшие биты одноразового кода в JavaScript, используя DOM напрямую и немного jQuery. Но это первый раз, когда я ищу, чтобы написать полноценное приложение для запуска в браузере.

Итак, мне интересно, какие toolchains люди предпочитают для серьезной разработки в JavaScript. В частности, меня интересует следующее, наряду с некоторыми информация о том, почему вы выбрали компоненты, которые вы сделали, и как они все помещаются в рабочий процесс:

  • какой редактор и редактор плагинов / режимов / скриптов вы используете? Я вообще пользователь Emacs, и я использую js2.el на данный момент, но мне интересно услышать о других установках.
  • вы используете какой-либо IDE (Aptana, Dashcode или тому подобное)?
  • какие библиотеки JavaScript или фреймворки вы используете?
  • вы используете какой-либо из языков что компилировать на JavaScript (GWT, haxe, Objective-J)?
  • какие платформы модульного тестирования вы используете? Как вы их вызываете? Могут ли они быть вызваны из вашего редактора / IDE, из командной строки, из браузера на веб-странице, из вашего отладчика JavaScript?
  • какие автоматизированные инструменты тестирования пользовательского интерфейса вы используете (например, Selenium, Watir, Sahi)? Опять же, как они могут быть вызваны? (Возможность вызывать модульные тесты и интерфейсные тесты из командной строки была бы очень полезна, для запуск buildbots)
  • какие другие инструменты качества кода Вы используете (JSlint, инструменты покрытия кода или что-нибудь в этом роде)?
  • что вы используете для своей среды отладки (Firebug, webkit inspector и т. д.)? Имеет ли он какую-либо интеграцию с вашим редактором или IDE?
  • какой пост-обработки вы работать на ваш код перед его развертыванием (обфускаторы, minifiers, всякого рода оптимизаторов)?
  • есть ли у вас какие-либо инструменты для управления зависимостями модулей или динамическая загрузка кода по мере необходимости? Приложение, которое я пишу, будет работать с большим количеством кода, и я хотел бы сократить время загрузки, поэтому инструменты для отслеживания необходимых модулей или загрузки кода по требованию будут полезны.
  • есть ли другие важные инструменты в вашей цепочке инструментов (которые специфичны для разработки JavaScript для приложений на основе браузера; у меня уже есть отличная система управления версиями, трекер ошибок и т. д.)?

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

edit: меня особенно интересуют фреймворки тестирования устройств и пользовательского интерфейса, а также то, как вы их автоматизируете. Я предпочитаю иметь возможность запускать одну задачу" make test "или" rake test " из командной строки для запуска всех тестов для проектов и возвращать статус в зависимости от успеха или неудачи тестов. Это позволит значительно упростить интеграцию с buildbots. Кроме того, мне интересно, если кто-нибудь пишет модульные тесты, которые могут быть запущены за пределами a браузер (в Rhino, spidermonkey, v8 или тому подобное) для кода, который не зависит от браузера, для более быстрого оборота на подмножестве ваших тестов.

10 56

10 ответов:

какой редактор и редактор Плагины/режимы/скрипты вы используете? Я как правило, пользователь Emacs, и я использую СП2.Эл на данный момент, но я интересно услышать о других установки.

Я обычно использую TextmateJavaScript,jQuery и прототип связки). При выполнении тяжелой интерфейсной разработки, где я быстро переключаюсь между файлами HTML, CSS и JavaScript, я выберу vim разделенные виды панелей. При этом я либо использую macvim или терминал + козырек, в зависимости от моего настроения. Очевидно, что я пользователь Mac.

вы используете какой-либо IDE (Aptana, Dashcode, или тому подобное)?

нет. Я использовал, чтобы использовать кода, но его функции текстового редактора оставляют желать лучшего. Я также играл с кофе, который интересен...но МЕ.

Какой JavaScript библиотеки или фреймворки вы используете?

Я использую как jQuery и прототип в зависимости от потребностей проекта. Чтобы проиллюстрировать сильные стороны каждой соответствующей структуры, я хотел бы обратиться к jQuery как DOM манипуляции рамки и прототип a scripting framework. Соответственно, я склонен использовать jQuery в проектах, которые фокусируются на разметке и прототипе на более сложных сценариях, проектах типа приложений.

вы используете какой-либо из языков, которые компиляция на JavaScript (GWT, haxe, Цель-Джей)?

абсолютно нет-у меня есть философские претензии с такими рамками. В отличие от кода на стороне сервера, интерфейсный код выполняется в браузере пользователя, в среде, которую вы не можете контролировать. Таким образом, я вижу, что ответственность за созданиелучший возможный код. Неоптимальный код может иметь последствия для производительности, и JavaScript, скомпилированный такими языками, как Objective-J (который является единственным из вашего списка, который я использовал), никогда не будет таким же жестким, как код, созданный сильным разработчиком JavaScript.

какие платформы модульного тестирования вы используете? Как вы их вызываете? Могут ли они быть вызывается из редактора/IDE, а от командную строку из браузера в веб-страница, из вашего JavaScript отладчик?

Я большой поклонник QUnit, блок jQuery рамки тестирования. Додзе модульное тестирование DOH тоже приятно.

Не упустите FireUnit, изящное расширение Firebug для модульного тестирования.

см. Также бритвы.

что такое автоматизированное тестирование пользовательского интерфейса инструменты, которые вы используете (например, селен, Ватир, Сахи)? Опять же, как это может быть вызывали? (Будучи в состоянии вызвать блок тесты и тестирование интерфейсов командная строка была бы очень полезна, для бегущий buildbots)

при необходимости я использую селен, но это редкость.

какие другие инструменты качества кода Вы используете (JSlint, инструменты покрытия кода, или что-нибудь в этом роде)?

Я использую и любовь JSLint.

Firebug имеет хороший расширение покрытия кода и HRCov широко считается лучшим из породы. Я не нахожу много пользы для покрытия кода в большинстве моя повседневная работа на JavaScript.

что вы используете для отладки окружающая среда (Firebug, WebKit инспектор и т. д.)? Есть ли интеграция с вашим редактором или IDE?

насколько я понимаю, Firebug-это приложение-убийца для разработки JavaScript. Некоторые полезные функции отладки:

  • переменной подсказки
  • точки останова и условные точки останова
  • производительность профилировщик
  • очень изящный API консоли
  • следите за выражениями
  • трассировки стека
  • полезные плагины, такие как Jiffy,FireCookie и FireQuery.

инспектор WebKit хорош, как и Стрекоза и Debug Bar полезно для отслеживания ошибок IE...но FireBug-это тот, кто для меня.

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

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

был только один случай, когда я необходимо минимизировать JavaScript для экономии пропускной способности. В этом случае я установил SVN post-commit hook чтобы запустить Дуг Крокфорд отлично JSMin.

есть ли другие необходимые инструменты в ваша цепочка инструментов (которые специфичны для JavaScript для браузера приложения; у меня уже есть вполне хорошая система контроля версий , трекер ошибок и т. д.)?

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

  • IntelliJ IDEA / RubyMine для редактирования.
  • jQuery + плагины из-за его сходства с Ruby
  • используете ли вы какой-либо из языков, которые компилируются в JavaScript (GWT, haxe, Objective-J)?
  • JSUnit с Blue Ridge (Rails package), но больше полагайтесь на тесты Селена
  • нет инструментов качества кода за пределами парного программирования и тесты
  • отладка с Firebug в основном
  • полагайтесь на сжатие gzip для уменьшения космос
  • создать много небольших модульных файлов JS
  • используйте rails для статического объединения и автоматического включения этих файлов по мере необходимости. Это пользовательский код, но я написал об этом в блоге. Это позволяет вам сохранять модульность по мере роста развития
  • построить довольно много плагинов jQuery для управления виджетами на сайте

только что начал использовать RubyMine в качестве JavaScript IDE, исключительно для поддержки JavaScript, что довольно хорошо. Это то же самое, что и в IntelliJ IDEA.

для отладки Firebug является очевидным must-have, хотя он немного снизился в последнее время, на мой взгляд. Я обычно использую ведение журнала больше, чем отладчик, поэтому я нахожу log4javascript очень полезно (хотя я должен, вероятно, указать, что я написал его). Я также использую инспекторскую штуку WebKit и IE Отладчик 8 иногда и отладчик Visual Studio с более ранними версиями IE.

для качества кода я использую JSLint вручную и иногда, так как я не согласен с некоторыми из его рекомендаций. RubyMine / IntelliJ также имеет тонны "проверок" JS, которые анализируют ваш код, когда вы его пишете, и генерируют предупреждения рядом с вашим кодом, которые я нахожу полезными.

Я, как правило, развиваются на несколько страниц развития включают индивидные, unminified скрипты и при создании сборки, я запустите сценарий сборки (мой собственный, написанный в Ant), который проверяет мой код из системы управления версиями, объединяет отдельные сценарии, удаляет вызовы ведения журнала и отладки, минимизирует/сжимает (используя JSMin или YUICompressor) код и запускает модульные тесты. Мой сценарий модульного тестирования является моим собственным и ничего массово фантазии.

Это работает достаточно хорошо, но не идеально.

Я еще не написал ничего огромного в Javascript (около 3000 строк в моем последнем проекте), но я делаю JSLint мой код и минимизирую/объединяю его со всеми библиотеками, которые мне нужны в моем сценарии развертывания/сборки. Мой сценарий сборки также изменяет HTML-код от прямого импорта сценариев и библиотек до импорта производственного сжатого кода. Таким образом, вам не нужно запускать сценарий сборки, чтобы увидеть изменения в разработке, что очень важно.

Юи компрессора довольно медленно, тем более, что он запускает JVM для запуска, но он выполняет свою работу. Некоторая минимизация в вашем сценарии развертывания необходима, чтобы избавиться от всех комментариев, и если вы избегаете глобальных переменных, вы также получите значимое количество сжатия длины имени идентификатора, хотя и не много пользы после gzip. Возможно, вам понадобится еще один шаг для удаления консоли.отладочные строки и другой отладочный код.

для отладки, FireBug. Я уверен, что отладчик webkit в порядке тоже.

для разработки vim с улучшенным сценарием отступа js и ctags с некоторыми модификациями js. Я не уверен, какие преимущества имеет настоящая IDE, но я уверен, что они есть. Vim не делает подсветку синтаксиса HTML внутри строк javascript по умолчанию, но видимо, он может быть настроен на.

JSLint работает в Rhino легко, но spidermonkey выполняется примерно в 3 раза быстрее, так как ему не нужно запускать JVM. Крокфорд не поддерживает это но мне как-то удалось заставить его работать.

Я нахожусь в немного другом технологическом стеке (asp.net mvc), но вот он идет:

  • IDE: Visual Studio 2008 + ReSharper, Asp.Net MVC
  • редактор: Notepad++ (большая часть моего времени находится в VS, но Notepad++ имеет лучшую подсветку синтаксиса для JavaScript)
  • Dev Browser: FireFox + Firebug+YSlow+PageSpeed+FireCookie Также добавьте панель инструментов разработчика
  • другие браузеры: IE8, Chrome 3, Safari, Opera (редко используется), а также IE6 и IE7 через виртуальные машины (свободно загружаемые образы виртуальных ПК от Microsoft).
  • пост-обработка: компрессор JLint и YUI. У меня есть задача сборки сделать часть компрессора YUI.
  • JavaScript Framework: JQuery + jQuery UI
  • другие вещи: проверка JQuery, JSON2
  • редактор: Блокнот, или любой другой текст редактор с подсветкой синтаксиса

  • IDE: может быть Dreamweaver, Aptana, Netbeans-до вашего личного предпочтение.

  • Javascript Framework: я больше использую к jQuery и я все еще рекомендую jQuery.
    вы можете добавить некоторые плагины на jQuery. некоторые действительно крутые. как Facebox (http://famspam.com/facebox)-jQuery Facebook-как всплывающее окно, которое является простой в использовании. или плагин jQuery Cookie

  • Отладка: Firebug (FireCookie, Страница Скорость, YSlow) - нет интеграции с IDE, но это магия в браузере. Если вам нужна отладка кросс-браузера, вы может пойти на Firebug Lite.

    Вы можете легко использовать консоль.log () для отладки вместо предупреждения (особенно когда вы делаете javascript с большим количеством обратных вызовов, таймеров, AJAX и так далее. Вы не хотите, чтобы оператор оповещения сломался так, как он должен изначально быть.

  • пост-обработка: Пакер - http://dean.edwards.name/packer/

Google wave питается от GWT так это, кажется, хороший вариант для больших приложений.

Я использую Dashcode для разработки виджетов Mac, и для этого он " ОК " и имеет много функций, ориентированных на виджет, но для всего остального TextMate

веб-технология немного продвинулась, поэтому я подумал, что упомяну некоторые хорошие современные инструменты и рамки для тех, кто видит этот вопрос в 2017 году.

какой редактор и редактор плагинов / режимов / скриптов вы используете?

Атом это мой текстовый редактор по выбору, и поскольку я нахожусь в экосистеме MS, Visual Studio 2013-это IDE, которую я использую, хотя я избегаю VS для разработки JavaScript. Я делаю практически всю свою разработку JavaScript исключительно с помощью Atom wherever Но я могу.

У меня есть несколько плагинов, которые помогают моей работе.

  • атом-украсить который я использую, чтобы очистить любые проблемы стиля я мог бы представьте, он делает это на сохранение, так что делает вещи легко для меня, как я сохранить и регистрация часто.
  • atom-easy-jsdoc что позволяет мне вставлять комментарии с помощью jsdoc горячая клавиша комбо, это здорово, как это позволяет мне автоматически генерировать документация для кода, особенно полезная для Разработка API.
  • atom-ternjs это пакет, который я использую для завершения кода JavaScript, I не нужно это часто, но это удобно иметь.
  • миникарте это плагин, который позволяет мне видеть низкую детализацию контура всех код в конкретном документе, я считаю, что это проще в использовании, чем полоса прокрутки. МММ.
  • пигменты это плагин, который отображает цвета, когда он обнаруживает шестнадцатеричные цвета в CSS за текстом. Полезно, если вы нужно настроить и посмотреть результат быстро.

вы используете какой-либо IDE (Aptana, Dashcode или тому подобное)?

см. выше :)

какие библиотеки JavaScript или фреймворки вы используете?

Я обычно использую RequireJS для домашних проектов и загрузчик внутренних модулей на работе. Обычно я не использую библиотеки и фреймворки в своих проектах, хотя когда я это делаю, я довольно неравнодушен к AngularJS (1.икс.) Все это зависит от того, что я делаю.

вы используете любой из языков, которые компилируются в JavaScript (GWT, haxe, Цель-Джей)?

Неа.

какие платформы модульного тестирования вы используете? Как вы их вызываете? Могут ли они вызывается из вашего редактора / IDE, из командной строки, из браузер на веб-странице, из вашего отладчика JavaScript?

Я использую узел.js С карма тестов как тест бегун (кто бы мог подумать?),Жасмин как мой тестовый фреймворк и sinonJS как моя библиотека stubbing/mocking для разработки тестов.

карма может быть настроена для просмотра файловой системы для изменений (или бегун задачи, как grunt с плагинами для просмотра файлов тоже работает), и я выполняю все свои тесты каждый раз, когда файл сохраняется. Он имеет дополнительное преимущество в том, чтобы иметь возможность запускать тесты против нескольких браузеров одновременно. Так что он будет тестировать JS против IE, Edge, Chrome, Firefox, PhantomJS и др... Что чрезвычайно полезно.

У меня есть настройки проектов js для запуска задач grunt. Обычно я просто выполняю "grunt devmode" из командной строки / терминала, и все, мои тесты выполняются. Для непрерывной интеграции при фиксации у меня есть отдельная задача grunt, которая выполняет тесты только один раз. Для домашнего использования у меня есть TravisCI запустить эту задачу всякий раз, когда происходит толчок.

какие другие инструменты качества кода Вы используете (JSlint, инструменты покрытия кода, или что-нибудь в этом роде)?

Я использую JSHint, поскольку он менее разборчив, чем JSLint. Для покрытия кода я использую Istanbul, который, кстати, работает всякий раз, когда мои модульные тесты выполняются, что очень полезно.

Что вы используете для своей среды отладки (Firebug, WebKit инспектор и т. д.)? Имеет ли он какую-либо интеграцию с вашим редактором или IDE?

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

какую постобработку вы выполняете в своем коде перед его развертыванием (обфускаторы, минификаторы, любые виды оптимизаторов)?

Я вообще не делаю этого, что говорит для веб-проектов идеально минифер и уродливее.

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

Ага! Я использую RequireJS реализация AMD. Я использую npm как мой менеджер пакетов выбора, хотя если я использую Visual Studio, я буду использовать nuget.

есть ли другие важные инструменты в вашей цепочке инструментов (которые являются определенных в JavaScript разработка для браузерных приложений; I уже есть совершенно хорошая система контроля версий, баг-трекер, и т. д.)?

Не совсем уверен, что понимаю вопрос, но я использую Git для домашних проектов и TFS на работе, GitHub в качестве моего хоста РЕПО, TravisCI для непрерывной интеграции и комбинезонов (репортер покрытия кода для репозиториев Git).