Здесь собрано множество полезных инструментов для фронденд-разработчиков.
Автоматизированное тестирование, инструменты сборки, текстовые редакторы и т.д.
Автоматизированное тестирование
Это процесс, когда программные средства выполняют сценарии тестирования до выпуска продукта.
Сборник инструментов и экосистем для автоматизации процессов.
Инструмент для создания командной строки для JavaScript проектов.
Инструмент для автоматизации сложных процессов.
Сборщик модулей.
Здесь собраны текстовые редакторы для работы с исходным кодом веб-сайтов.
Инструменты для анализа и обработки CSS файлов.
Всё о написании, публикации и использовании документации.
Инструменты для обработки HTML кода.
Инструменты для изменения и оптимизации изображений.
Инструменты для статистического анализа и обработки JavaScript файлов.
Средства для автоматизации процессов установки, обновления, настройки и удаления компонентов.
Инструменты для контроля за изменениями, чтобы в любой момент можно было вернуться к более ранним версиям кода.
Автоматизированное тестирование, инструменты сборки, текстовые редакторы и т.д.
Автоматизированное тестирование
Это процесс, когда программные средства выполняют сценарии тестирования до выпуска продукта.
- : Эрик Эллиотт рассказывает, почему вам стоит заниматься TDD и Unit тестированием.
- : Автор рассказывает о своем опыте создания JavaScript приложения, а также о работе с сетевыми запросами и DOM.
- : Автор рассказывает о шаблонных ошибках и способах рефакторинга приложений.
- : Библиотека BDD / TDD утверждений для узлов и браузеров, которые работают с любой инфраструктурой тестирования JavaScript.
- : Программный инструмент, используемый для тестирования ПО c помощью BDD.
- : Тот же Cucumber, написанный на чистом JavaScript, а значит работающий на любой JavaScript платформе.
- : Cucumber, имеющий несколько отличий от оригинального. Основное преимущество — тесты могут быть разработаны не обязательно тестировщиками, а людьми которые вообще могут не знать программирования, например бизнес-аналитиками.
- : Инструмент для оценки пользовательских интерфейсов HTML на соответствие определённым стандартам UI.
- : Фреймворк для BDD тестирования, не зависящий от браузеров, DOM и других фреймворков.
- : Всё о видах автоматизированного тестирования, чтобы избежать ошибок при запуске продукта.
- : Фреймворк для юнит-тестов, используемый Facebook для тестирования сервисов и React приложений.
- : Инструмент для исполнения кода в разных браузерах.
- : Расширение для работы с и .
- : Делает скриншоты и сравнивает их с базовыми изображениями для проверки различий в пикселях RGB, а затем помогает устранить различия.
- : Фреймворк для модульного тестирования JavaScript. Он используется jQuery, jQuery UI и jQuery Mobile и способен тестировать любой JavaScript код.
- : Shane Tomlinson continues by refactoring the original application, including testing anti patterns, to be easier to read, easier to reuse, and easier to test.
- : Библиотека для эмуляции и проверки требуемого поведения в JavaScript с использованием spy, stub и mock.
- : Здесь рассматривается Stub и Mock и их взаимодействие с другими объектами.
- : Руководством по тестированию кодовой базы React и Redux.
- : Автор рассуждает о том, как писать код, чтобы его можно было тестировать.
Сборник инструментов и экосистем для автоматизации процессов.
- : Инструмент для автоматизации, встроенный в JavaScript.
Инструмент для создания командной строки для JavaScript проектов.
- : Шаблон по работе с инструкциями.
- : Описание простого способа тестирования продукта на устройствах.
Инструмент для автоматизации сложных процессов.
- : Введение в gulp и gulpfile.js.
- : Плагины Orchestrator, Undertaker, Vinyl и Vinyl FS, Gulp.
- : Использование map-stream, though2 и event-stream.
- : Создание файлов с кэшированием.
- : Управление ошибками и решение замаскированных проблем.
- : Плагин для сжатия CSS файлов с использованием clean-css.
- : Сжатие CSS файлов, используя cssnano.
- : Плагин для конкатенции.
- : Create tarball from files.
- : Плагин для подключения по ftp.
- : Коллекция плагинов от Синдро Сорхуса.
- : Узлы, работающие с Gulp.
- : Плагин для кэширования изображений.
- : Плагин для кэширования содержания файлов в памяти.
- : Запускает задания только для изменённых файлов.
- : Плагин для работы с исходными файлами.
- : Плагин для передачи файлов, которые отличаются от предыдущих.
- : Запоминает проходящие файлы и если нужно вставляет в поток.
- : Плагин для минимизации размера изображений.
- : Конвертирует PNG, JPEG и GIF в WebP.
- : Минимизация JavaScript, используя UglifyJS.
- : Список плагинов, поддерживающих gulp-sourcemaps.
- : Поддержка Source map для Gulp.js
- : Подсчёт файлов в vinyl-потоке.
- : Отладка vinyl-потоков.
- : Отображение размеров файлов.
- : Управление разрешениями для vinyl-файлов.
- : Плагин для простого изменения имени.
- : Конвертирует файлы из vinyl-поток в буферизованные файлы.
- : Преобразует обычный файл в vinyl-файл.
- : Файловый менеджер для работы с vinyl.
- : Получение vinyl-файлов из git.
- : Доступ к файлам в vinyl потоке.
- : Преобразование vinyl-потоков в текстовые.
- : Инструмент для быстрого старта работы.
- : Фреймворк для командной работы, позволяющий создавать файлы по уровням.
- : Автоматизация разработки UI с помощью Riot.js и ES6.
Сборщик модулей.
- : Автор пишет, как сделать так, чтобы код React работал с BEM.
- : Автор объясняет, как создать среду разработки с помощью Webpack и Docker, чтобы производительность была на высоком уровне.
- : Здесь описаны все этапы построения интерфейса Node + Redux и интерфейса React + Redux для реальных приложений, используя тестовую разработку.
- : После прочтения этой статьи вы научитесь работать с загрузчиком изображений Webpack.
- : Это пошаговое руководство научит вас создавать свой собственный React + Redux проект с помощью Webpack и Babel.
- : Руководство по Webpack для продвинутых.
- : Webpack-песочница.
- : Автор сравнивает, как Grunt, Gulp, Broccoli и Webpack обнаруживают зависимости.
- : Популярная утилита для более удобной работы над проектом.
Здесь собраны текстовые редакторы для работы с исходным кодом веб-сайтов.
- : Современный текстовый редактор, который можно максимально персонализировать.
- : Open-source редактор JavaScript, HTML и CSS кода.
- : Бесплатный редактор исходного кода, пригодный также для работы с обычным текстом, поддерживающий несколько языков и доступный для работы на Windows.
- : Кроссплатформенное приложение для создания и отладки как веб, так и облачных приложений.
Инструменты для анализа и обработки CSS файлов.
- : Собирает графы CSS зависимостей, полученные из dgraph или module-deps в единый набор CSS, учитывая, что каждая вершина графа содержит CSS и то, что граф отсортирован с помощью dept-sort.
- : Строковый указатель CSS с использованием AST из ‘css.parse’
- : Программа для анализа избыточности кода.
- : Node.js библиотека для уменьшения CSS файлов.
- : Инструмент для поиска неиспользуемого CSS.
- : Удобный инструмент для работы с препроцессорами и написания кода.
- : Статья о том, что такое PostCSS и как с этим работать.
- : Плагин для объединения ES и CSS модулей.
- : Статья о том, как повысить качество кода с помощью PostCSS.
- : Front-end разработчик рассказывает, как PostCSS помогает ему в работе.
- : CSS-линтер, необходимый для того, чтобы избавиться от ненужного кода и сделать его красивым.
- : Статья о том, почему стоит линтинговать CSS.
Всё о написании, публикации и использовании документации.
- : Генератор стилей и менеджер компонентов.
- : Генератор документации, использующий структуры папок и файлы Markdown для быстрого создания пользовательской документации.
- : Инструмент для создания технической документации, который адаптирует её при изменении кода.
- : Генератор документации, смешивающий комментарии и код в единый HTML код.
- : Генератор Markdown документации из комментариев кода.
- : Инструмент для генерации документации для API из комментариев кода.
- : Удобный инструмент для сбора всей документации в одном месте.
- : Генератор JavaScript документации с использованием markdown и jsdoc.
- : Генерирует документацию из таблиц стилей.
Инструменты для обработки HTML кода.
- : Простой инструмент для анализа вашего HTML-кода.
- : Инструмент для минимизации HTML-кода.
Инструменты для изменения и оптимизации изображений.
- : Универсальная утилита для оптимизации изображений.
- : Программа для сжатия и оптимизации JPEG файлов.
- : В статье рассматривается оптимизация для вывода сайта в топ, повышения производительности и работы с соцсетями.
- : Оптимизатор PNG.
- : Оптимизация JPEG без заметной потери качества.
Инструменты для статистического анализа и обработки JavaScript файлов.
- : Инструмент для транспилирования кода.
- : Как использовать Babel и какое будущее ждёт JavaScript.
- : Инструмент, разработанный Google для сжатия и обфускации JavaScript.
- : Инструмент для статистического анализа кода.
- : Набор инструментов, помогающих в рефакторинге кода.
- Линтинг JavaScript кода: Процесс запуска программы для поиска возможных ошибок:
- Bundlers и Loaders:
- : Сервер для быстрого прототипирования
- : Модуль для отслеживания изменений в коде.
- : Как организовать работу React с BEM с помощью Webpack.
- : Как создать среду разработки с высокой производительностью.
- : Руководство по созданию своего React + Redux проекта с помощью Webpack и Babel.l.
- : Webpack песочница.
- : Позволяет вам запрашивать модули в браузере, объединяя все зависимости.
- : Загрузчик скриптов для объявлений, виджетов и другого стороннего контента.
- : загрузчик AMD модулей.
- : Создавайте приложения и библиотеки с помощью модулей ES2015, и объединяйте их в один файл для использования в браузерах и Node.js.
- : Универсальный загрузчик модулей ES6, AMD, CommonJS. Работает с Traceur и Babel.
- : Универсальный модуль, конвертер JavaScript.
- : Модуль для сборки бандлов и оптимизации модулей JavaScript и других ресурсов для фронтенда
- : Исходный трансформатор, обеспечивающий функции генератора ECMAScript 6 в JavaScript-of-today.
Средства для автоматизации процессов установки, обновления, настройки и удаления компонентов.
- : Установка пакетов с их зависимостями.
- : Инструмент для оптимизации рабочего процесса управления многопортовыми репозиториями с помощью git и npm.
- : Пакетный менеджер Node.js для управления модулями и зависимостями.
- : Объединение нескольких файлов в один.
- : Преобразование в разные форматы.
- : Создание source-map для файлов в пакете.
- : Создание и использование source maps в commonjs на старых браузерах.
Инструменты для контроля за изменениями, чтобы в любой момент можно было вернуться к более ранним версиям кода.
- : Высокоэффективная система управления версиями.
- : Серия учебников по Git от Atlassian
- : Браузерное расширение, которое помогает работать с GitHub ссылками.
