Более 10 лет работаю удаленно. Захотелось поделиться опытом поиска удаленных заказов и собрать список платформ для поиска фриланс-проектов. Сразу встал вопрос, на чем реализовывать проект. Я немного разбираюсь в PHP, JS и даже Python, но себя программистом не считаю и, в общем-то, не сильно люблю писать код. По этой причине было решено не использовать фреймворки, а сделать всё на готовой CMS. Выбор пал на Drupal — не самый популярный вариант сейчас, но, считаю, абсолютно незаслуженно.
В этой статье хочу показать, насколько быстро и легко можно сделать сайт-каталог на Drupal. Его можно адаптировать под любую тематику, например парихмахерские или автомастерские.
Тип материала и поля
Основа сайта — контент. Главная фича, из-за которой выбран Drupal, — настраиваемые типы контента и модуль Field. В любой момент можно добавить поля разного вида. Если не хватает стандартных, есть множество модулей на drupal.org и всегда можно написать свой / заказать на фрилансе. Все настройки доступны в админке, а модули загружаются одной командой в Composer. Ну, покажите, где еще так можно?
В моем случае, чтобы понимать, какой сервис лучше, хочется иметь объективную метрику. Alexa и SimilarWeb — признанные источники данных о посещаемости, Ahrefs — сервис для специалистов по продвижению, анализирующий ссылки на сайт. Все три сервиса имеют API, к сожалению, довольно ограниченные в бесплатной версии. Для получения данных сделан простой модуль. Данные счетчика — это обычные числовые поля. При сохранении материала (ноды) запускается hook_node_presave, получающий информацию через API и сохраняющий в поле.
<?php
function freelanceabout_node_presave(Drupal\Core\Entity\EntityInterface $entity) {
if ($entity->getType() == 'site') {
$domain = $entity->field_link->uri; //Получаем значение поля адреса сайта
$domain = parse_url($domain);
$domain = $domain['host']; // Получаем доменное имя сайта
$entity->field_alexa_rank->value = alexa_rank_get($domain); // Получаем Alexa Rank
}
}
function alexa_rank_get($domain) {
$rank = 0; // На случай, если нет информации о сайте
// Ниже код из докуметации Amazon API
$url = 'https://awis.api.alexa.com/api?Acti...roup=Rank,LinksInCount&Start=1&Url='.$domain;
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_TIMEOUT, 4);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_HTTPHEADER, array(
'Accept: application/xml',
'Content-Type: application/xml',
'x-api-key: XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX'
));
$response = curl_exec($ch);
curl_close($ch);
$response = json_decode($response, true);
$rank = $response['Awis']['Results']['Result']['Alexa']['TrafficData']['Rank']; // Получаем нужное значение
return $rank;
}
Темизация
В своем проекте хочется попробовать какие-то необычные дизайнерские решения. Шаблонизатор Twig позволяет проводить такие эксперименты. Для примера — страница фриланс-биржи. Это один Twig-шаблон, где расставлены все поля. Layout было решено не использовать, чтобы иметь полный контроль над версткой страницы.
Каталог и поиск
Еще одно важное преимущество Drupal — модуль Views, позволяющий создавать динамические страницы без написания кода. Главная страница — Views c контекстными фильтрами по URL и сортировкой. Чаще всего в таких случаях используют Exposed Filters, но мне хотелось получить красивые адреса страниц вида «язык/страна/специализация». При использовании Contextual filters нет автоматической формы выбора, как в случае раскрытых фильтров. Поэтому все же пришлось написать простой модуль, добавляющий форму, с переходом на страницу с нужными параметрами.
Отзывы
Технически отзыв — это комментарий. CMS дает возможность по аналогии с типами контента добавлять разные типы комментариев и подключать к ним любые поля. Для выставления оценки используется модуль Fivestar. Я работаю с ним еще с 6-й версии Drupal и не имею нареканий на работу. 9-я версия нестабильна, но работает отлично, а все возможные проблемы и сценарии использования описаны в трекере проекта.
Работает рейтинг так: в форме комментария есть поле оценки (Fivestar), где пользователи при написании отзыва выставляют оценку. В настройках типа материала добавлено еще одно поле Fivestar, но уже без возможности редактирования — оно агрегирует данные всех комментариев.
Вот так выглядит отзыв и настройки типа комментария в админке.
Регистрация
По умолчанию Drupal представляет функцию регистрации с адресом электронной почты. Одной почты в 2021 году недостаточно, поэтому подключен вход из Facebook и Google. Для этого есть готовые модули, где нужно только заполнить форму настроек. Самое сложное в этом процессе — разобраться в запутанном интерфейсе Facebook и получить свой API-ключ.
Оптимизация и производительность
Сайт сейчас крутится на самом дешевом тарифе Vultr за 5$ в месяц. На Apache и MySQL с дефолтными настройками. При этом в PageSpeed Insights удалось достичь оценки 97 из 100. В этом помогли два модуля, мне не пришлось ничего писать самому.
AdvAgg сжимает CSS и JS, что значительно увеличивает скорость загрузки сайта.
Другой полезный модуль, Webp, преобразует все загруженные изображения в формат WebP, который очень любит «Гугл».
Обновление с Drupal 8 на Drupal 9
Первую версию FreelanceAbout я сделал в 2020 году, когда Drupal 9 еще был в статусе беты. Сейчас захотелось перейти на новую версию. При обновлении обнаружилось, что некоторые модули не имеют версии под «девятку», но это не проблема: в большинстве случаев достаточно добавить одну строку в .info-файл модуля.
Надеюсь, я сумел показать, насколько просто можно делать нешаблонные проекты на Drupal. В отличие от фреймворков Laravel, CodeIgniter и других здесь вам не нужно писать много кода (почти всё можно сделать в админке). Без фронтэнд-библиотек React, Vue, не нужно знать и использовать два разных языка программирования. Это дает возможность запуска проекта в одиночку или командой из нескольких человек. При этом сайт сразу имеет базовую поисковую оптимизацию, возможность регистрации пользователей и быстро работает.
habr.com
В этой статье хочу показать, насколько быстро и легко можно сделать сайт-каталог на Drupal. Его можно адаптировать под любую тематику, например парихмахерские или автомастерские.
Тип материала и поля
Основа сайта — контент. Главная фича, из-за которой выбран Drupal, — настраиваемые типы контента и модуль Field. В любой момент можно добавить поля разного вида. Если не хватает стандартных, есть множество модулей на drupal.org и всегда можно написать свой / заказать на фрилансе. Все настройки доступны в админке, а модули загружаются одной командой в Composer. Ну, покажите, где еще так можно?
В моем случае, чтобы понимать, какой сервис лучше, хочется иметь объективную метрику. Alexa и SimilarWeb — признанные источники данных о посещаемости, Ahrefs — сервис для специалистов по продвижению, анализирующий ссылки на сайт. Все три сервиса имеют API, к сожалению, довольно ограниченные в бесплатной версии. Для получения данных сделан простой модуль. Данные счетчика — это обычные числовые поля. При сохранении материала (ноды) запускается hook_node_presave, получающий информацию через API и сохраняющий в поле.
<?php
function freelanceabout_node_presave(Drupal\Core\Entity\EntityInterface $entity) {
if ($entity->getType() == 'site') {
$domain = $entity->field_link->uri; //Получаем значение поля адреса сайта
$domain = parse_url($domain);
$domain = $domain['host']; // Получаем доменное имя сайта
$entity->field_alexa_rank->value = alexa_rank_get($domain); // Получаем Alexa Rank
}
}
function alexa_rank_get($domain) {
$rank = 0; // На случай, если нет информации о сайте
// Ниже код из докуметации Amazon API
$url = 'https://awis.api.alexa.com/api?Acti...roup=Rank,LinksInCount&Start=1&Url='.$domain;
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_TIMEOUT, 4);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_HTTPHEADER, array(
'Accept: application/xml',
'Content-Type: application/xml',
'x-api-key: XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX'
));
$response = curl_exec($ch);
curl_close($ch);
$response = json_decode($response, true);
$rank = $response['Awis']['Results']['Result']['Alexa']['TrafficData']['Rank']; // Получаем нужное значение
return $rank;
}
Темизация
В своем проекте хочется попробовать какие-то необычные дизайнерские решения. Шаблонизатор Twig позволяет проводить такие эксперименты. Для примера — страница фриланс-биржи. Это один Twig-шаблон, где расставлены все поля. Layout было решено не использовать, чтобы иметь полный контроль над версткой страницы.
Каталог и поиск
Еще одно важное преимущество Drupal — модуль Views, позволяющий создавать динамические страницы без написания кода. Главная страница — Views c контекстными фильтрами по URL и сортировкой. Чаще всего в таких случаях используют Exposed Filters, но мне хотелось получить красивые адреса страниц вида «язык/страна/специализация». При использовании Contextual filters нет автоматической формы выбора, как в случае раскрытых фильтров. Поэтому все же пришлось написать простой модуль, добавляющий форму, с переходом на страницу с нужными параметрами.
Отзывы
Технически отзыв — это комментарий. CMS дает возможность по аналогии с типами контента добавлять разные типы комментариев и подключать к ним любые поля. Для выставления оценки используется модуль Fivestar. Я работаю с ним еще с 6-й версии Drupal и не имею нареканий на работу. 9-я версия нестабильна, но работает отлично, а все возможные проблемы и сценарии использования описаны в трекере проекта.
Работает рейтинг так: в форме комментария есть поле оценки (Fivestar), где пользователи при написании отзыва выставляют оценку. В настройках типа материала добавлено еще одно поле Fivestar, но уже без возможности редактирования — оно агрегирует данные всех комментариев.
Регистрация
По умолчанию Drupal представляет функцию регистрации с адресом электронной почты. Одной почты в 2021 году недостаточно, поэтому подключен вход из Facebook и Google. Для этого есть готовые модули, где нужно только заполнить форму настроек. Самое сложное в этом процессе — разобраться в запутанном интерфейсе Facebook и получить свой API-ключ.
Оптимизация и производительность
Сайт сейчас крутится на самом дешевом тарифе Vultr за 5$ в месяц. На Apache и MySQL с дефолтными настройками. При этом в PageSpeed Insights удалось достичь оценки 97 из 100. В этом помогли два модуля, мне не пришлось ничего писать самому.
AdvAgg сжимает CSS и JS, что значительно увеличивает скорость загрузки сайта.
Другой полезный модуль, Webp, преобразует все загруженные изображения в формат WebP, который очень любит «Гугл».
Обновление с Drupal 8 на Drupal 9
Первую версию FreelanceAbout я сделал в 2020 году, когда Drupal 9 еще был в статусе беты. Сейчас захотелось перейти на новую версию. При обновлении обнаружилось, что некоторые модули не имеют версии под «девятку», но это не проблема: в большинстве случаев достаточно добавить одну строку в .info-файл модуля.
Надеюсь, я сумел показать, насколько просто можно делать нешаблонные проекты на Drupal. В отличие от фреймворков Laravel, CodeIgniter и других здесь вам не нужно писать много кода (почти всё можно сделать в админке). Без фронтэнд-библиотек React, Vue, не нужно знать и использовать два разных языка программирования. Это дает возможность запуска проекта в одиночку или командой из нескольких человек. При этом сайт сразу имеет базовую поисковую оптимизацию, возможность регистрации пользователей и быстро работает.
Как я делал на Drupal каталог фриланс бирж
Более 10 лет работаю удаленно. Захотелось поделиться опытом поиска удаленных заказов и собрать список платформ для поиска фриланс-проектов. Сразу встал вопрос, на чем реализовывать проект. Я...
habr.com