Эта подборка появилась после неимоверной активности, которую создала публикация пабликом «Библиотека программиста» моей прошлой подборки по книгам для веб-разработчиков. Десятки людей спрашивали меня о том, чем я занимаюсь, что использую, читаю, изучаю и как работать с тем или иным инструментом. Что же, пора ответить на все эти вопросы развёрнуто.

Программная платформа

Программная платформа

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

Node.js

  • Node.js — В описании не нуждается. Без него сейчас веб-разработчику жить скучно и не нужно. Хотя, возможно, скоро всё поменяется, ведь произошёл раскол на Инь (Node) и Ян Io.js.
  • npm — Пакетный менеджер Node.js. С его помощью можно управлять модулями и зависимостями.
  • Bower — Пакетный менеджер для фронтенд-разработчиков.
  • Grunt — Система сборки приложений на JavaScript, которая призвана упростить выполнение многих задач. Например, конкатенация файлов скриптов, стилей и тому подобное.
  • Gulp — Альтернатива Grunt. Скорости куда выше в виду того, что в основе лежит работа с потоками. Использую тогда, когда скорость превыше удобства.
  • node-webkit — это среда выполнения приложения, которая сочетает в себе Chromium и Node.js, позволяющая создавать кроссплатформенные приложения с интерфейсом.

Приложения

  • XAMPP — Кроссплатформенная сборка веб-сервера (Apache + MySQL + PHP + Perl).
  • Sublime Text 3 — Быстрый кроссплатформенный редактор, который так популярен из-за своего пакетного менеджера Package Control.
  • Atom — Отличный кроссплатформенный редактор, который разрабатывается GitHub.
  • Prepros — Компилятор файлов для фронтенд-разработки с огромными возможностями. Включая Autoprefixer, Browser Refresh, Scroll Sync, встроенный сервер для проектов, минификацию файлов и оптимизацию изображений. Заменил мне тривиальные задачи, которые раньше выполняли Grunt и Gulp.

Сеть

  • PuTTY — свободно распространяемый клиент для различных протоколов удалённого доступа, включая SSH, Telnet, rlogin.
  • FileZilla — свободно распространяемый FTP клиент.

Sublime Text Package

Sublime Text Package

Пакеты для Sublime Text, которые помогают мне с удобством и удовольствием работать в этом редакторе. Всё что нужно для фронтенд разработчика. Ну, почти всё.

HTML

  • Emmet — Инструмент для ускорения работы с HTML и CSS. Пишете простые сокращения, а плагин раскрывает их.
  • HTML5 — Добавляет полный синтаксис HTML5.
  • HTMLAttributes — Автодополнение атрибутов HTML.

CSS

  • CSS3 — Полная поддержка синтаксиса CSS3.
  • CSScomb — Пожалуй, самый гениальный пакет после Emmet. Инструмент, который делает CSS-код красивым. Создать свой конфигурационный файл можно на их же сайте — csscomb.ru.
  • Color Highlighter — Подсветка переменных в определённый ими цвет.
  • Less, SCSS, Stylus — Помимо Less часто приходится иметь дело и с другими препроцессорами. Поэтому необходима подсветка синтаксиса. Синтаксис Sass не признаю.

javaScript

  • CoffeeScript — Подсветка синтаксиса и проверка, команды, сниппеты и многое другое.
  • jQuery — Поддержка сниппетов, подсветки и методов фреймворка.
  • Nodejs — Автодополнение и подсветка Node.js кода.
  • JavaScript Completions — Автодополнение JavaScript кода.
  • JavaScript Snippets — Сокращения основных JavaScript команд.

Прочее

  • AutoFileName — Автодополнение путей на основе структуры открытой директории.
  • CodeFormatter — Форматирование редактируемого кода в соответствии с вашими пожеланиями.
  • EditorConfig — Инструмент, с помощью которого можно задать основные правила оформления кода в проекте и распространять их между разработчиками и их редакторами. Поддерживает огромное количество редакторов и IDE.

Ресурсы

Ресурсы

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

Документация

  • devdocs.io — Проект, который собрал в себе всю документацию по наиболее популярным веб-технологиям, фреймворкам, API и тому подобному. Доступен оффлайн просмотр и даже поиск.
  • mydevice.io — Ресурс, на котором собраны наиболее популярные устройства и их подробные характеристики экрана.
  • learnxinyminutes.com — Ознакомительная поездка по некоторым языкам.
  • cheat-sheets.org — Некоторое количество шпаргалок по тем или иным языкам и фреймворкам. Советую распечатать самые необходимые для работы, чтобы свести к минимуму поиск в гугле по простейшим вопросам.

Прочее

  • jsnice.org — Наикрутейший деобфускатор для JavaScript, который при обработке кода ищет соответствия в open source проектах и пытается восстановить оригинальные названия переменных.
  • youmightnotneedjquery.com — Тебе не нужен jQuery.
  • kraken.io — отличный оптимизатор изображений. Использую при сжатии изображений статей.

Библиотеки, фреймворки, CMS…

Библиотеки, фреймворки и прочее

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

Фреймворки (HTML, CSS, JS)

  • UIkit — Отличный фреймворк, который можно рассматривать как альтернативу непоколебимого bootstrap.
  • Semantic UI — Множество компонентов, которые могут понадобиться в любой момент.
  • Kube — Очень удобный фреймворк, который не несёт в себе ничего лишнего.
  • Pure — мини-фреймворк, который ориентирован на широкую поддержку браузеров (IE7 +), что, конечно, радует, но не меня.
  • BaseKit's LESS Framework — Студийный фреймворк, над которым трудится один из разработчиков Anchor CMS.
  • Bootstrap — Особо важная персона.

Фреймворки (JavaScript)

  • Zepto — Модульная альтернатива jQuery.
  • jQuery — Особо важная персона.
  • AngularJS — Фреймворк для разработки одностраничных приложений.

Фреймворки (PHP)

  • CodeIgniter — Самый любимый и удобный PHP фреймворк для меня. Не нужно ничего говорить по этому поводу.
  • Phalcon — Самый быстрый PHP фреймворк и даже удобный.

CMS

  • October — Считаю, что на данный момент, это лучшая CMS.
  • Anchor CMS — Лучшая простая блоговая CMS.
  • PyroCMS — Отличная CMS, которая подходит для многих проектов, но с некоторыми условиями.
  • PageKit — Молодая, но амбициозная CMS.
  • Ghost — Очень интересная блоговая платформа, разработанная на основе Node.js.

Библиотеки

  • Less-MQ — Мной разработанная библиотека примесей, которая упрощает управление медиа-запросами.
  • Pesticide — Быстрый способ узнать, какой блок залез на другой или границы у элемента и его соседей.
  • Normalize.css — Та самая библиотека, которую ты должен подключить первым делом, при разработке любого веб-приложения.
  • AniJS — Простейший способ управлять анимацией на странице.

Итоги

Я уже молчу про тонны совсем крошечных библиотек, направленных на решение только одной проблемы, или множество других JavaScript фреймворков, которые иногда приходится использовать. Речь про темы Sublime Text я также не стал заводить, так как это никак не соотносится с продуктивностью и сугубо личное для каждого веб-разработчика.