it-swarm.com.ru

Что находится в вашем наборе инструментов JavaScript?

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

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

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

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

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

57
Brian Campbell

Какой редактор и плагины/режимы/скрипты редактора вы используете? Как правило, я пользователь Emacs и сейчас использую js2.el, но мне интересно узнать о других настройках.

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

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

Нет. Раньше я использовал Coda , но возможности его текстового редактора оставляют желать лучшего. Я также поиграл с Эспрессо , что интересно ... но, да.

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

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

Используете ли вы какие-либо языки, которые компилируются в JavaScript (GWT, haxe, Objective-J)?

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

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

Я большой поклонник QUnit , фреймворка для юнит-тестирования jQuery. Dojo's DOH Unit Testing тоже приятно.

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

Также смотрите Razor .

Какие инструменты автоматического тестирования пользовательского интерфейса вы используете (например, Selenium, Watir, Sahi)? Опять же, как они могут быть вызваны? (Возможность запуска модульных тестов и тестов интерфейса из командной строки была бы очень полезна для запуска сборочных ботов)

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

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

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

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

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

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

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

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

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

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

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

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

  • Функция alert() ;)
  • Также полезно Nice JSON validator .
  • Visual Event полезно для отладки событий
  • jsfuzzer , для фаззинга
  • Мне не нужно было его использовать, но Crosscheck есть в моем наборе инструментов.
31
c_harm

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

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

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

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

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

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

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

3
Tim Down

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

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

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

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

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

2
gravitation

Я использую несколько другой стек технологий (asp.net mvc), но здесь все сказано:

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

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

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

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

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

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

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

Смотри выше :)

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

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

Используете ли вы какие-либо языки, которые компилируются в JavaScript (GWT, haxe, Objective-J)?

Нету.

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

Я использую Node.js с Карма бегущий тест в качестве тестового бегуна (кто это сделал?), Жасмин в качестве моей тестовой платформы и - sinonJS как моя библиотека-заглушка для разработки тестов.

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

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

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

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

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

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

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

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

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

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

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

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

2
Daniel Lane
  • Редактор: Блокнот или любой другой текстовый редактор с подсветкой синтаксиса

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

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

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

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

  • Постобработка: упаковщик - http://dean.edwards.name/packer/

1
mauris

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

1
PurplePilot

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

1
Piotr Czapla

Единственное, что я склонен держать в уме, это jQuery для легкой манипуляции с DOM, но это не обязательно. Я не полагаюсь ни на какие рамки или что-либо еще; если мне нужно что-то написать, я просто пишу это в vim или в любом текстовом редакторе, который у меня есть (потому что я думаю, что IDE предназначены для людей, которые ленивы или в корпоративной/корпоративной среде). Если мне понадобится использовать фреймворк, я пойду и поищу его для любой цели, которая у меня будет. Но в конце дня я просто пишу Javascript. Я не специализируюсь ни на каких фреймворках, потому что все они со временем становятся старыми новостями. Гораздо эффективнее просто знать, как работает чертов язык, и уметь работать в любом контексте или ситуации, с фреймворком или библиотекой или без нее, чтобы все время держать вас за руку.

0
ozzmotik