Разработка тем оформления для Drupal 8. Часть 1: Подготовка

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

Предисловие

Ситуация с готовыми темами оформления для Drupal 8 пока довольно печальная. Количество хороших качественных решений исчисляется даже не десятками, а единицами. Разработка собственных тем оформления требуется для большинства проектов на Drupal, так что этот вопрос сейчас довольно актуален.

Разработка тем оформления во многом перекликается с дизайном и сайтостроением и может затрагивать логику проекта. Часто границы между этими задачами оказываются весьма условными и зависят от распределения ролей в работе над конкретным проектом.

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

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

Целевая аудитория

Этот цикл статей предназначен для верстальщиков, веб-мастеров и даже опытных разработчиков в других сферах, которые хотят повысить свой уровень в разработке тем оформления. Разработка тем оформления — это трудоемкий процесс, требующий определенных навыков. Для эффективной работы, помимо знания HTML и CSS, нужно разбираться в графических форматах и редакторах, инструментах компиляции и сборки, а в случае с Drupal еще и в механизме темизации. Так же не лишними будут навыки работы с серверным окружением и системами контроля версий.

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

Часто бывает рациональнее отдать разработку темы оформления на аутсорс или подобрать уже готовый вариант. Для небольших или единичных проектов это нормальная практика. Если же вы твердо уверены в своих намерениях заняться разработкой, то добро пожаловать.

Подготовка

Необходимые навыки и качества

Нам понадобятся:

  • знание HTML и CSS на среднем уровне, понимание принципов работы JS;
  • навыки работы с графикой в любом редакторе;
  • запас сил и терпения;
  • хотя бы небольшое чувство прекрасного.

Окружение

Окружение — это площадка, где будет развернут наш проект. Это могут быть:

  1. ваш компьютер — локальное окружение;
  2. установленная на вашем компьютере виртуальная среда — виртуальное окружение;
  3. внешний сервер или хостинг — удаленное окружение.

Первый вариант я бы не рекомендовал из-за его ограниченности.

Виртуальное окружение, (например, Vagrant или Docker) может быть целесообразно, если результаты не требуют демонстраций или есть ограничения доступа к интернету.

Но в любом случае, профессионал должен уметь работать с удаленными серверами. Дополнительное преимущество этого варианта — отсутствие привязки к конкретному рабочему месту.

Готовый проект можно разместить и на виртуальном хостинге, но для разработки, скорее всего, понадобится устанавливать дополнительное ПО, поэтому тут надо смотреть в сторону сервера с возможностью управления. Управление удаленным сервером можно осуществлять с помощью SSH, а файловую систему примонтировать как сетевой диск с помощью SSHFS.

В качестве серверной ОС для виртуального и удаленного окружения я рекомендую Ubuntu последней LTS версии (на момент написания статьи это 16.04).

Я испробовал множество вариантов окружений и хостеров и для своих проектов остановился на DigitalOcean (ссылка реферальная).

Инструменты

Большую часть времени работа будет вестись с помощью следующего набора ПО:

  • браузер;
  • текстовый редактор;
  • файловый менеджер;
  • терминал (консоль);
  • графический редактор.

Для работы вам понадобятся все актуальные браузеры.

При выборе текстового редактора или среды разработки (IDE) главенствующую роль может играть привычка и личные предпочтения. От себя же могу дать совет, который в свое время очень помог мне, — Sublime text.

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

В качестве графического редактора стандартом де-факто являются Photoshop и Illustrator. Да, сейчас есть множество модных дизайнерских инструментов, призванных заменить их, но давайте будем честны: совсем без Photoshop и Illustrator не обойдется ни один профессионал. Так что придется ими обзавестись.

Операционная система

Так мы подошли к вопросу, который часто вызывает множество споров и эмоций — операционная система. И очень хорошо, что мы подошли к нему, обозначив необходимые нам инструменты. ОС — это тоже инструмент, и рассматривать их мы будем именно в этом контексте. Мне постоянно приходится иметь дело со всеми тремя популярными ОС: Windows, macOS и Ubuntu. У всех них есть свои преимущества и недостатки.

У Windows довольно слабая консоль и, соответственно, плохая поддержка консольных инструментов для разработки. И хотя в "десятке" над этим поработали и даже интегрировали Ubuntu (!), в этом аспекте Windows все равно остается позади.

У Linux, и Ubuntu в том числе, пожалуй, всего одна существенная проблема — это отсутствие упомянутых выше графических редакторов. Да, есть альтернативы, выкрутиться можно, но со временем неудобство будет постепенно нарастать и снижать продуктивность.

У macOS основная проблема лишь с моделью распространения вместе с собственным "железом", и соответственно, доступностью. В качестве инструмента для разработки macOS — это лучшее решение, и неспроста это выбор большинства профессионалов.

Если у вас уже есть компьютер для разработки, то не задумываясь работайте на том, что есть. Если же вы подумываете о приобретении нового компьютера, то рекомендую MacBook или Mac Mini. Да, возможно, это будет дороже, но отнеситесь к этому как к необходимому вложению, как к покупке хорошего фотоаппарата для профессионального фотографа.

Начало работы

Чтобы приступить к непосредственно разработке тем оформления, должны быть готовы следующие вещи:

  • компьютер для разработки с необходимыми инструментами;
  • настроенное окружение;
  • установленный в этом окружении Drupal.

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

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