Веб-разработка, страница 3

Кризис среднего возраста у JavaScript. Марун Байдун разбирает, как Rust, Go и Zig захватывают инструменты JavaScript. Пока линтеры и форматтеры были на том же языке, что и код, любой мог их отладить и починить. Бандлер, переписанный на Rust, быстрее, но поддерживать его могут меньше людей.…

Всплывающие скроллеры изображений с анимацией, управляемой прокруткой CSS 🤙 .pop { view-timeline-name: --pop; } img { animation: slide both; animation-timeline: --pop; animation-range: entry 100% cover 50%; } .skateboarder { --x: 0; --y: -45%; } @ keyframes slide {…

Позыыыыыыртееее 🤩 Продолжаю вайбкодить свой сайт портфолио Считаю что портфолио - это самое главное у визуального специалиста, поэтому такой инструмент, для создания уникального портфолио, выглядит как дар 😁 В первом варианте мне не очень понравился y2k , слишком «пыльным» показался.…

Книга из переписки без сервера: canvas, jsPDF и брошюра для печати прямо в браузере Пет-проект «Чатограмма» разбирает переписку и вытаскивает из неё статистику: кто в чат лезет первым, кто шустрее отвечает, в какие часы вы вообще на связи.…

Ну и снова рубрика СДВГ-фаундер) друзья, а кто-то может горит желанием помочь мне навайбкодить архив dazed and amazed?…

🤔 Что такое респонсивная верстка? Респонсивная верстка (Responsive Web Design, RWD) — это подход к разработке веб-страниц, при котором сайт автоматически подстраивается под разные размеры экранов и устройства (десктопы, планшеты, смартфоны). 🚩Как реализуется респонсивность?…

🔥 Elasticsearch или PostgreSQL: зачем платить за сложность? В DevOps-сообществе тренд «просто используй Postgres» с каждым годом становится всё более актуальным.…

Книга из чата без сервера: canvas, jsPDF и брошюра, которую собираешь прямо в браузере Живёт себе пет-проект «Чатограмма». Считает статистику по переписке: кто заходит в чат первым, кто быстрее отвечает, в какие часы вы вообще онлайн.…

WavFlag 1.0 - портативный HTML-инструмент для прослушивания и рецензирования аудио (демо, треки, подкасты) прямо в браузере. Обработка данных происходит полностью на устройстве пользователя. Ключевые возможности: • Загрузка: drag-and-drop или выбор файлов (WAV, MP3, AIFF, M4A).…

📏 Высота блока в строках, а не в пикселях В CSS есть единица lh: 1lh равен вычисленному line-height, то есть высоте одной строки текста. Она давно существует, но о её применении рассказывают редко. Пример: список надо обрезать по пяти строкам и плавно растворить низ.…

Код ревью в эпоху ИИ Ещё одна мысль после конференций — код ревью придётся делать иначе. Когда количество PR увеличивается, человек становится ещё большим бутылочным горлышком. Никто не в состоянии внимательно вычитывать каждую строчку. Поэтому код ревью теперь важнее делать верхнеуровнево:…

✍️ Syne – геометрический шрифт, созданный в 2017 парижским арт-центром Synesthésie. Создатели экспериментировали с контрастностью и жирностью шрифта, чтобы вписать его в творческие проекты. Пример есть в дизайне Mid Mod Сайтодел | #шрифт

Filestash – веб-файловый менеджер, который подключается почти к любому хранилищу и даёт единый доступ к файлам прямо из браузера, как Dropbox поверх чужих серверов…

Касперский пишет, что уязвимость в ядре WordPress существовала почти 10 лет и при определенных условиях позволяла выполнять код на сервере без авторизации. Реальные атаки начались уже через несколько часов после выхода патча. Нужно срочно обновиться до 7.1.2.…

👩‍💻 Используем принципы “Чистого кода” в контексте JavaScript

Функции

✏ Избегайте отрицательных условных конструкций Не усложняйте условные конструкции и не создавайте негативных сценариев проверок Держите в голове простое правило: ➕ Не создавайте условия с НЕ…

Переделал весь дизайн на телефоны Я буквально все это время из принципа игнорил телефоны, мне было впадлу под них менять чет. Ибо иишке гришь на сделать по красоте, а эта сука не может вылизанный ПК дизайн уложить на телефон для мясных. Теперь в проде.…

В незапамятные времена (2022!! год) я выпустил дорожную карту для обучения фронтенду (Олды тут?) Периодически я обновлял её, но в этом формате было откровенно тесно, у сервиса свои ограничения (карта лежала в Миро) И вот пару недель назад я сел обновить роудмеп снова, и тут пришла мысль:…

HTML-тег, который умеет форматировать формулы У <var> есть довольно узкая, но полезная задача: он обозначает переменную в математическом выражении или программном коде. Например:

<p>
  Формула Эйнштейна:
  <var>E</var> = <var>m</var> × <var>c</var><sup>2</sup>
</p>

…

Заголовки безопасности для FastAPI - одной строкой 🛡️ fastapi-security-headers добавляет к ответам приложения HTTP-заголовки: HSTS, защиту от MIME sniffing, ограничения на встраивание страниц и другие политики браузера. Подключается как ASGI middleware:…

Миграция на Spring Boot 4, Spring 7 и JDK 25 В статье автор на примере демо-проекта показывает, что реально меняется при переходе на новый стек: зависимости, конфигурация Maven, Jackson 3, тестовые стартеры и настройки Spring.…

Node.js 26.10 — нативная поддержка throttle/debounce Вот этого я не ожидал Покойся с миром, lodash. Когда уже предложение в TC39? Релиз: https://nodejs.org/en/blog/release/v26.10.0 Документация: https://nodejs.org/docs/latest/api/util.html#utildebouncefn-wait-options @FrontendPortal

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

Symfony 8.2 научился автоматически генерировать JSON Schema для конфигурации приложения При сборке контейнера в debug-режиме появляется:

config/schema.json

Схема объединяет настройки всех установленных bundle и позволяет IDE:

— подсказывать доступные параметры;…

Бывает такое, что запускаешь проект - и порт 3000 занят? А бывает просто работаешь с несколькими проектами одновременно и пойди вспомни, где какой порт к чему относится. Versel Labs выкатил небольшую тулзу Portless, которая решается очень быстро (на примере Nuxt)

portless myapp nuxt dev…

🤔 Как защитить куки от воровства и от подделки? 🟠Использование HTTPS Передача данных через HTTPS (SSL/TLS) обеспечивает шифрование данных между клиентом и сервером, что предотвращает их перехват и чтение третьими лицами.…

На сайт можно добавить умного помощника, а посетитель всё равно не поймёт, где оставить заявку. Тогда новая функция только добавит ещё один шаг. Веб-разработка остаётся отдельным направлением нашей работы.…

​Каноникал на вторую страницу убивает краулинг — алгоритм видит в ней дубль Пагинация вылезает с пугающей регулярностью на сайтах любого размера (одно агентство назвало ее самой частой ошибкой в техничке клиентских проектов), а урон бьет по обнаружению листингов, ссылочному весу и краулингу.…

Штраф до 2,8 млн рублей за cookies? Давайте всё-таки прочитаем закон Я люблю юридические новости со страшными цифрами. Заголовок получается отличный: предприниматель пугается, публикацию сохраняют, отправляют разработчику и начинают срочно искать на сайте баннер с печеньем.…

Tore Lervik выпустил FPOM — шейдер для Unreal Engine 5, который имитирует Nanite displacement через более дешёвую технику POM Он работает с мешами, Landscape и decals, сохраняя детализацию на неровных поверхностях при значительно меньшей стоимости. #plugins | Original

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

.element-with-running-numbers {…