Веб-разработка *

Amvera Cloud представила работу с несколькими ветками Git, бэкапы PostgreSQL и управление портами. Обзор релиза

С августа 2024 в Amvera стал доступен новый функционал.

К проектам можно привязать произвольные ветки репозитория и развернуть staging и prod окружения, используя один репозиторий.

Что это даёт 

• возможность командной работы.

• возможность создать для одного репозитория staging и prod проекты. 

Как это работает

• Вы создаёте нужное количество проектов со своими тарифами и переменными. Как пример - два проекта для стейджинга и прода вашего бота, где для стейджинга используется минимальный тариф, а для продакшн версии тариф с запасом;

• Привязываете к каждому проекту ваш GitLab/GitHub/Bitbucket;

• Выбираете ту ветку Git-репозитория, которая является основной для проекта;

• Делаете git push и ваш проект развернут.

  Управлять портами и TLS-сертификатами проектов

  Ранее SSL-сертификаты выписывались автоматически, теперь их можно отключить. Как и организовать работу приложения с несколькими открытыми портами.

  Подключать автоматические планы создания бэкапов кластеров PostgreSQL.

Amvera — облако, где вы можете развернуть и обновлять приложение через команду git push amvera master. Без настройки виртуальных машин, SSL и установки зависимостей.

Совет по Joomla: как получать данные из суперглобальных массивов $_POST, $_GET и других?

На основе данных из $_GET, $_POST порой строится логика работы кода начиная от шаблона Joomla и кончая модулями и плагинами. Для работы с этими данными используется объект Input, который мы получаем из Приложения Joomla.

Приведу пример, часто использующийся при разработке шаблонов Joomla

<?php
/** @var \Joomla\CMS\Application\CMSApplication $app */
$app   = Factory::getApplication();
/** @var \Joomla\Input\Input $input */
$input = $app->getInput();

// Имя параметра и его значение по умолчанию
$option   = $input->get('option','');
$view     = $input->get('view', 'category');
$layout   = $input->getCmd('layout', 'edit');
$task     = $input->getString('task', '');
$itemid   = $input->getInt('Itemid', '');

В методе $input->get() 2-й аргумент - это значение по умолчанию на случай, если данных не обнаружено. 3-й аргумент - параметры фильтрации данных - будьте с ним внимательны. Например, вы хотите получить данные, отправленные на ендпоинт в виде JSON.stringify.

<?php
/** @var \Joomla\Input\Input $input */
$input->json->get('title', '', 'RAW')
// ИЛИ
$data = $input->json->getArray();

Если вы уверены, что данные должны быть именно в $_POST и нигде более, то получайте их именно оттуда.

<?php
/** @var \Joomla\Input\Input $input */
$title = $input->post->get('title', '', 'RAW');

Подробнее в файле libraries/vendor/joomla/input/src/Input.php.

Работа с данными в JavaScript — в пятой серии открытого курса по JS

Это новый курс от инженеров AvitoTech — вместе с фронтендером Василием Новиковым разбираемся в базовых технологиях веб-разработки в JavaScript.

В этой серии изучаем проблемные числа, разбираемся с мантиссой, экспонентой и сдвигом, пытаемся понять арифметику стандарта IEEE 754. Знаете, почему 0,1 и 0,2 в сумме не дают 0,3? Смотрите, и всё поймёте!

А если знаете — всё равно смотрите, вспоминать базу всегда полезно!

Список устаревших классов ядра Joomla 1.6-3.10 и их современные аналоги в ядре Joomla 5.x

Разработчикам при обновлении расширений на архитектуру Joomla 4 / Joomla 5 нередко не сразу удаётся найти аналоги устаревших методов ядра. Особенно, если под рукой нет современной среды разработки (IDE), например PHP Storm, который подсказывает нужные методы ядра Joomla. Без него, конечно, разработка для Joomla становится непростым делом. В этой статье вы найдете табличку соответствия старых и новых названий PHP классов ядра Joomla и её расширений для того, чтобы быстрее и легче было обновить свои расширения. Эти классы пока что можно использовать в случае, если включён плагин обратной совместимости Joomla 4 / Joomla 5. Но в Joomla 6 или последующих версиях он может быть удалён.

Подробнее: Список устаревших классов ядра Joomla 1.6-3.10 и их современные аналоги в ядре Joomla 5.x.

Омар Шехата поделился одним из своих самых популярных проектов. Это крошечное веб-приложение JPEG Viewer для демонстрации алгоритмов, которые работают в формате сжатия JPEG.

Страница демонстрирует, как изображение разбивается на блоки 8×8 пикселей, каждый из которых затем подвергается алгоритму дискретного косинусного преобразования. Упрощённо можно сказать, что каждый из блоков математически преобразуется из двумерного изображения в сигнал, а затем представляется как сумма синусоид. Интересно в инструменте Омара то, что он допускает ручное редактирование преобразования каждого из блоков 8×8 пикселей.

Также Омар рекомендует свою статью про алгоритмы сжатия JPEG, в которой он применил схожие инструменты.

Представлен открытый проект Hyperscript. Это гибкий скрипт для обработки сложных конфигураций и запросов. Проект поддерживает различные методы HTTP, включая GET, POST, PUT и DELETE, и предоставляет обширные возможности для проверки ответов на соответствие указанным условиям.

Hyperscript поддерживает нескольких методов HTTP, включая опции простой настройки и тестирование запросов GET, POST, PUT и DELETE.

В Hyperscript есть редим гибкой проверки и проверки ответов на основе кодов состояния, типов содержимого и определённого содержимого.

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

Проект написан на языке Python и опубликован под лицензией MIT.

Совет по Joomla: метод HTMLHelper::image() для рендера изображений

В API Joomla есть довольно богатый инструмент - класс HTMLHelper. С его помощью можно выводить различные HTML-элементы с нужными параметрами: модальные окна, аккордеоны, табы, изображения и т.д.

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

Самый простой способ рендера изображений - с 2-мя аргументами:

• $img - путь к изображению

• $alt - текст для атрибута alt изображения 3-й необязательный параметр - массив или строка с атрибутами изображения: class, title, различные data-атрибуты, onclick, loading и т.д. Я предпочитаю удобно и наглядно собрать атрибуты в массив, использовать условия в PHP, а не HTML коде.

<?php
use Joomla\CMS\HTML\HTMLHelper;

$img_src = 'images/banner.webp';
$img_attribs = [
    'loading' => 'lazy',
    'class'=>'img-fluid',
    'data-custom-attr'=>'your-custom-data-attr-value',
    'title'=> 'Title attribute for image'
];

echo HTMLHelper::image($img_src,'Alt text for image', $img_attribs);

Если изображение найдено - получим HTML-разметку <img src="..."/> с нашими данными. Если не найдено - null.

Ещё 2 параметра, которые используются реже и связаны с одной из главных фишек Joomla - функционалом переопределений. Но их описание не укладывается в размер поста на Хабре 😢

Go для веб-разработки

Привет, Хабр!

Одна из тех вещей, которыми я занимаюсь с использованием Go — веб разработка. Я могу написать как фулл‑стэк вебсайт, так и просто бэкэнд. В этом коротком посте я дам Вам несколько советов и практик по веб‑разработке с использованием Golang

1. Роутеры

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

1. Chi router — роутер, которым я пользуюсь. Полная совместимость со стандартным пакетом Go

2. Go fiber — скоростной роутер

2. Jet templates

Очень удобная библиотека для использование темплэйтов. Очень упростила мне жизнь, если Вы пользуетесь теплэйтами в Go — упростит и Вам

3. Используйте middleware

Не используете middleware — ошибка. Не используете встроенные в пакет роутера middleware — фатальная ошибка. Есть очень много хороших middleware, которые уже встроены в используемый Вами роутер, например — Chi. Очень полезно использовать «Recoverer», или подобные.

4. Используйте аккуратную и удобную Вам структуру проекта

Не создавайте все файлы вместе. Разбейте все по папкам, как удобно Вам, в интернете есть много примеров

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

Только не говорите, что я один этого не знал.

Если ссылку любого репозитория на GitHub, например такую:

https://github.com/Bednyakov/takewords

Дополнить строкой vscode.dev, чтобы получилось:

https://vscode.dev/github/Bednyakov/takewords

Проект откроется в онлайн редакторе Visual Studio Code.

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

В разделе «Цвет» есть возможность активировать три опции: «Светлый», «Темный» и «Автоматический», который выбирается на основе настроек системы. Новый режим «Википедии» несовместим с браузерными расширениями, которые сами делают «Википедию» темной.

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

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

Два основных подхода к разработке UI-китов

1. All-in подход. Подключение компонента вместе со стилями или без них. Здесь любой компонент — это самостоятельная единица, которая уже содержит всё нужное. Внутри этого подхода можно выделить два подвида:

• Инлайн-стили через Styled Components (возможно, добавить просто подключение стилей внутри компонента). Этот метод позволяет писать стили непосредственно в компоненте. При этом стили изолированы, что уменьшает возможность конфликтов между стилями разных компонентов.

• Без добавления стилей (Headless). В этом случае компоненты предоставляют только логику без UI, что позволяет самостоятельно управлять стилями. Для создания подобной библиотеки нужно также ознакомиться с паттерном Compound component.

2. Dependency CSS & Bundle CSS подход. Второй большой подход — когда стили и компонент подключаются по отдельности. В этом случае стили и логика компонента отделены друг от друга.

• Dependency CSS: этот способ подключения улучшает модульность и позволяет загружать стили только тогда, когда они действительно необходимы.

• Bundle CSS предполагает подключение всех стилей сразу и отдельно — компонента. По сути, в этом случае все стили объединены в общий бандл и импортируются в корне проекта. 

Но при написании они схожи, и стили к компоненту подключаются как модули.

О том, как создавать и подключать UI-киты, рассказываем в нашем гайде для начинающих Frontend-разработчиков. Там вы найдете примеры кода и полезные ссылки.

Иван Ярославцев про развитие отраслевого сообщества, три совета молодому digital-агентству

Мы встретились с Иваном Ярославцевым, CEO, Alto и организатором preparty UDW2024. Иван рассказал про свой путь развития отраслевого сообщества и дал три совета молодому digital-агентству.

Ссылка на интервью: https://www.youtube.com/watch?v=PPhhn44Tqug

Ural Digital Weekend 2024 — одна из крупнейших IT-конференций на Урале с насыщенной программой и аудиторией 400+ человек, организованная компаниями Spectr и Тэглайн. Билеты для посещения конференции уже могут приобрести все желающие на сайте Ural Digital Weekend 2024 — https://ural-digital-weekend.ru/. А по промокоду YAROSLAVCEVGIFT10 можно получить приятную скидку.

Опубликовали программу секции «Управление разработкой» Ural Digital Weekend 2024

Доклады секции 

• «Краткий курс по принятию управленческих решений», Александра Прокшина, Авито

• «Синергия тимлида и рекрутера: строим эффективный процесс взаимодействия», Евгений Антонов, Yandex Infrastructure

• «Как создавать идеальные фичи и избегать багов, объединяя тестировщиков и разработчиков», Олег Пендрак, Ozon банк

• «Почему хорошие программисты становятся плохими менеджерами», Фёдор Борщёв, Школа Сильных Программистов

• «Основы Управляемой Эволюции. Как проводить изменения с минимальным сопротивлением», Алексей Пименов, Neogenda

• «Три кита адаптации удаленных сотрудников. Базовые правила для компаний разного масштаба», Алла Стольникова, Directum

• «Самоорганизованные команды: формирование, принципы работы, контроль и адаптация под специфику процессов», Алексей Червон, Магнит

• «Эффективность Шредингера: метрики работы команды разработки, поиск и устранение узких мест в процессах», Полина Таран, Точка

• «Как добиться взаимопонимания между клиентами, менеджерами и программистами», Григорий Кирейчук, KozhinDev

• «Как создать ценность там, где про неё редко спрашивают», Алексей Мезенцев, ITPS

• «Почти универсальные проектные принципы или Как перестать зависеть от методологий», Егор Сизяков, Hawking Bros

• «Стеклянный потолок — проблема или возможность», Андрей Смирнов, X5 Tech

• Специальная тема, Глеб Михеев, Сбер

Билеты на сайте — Ural Digital Weekend.

Опубликовали программу секции «Разработка» Ural Digital Weekend 2024

В секции «Разработка» будут представлены прикладные доклады по направлениям Backend, Frontend, DevOps/SRE, ML/AI, Developer Experience. Большая часть докладов секции рассчитана на middle+ инженеров.

Программу секции сформировал Виктор Корейша, руководитель направления Managed Services в Ozon, ведущий замечательного подкаста о жизни в IT «Кода кода» и нового подкаста «Три тимлида заходят в бар».

Доклады секции 

• «Сайт, готовый ко всему», Никита Дубко, Яндекс 

• «Проблемы конфигурирования frontend-приложений», Александр Широчкин, Иннотех/Саня об IT

• «Как обрабатывать 5 млн изменяющихся форм в минуту с SLI 99.99%», Кирилл Грищук, Avito

• «gRPC-стримы на практике: к чему готовиться и где применять», Сергей Антоничев, Ozon

• «Обзор возможностей распознавания и генерации трехмерных тел с использованием алгоритмов Искусственного Интеллекта»,  Никита Петрушан, РЦТИ.рф

• «Kubernetes «на сковородке». Простые советы и сложные рецепты», Игорь Титов, Garage Eight

• «Оркестрация с помощью Temporal: как это устроено и как применять на практике», Антон Цитульский, Uzum Tezkor

• «Архитектура надёжности экосистемы», Алексей Мерсон, Т-банк

• «Трассировка микросервисов или когда метрик и логов недостаточно», Руслан Гайнанов, Т1

• «50 оттенков кеширования: от in memory к многоуровневому redis-кластеру», Леонид Ченский, Ozon Tech

• «Frontend Fortified: как стать неприступным для атак», Зар Захаров, VK Музыка

Билеты —  на сайте Ural Digital Weekend 2024.

В кодовую базу Node.js принято изменение, добавляющее возможность выполнения файлов с кодом на TypeScript.

Поддержка TypeScript включается при помощи опции "--experimental-strip-types" и сводится к очистке специфичных для данного языка определений типов, то есть преобразованию перед выполнением исходного кода в JavaScript.

Не связанные с описанием типов возможности TypeScript пространства имён, декораторы, свойства параметров и перечисляемые типы (enum) пока не поддерживаются. Протестировать новую опцию можно в ночных сборках Node.js 23.

Для трансляции задействован компилятор SWC (Speedy Web Compiler), написанный на языке Rust. Чтобы не добавлять дополнительные зависимости к Node.js, задействовано представление компилятора swc/wasm-typescript в промежуточном коде WebAssembly и уже применяемое для тех же целей в платформе Deno.

Это изменение добавлено в ответ на просьбы пользователей реализовать возможность запуска кода на TypeScript без установки внешних загрузчиков и дополнительных зависимостей. В проектах Deno и Bun поддержка TypeScript реализована изначально.

Ключевым отличием TypeScript от JavaScript является явное определение типов. Статическая типизация позволяет избежать многих ошибок в процессе разработки, даёт возможность задействовать дополнительные техники оптимизации и упрощает отладку.

В добавленной в Node.js реализации данные возможности TypeScript теряются, в процессе трансляции исходных текстов в JavaScript проверка типов не осуществляется.

Источник: OpenNET.

Леонид Ченский про систему кэширования и топ-3 ошибок в кэшировании

Мы встретились с Леонидом Ченским, руководителем группы разработки в Ozon и спикером секции «Разработка» UDW2024. Леонид рассказала про обучение разработчиков, систему кэширования и топ-3 ошибок в кэшировании.

Ссылка на интервью: https://www.youtube.com/watch?v=yNuAjXKfcMg

Ural Digital Weekend 2024 — одна из крупнейших IT-конференций на Урале с насыщенной программой и аудиторией 400+ человек, организованная компаниями Spectr и Тэглайн. Билеты для посещения конференции уже могут приобрести все желающие на сайте Ural Digital Weekend 2024 — https://ural-digital-weekend.ru/. А по промокоду CHENSKYGIFT10 можно получить приятную скидку.

Александр Широчкин про конфигурирование frontend-приложений, карьеру и блогерство

Мы пообщались с Александром Широченным, руководителем направления разработки в Иннотех, владельцем канала Саня об IT и спикером секции «Разработка» Ural Digital Weekend 2024. Саша рассказал про техлидов, консультации разработчиков, конфигурирование frontend-приложений, карьеру и блогерство.

Ссылка на интервью: https://youtu.be/EKqf7QyEPgA

Блоги Александра:
https://www.youtube.com/@sanya-it
https://t.me/+C0iWBXnutWxjOTky

Ural Digital Weekend 2024 — одна из крупнейших IT-конференций на Урале с насыщенной программой и аудиторией 400+ человек, организованная компаниями Spectr и Тэглайн. Билеты для посещения конференции уже могут приобрести все желающие на сайте Ural Digital Weekend 2024 — https://ural-digital-weekend.ru/. А по промокоду SHIROCHKINGIFT10 можно получить приятную скидку.

Плагин JLSitemap - Phoca Download

JL Sitemap - компонент для формирования статической XML карты сайта. В результате работы компонента формируется файл или файлсет карт сайта, который не нагружает каждый раз сервер при обращении к нему. Компонент получает данные для формирования XML карты сайта от плагинов. В стандартную поставку входят плагины:

• Плагин поддержки Материалов Joomla.

• Плагин поддержки Меток Joomla.

• Плагин поддержки Контакты Joomla.

• Плагин поддержки K2.

• Плагин поддержки Kunena.

• Плагин поддержки Virtuemart.

Также сторонними разработчиками созданы плагины:

• JoomShopping

• Phoca Gallery

Теперь к этому комплекту плагинов добавился плагин поддержки компонента Phoca Download. Он добавляет в карту сайта ссылки на категории и файлы Phoca Download с учетом того опубликован файл/категория или нет, действуют ли даты публикации, подтверждён файл или нет и т.д.

Плагин имеет сразу 2 релиза:

• Версии 0.9.x созданы для Joomla 3 по старой архитектуре расширений. Возможно будут работать на Joomla 4 и Joomla 5 с включённым плагином обратной совместимости

• Версии 1.х созданы для Joomla 4 и Joomla 5 по новой архитектуре расширений. Если Ваш сайт на Joomla 4 и старше - рекомендуется использовать именно последние версии плагина.

Страница расширения

Компонент XML-карты сайта JL Sitemap

Компонент Phoca Download

Вышел Astroid Framework v.3.1.0 для Joomla

Обновление популярного шаблона-билдера Astroid для Joomla.

Что нового в отличие от версии 3.0.0?
- Добавлено эелементы бильдера - Виджеты. Более 20 виджетов. (Можно включить или отключить в настройках плагина.) Теперь можно создавать шаблон с помощью бильдера и можно создавать свои виджеты.
- Добавлены Макеты блоков. Можно создать свой блок макетов с помощью элементами билдера и применить его в шаблоне.
- Добавлена Макеты материалов. Макеты материалов можно создать свои и применить его в настройках макетов категории.
- Виды блоков категории (в настройках меню Blog options)
- Удаление генератора тега Joomla в настройках плагина.
- Можно выбирать модуль меню (свой модуль Astroid menu) в настройках шаблона (Не обязательно создать дубликать стиля для каждого языка сайта)

Улучшения
- Fontawesome 6.6.0
- Очистка кода и стабилизация
- Улучшения UI/UX разделов админки шаблона
- Поддержка 3-х сторон для создания виджетов для Astroid с помощью плагинов

Шаблон работает на Joomla 4/5.

Скачать с GitHub

Примечание:
- astroid-framework-3.1.0.zip - только фреймворк
- astroid-package-v3.1.0.Framework-Template.zip - фреймворк и 3 базовых шаблона

Для тех кто хочеть отправить донат или поблагодарить автора
ko-fi.com/astroidframework

Если есть пожелание или предложения по улучшению продукта, то можете оставить их на Github

Эксперты PCWorld сравнили веб-браузеры Google Chrome, Mozilla Firefox, Opera, Microsoft Edge, Brave и Vivaldi по производительности и доступу к данным пользователей.

Главным критерием теста было время загрузки содержимого сайтов, особенно тех, которые богаты графическими элементами и JavaScript.

Тестирование проводилось на ПК на базе AMD Ryzen 5 3600 с видеокартой NVIDIA RTX 3060 Ti, 16 ГБ ОЗУ DDR4-3200 и накопителем Samsung 970 Evo. В качестве операционной системы использовалась Windows 10 версии 22H2.

Для измерения скорости работы браузеров эксперты задействовали инструменты Speedometer 3.0, Jetstream2 и Motionmark 1.3. Первый тест проверяет скорость рендеринга веб-страниц, второй – скорость выполнения JavaScript, третий – скорость отображения графических элементов.

По результатам тестов Chrome занял первое место в тесте Speedometer и второе место во всех остальных тестах, что позволило ему стать лидером среди прочих тестируемых браузеров.

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

Примечательно, что Firefox занял последние места в тестах, но отлично себя зарекомендовал в плане конфиденциальности, практически не собирая информацию о пользователях.