У каждого программиста, как внутреннего, так и внешнего, есть набор инструментов, которые помогают в процессе разработки. Некоторые из них очень помогают, другие - в меньшей степени. Разработчик (или компания) должен решить, какой инструмент действительно повысит скорость и упростит процедуру. Если вы ищете лучший вариант инструмента (ов) для помощи в разработке интерфейса, мы покажем здесь основные инструменты, которые у нас есть:
Йомен
Это стек (набор ресурсов), ориентированный на интерфейс, который автоматизирует вашу сборку и управляет ее зависимостями. Он не изобретает велосипед, поскольку использует Grunt и Bower в качестве компоновщика и менеджера пакетов соответственно. Он даже выполняет строительные леса. Более того: автоматически компилирует CoffeScript; JavaScript автоматически проверяет с помощью JSHint; Минимизировать и объединить ваши скрипты; Оптимизирует ваши изображения; LiveReload делает вашу страницу местом предварительного просмотра; Выполняет модульное тестирование
Все о Йомане: http://yeoman.io/ (на английском языке) | Http://tableless.com.br/yeoman-e-quando-as-coisas-dao-errado/ (на португальском)
Беседка
Это менеджер пакетов (в основном один файл, bower.json), в котором вы перечисляете зависимости вашего проекта и следите за исходным кодом. Он создан сотрудниками Twitter и используется в основном интерфейсными пакетами. Если у вас есть проблема, например, когда в вашем проекте отсутствуют какие-то зависимости, беседка ищет ее для вас.
Все о Бауэре: https://bower.io/ (на английском языке) | Http://tableless.com.br/bower-na-pratica/ (на португальском)
Ворчание
GruntJS - это средство выполнения задач, которое запускается из терминала и используется для автоматизации задач. Минификация, компиляция, линтинг и другие примеры того, что можно сделать с помощью Grunt. Большим преимуществом является автоматизация всех задач в Grunt и отсутствие необходимости использовать несколько программ.
Все о Grunt: http://gruntjs.com/ (на английском языке) | Http://tableless.com.br/grunt-voce-deveria-estar-usando/ (на португальском)
Джекил
Jekyll - это генератор статического кода, разработанный на Ruby. С его помощью вы можете создавать страницы, используя HTML и информацию. Он основан на таких форматах, как Markdown, для форматирования текстов и сообщений, а также имеет шаблон шаблона, который называется Liquid, вместе с YAML для сохранения данных переменных.
Все о Джекилле: https://jekyllrb.com/ (на английском языке) | Http://tableless.com.br/jekyll-servindo-sites-estaticos/ (на португальском)
Посредник
Как и Jekyll, это GEM Ruby, который создает статические веб-сайты без базы данных на основе чистого HTML-кода и информации. Некоторые пользователи предпочитают Middleman, чем Jekyll, потому что первый более гибкий.
Все о посреднике: https://middlemanapp.com/ (на английском языке) | Http://tableless.com.br/gerando-arquivos-estaticos-com-o-middleman/ (на португальском)
Дерзость
Это препроцессор с языком на основе CSS, который после компиляции генерирует CSS. Он имеет два разных синтаксиса: SASS и SCSS. Цветовые функции; Продлевать; Вложенные CSS-селекторы; математические операции - это некоторые из функций Sass.
Важная информация: Bootstrap в версии 4, в настоящее время находящейся в Alpha, был изменен Sass LESS.
Все о Sass: http://sass-lang.com/ (на английском языке) | Http://tableless.com.br/sass-um-outro-metodo-de-escrever-css/ (на португальском)
Компас
Это фреймворк Sass, который автоматически создает спрайты CSS.
Документация по компасу: http://compass-style.org/
МЕНЬШЕ
Это язык на основе CSS, который в конечном итоге генерирует CSS. Люди называют это препроцессором, потому что в конечном итоге браузер понимает только CSS. Вы пишете файл .less, но в конце используете .css, скомпилированный с помощью команды «lessc». Это также можно сделать с помощью JavaScript, который вы включаете на сайт и напрямую компилирует МЕНЬШЕ в браузере; полезно для тестирования, но не рекомендуется для производства - требуется время и больше байтов.
Все о LESS: http://lesscss.org/ (на английском языке) | Http://tableless.com.br/css-dinamico-com-less/ (на португальском)
Как мы видим, некоторые инструменты очень похожи и в основном преследуют одну и ту же цель. Все зависит от твоего вкуса или от твоего начальника.
До следующего раза!
Спасибо за чтение! Если вам понравился этот материал, нажмите ♥ ниже. Это действительно помогает заинтересованным читателям найти эту статью.
