CSS лифт: конечный автомат на CSS для навигации между этажами

Ещё одна крутая демонстрация современных возможностей CSS. В этой интерактивной модели автор реализовал конечный автомат, который позволяет управлять лифтом, двигающемся между 4 этажами.

Рекомендую изучить, если хотите лучше понимать всю мощь CSS.

#css

Во-первых, это красиво

Автор этого codepen-проекта создал реально красивую анимированную кнопку закладки. Может вы и не найдёте ей применения у себя, но, как минимум, полюбоваться ей приятно.

#codepen

5 трендов в технической веб-разработке, за которыми стоит следить в 2025 году

Несмотря на то, что ИИ сильно меняет подход к разработке, современные тренды связаны не только с ним. Например, разработчики заново открывают для себя ванильный JS, отказываясь от использования фреймворков там, где без них можно обойтись. Это даёт и более глубокие знания, и больший контроль над кодом.

Также популярность набирают кастомные портфолио с Three.js, навыки обеспечения безопасности, локальные ИИ-помощники и использование Low-Code и No-code платформ. Подробнее обо всём в статье.

Вот непонятно — ему стало лучше или хуже. Ваши версии?

Как с помощью JavaScript убрать ботов, чтобы A/B-тесты были точнее

Боты сильно могут искажать реальные данные в любой сфере — будь то каналы в Telegram (знаю по себе) или статистика сайта. Поэтому важно иметь возможность исключить этих ботов из общей выборки.

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

#javascript

С кем знакомятся типичные программисты: 2D-тян или живая девушка?

Согласно недавним исследованиям Vantage Point Counseling Services, треть американцев хотя бы раз состояла в романтических отношениях с ИИ. Появилось даже приложение Loverse для виртуальных знакомств, где вместо реальных людей роль партнёров выполняют чат-боты с искусственным интеллектом.

Мы решили провести своё исследование и выяснить где и с кем сегодня знакомятся пользователи стран СНГ. Пожалуйста, пройдите наш небольшой опрос. Это поможет нашему исследованию.

Пройти опрос.

Только посмотрите, что творит эта библиотека

TypeGPU — это модульный и открытый набор инструментов для WebGPU с расширенным выводом типов и возможностью писать шейдеры на TypeScript. То есть вы можете использовать возможности GPU для вашего сайта, не погружаясь в нюансы низкоуровневого API.

Ключевая фишка — директива 'use gpu', которая компилирует JS в WSGL для запуска на графическом процессоре.

Подробнее о библиотеке можно почитать здесь.

#javascript #typescript #библиотека

Ultracite | Zero-config Biome-пресет для JS/TS линтера и форматтера с AI-поддержкой

Готовый пресет для Biome, который ускоряет форматирование и линтинг кода на JavaScript и TypeScript. Работает из коробки, в отзывах пишут, что это просто подарок после возни с Prettier и ESlint. Есть MCP-сервер и интеграции с VS Code, Cursor и другими популярными IDE.

Что нам продают:

— Молниеносная производительность. В основном потому что движком остаётся Biome, а он написан на Rust.

— Zero config by design, интуитивность и простота. Для работы достаточно двух строчек конфига, в которых мы просто наследуем пресет. При этом если надо, можно дальше настроить под себя.

— Максимальная типобезопасность. Ultracite форсирует strict mode и всякие дополнительные правила, чтобы уменьшить количество тупых ошибок.

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

Цена: бесплатно по open-source MIT, премиум для enterprise с кастомными правилами — от $10 за пользователя в месяц.

@prog_tools

Народ, вакансия для настоящих поклонников PHP подъехала

Сам фонд PHP сейчас ищет нового исполнительного директора. Роман Пронский завершает свою работу в начале 2026 года и нужен кто-то на его место.

Обещают до 160к долларов США в год и удалёнку. Готовы сделать PHP великим снова? Тогда можете прочитать подробности вакансии и подать заявку до 15 декабря.

Хотели бы попробовать?)

#php

REST API Generator — быстрый способ сгенерировать тестовые REST API

Представьте, что бэкенд ещё не готов, а фронтендер бьёт копытом и хочет продолжать работу, невзирая на отсутствие API. Для этого и нужен этот инструмент. Он позволяет без развёртывания создавать:

— методы GET, POST, PUT и DELETE;
— случайные данные для ответов;
— поддерживает HTTPS и CORS.

Сохраняйте и пользуйтесь: https://retool.com/api-generator

#инструменты

И меня, если честно, тоже

Google запустила тренажёр для обучения промптингу в игровой форме

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

Игра бесплатная. Доступна по ссылке.

#ии #тренажёр

А я не доверяю

Авиасимулятор прямо в браузере?! Да!

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

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

Ссылку я вам даю, что делать дальше знаете сами: https://www.geo-fs.com/

#интересное

Как лучше делать отладку код JavaScript в Chrome DevTools

Поиск и исправление ошибок в JS может быть весьма ресурсозатратным мероприятием. Новичкам этот процесс может показаться неподъёмным камнем.

Но только до знакомства с отладкой в инструментах разработчика, встроенных в браузер. О ней вы узнаете в этой статье. Причём не о привычной всем console.log(), а куда более эффективных способах.

#javascript #qa

Ничего необычного, просто веб-разработчик пытается освоить новый фреймворк до того, как он устареет:

«Жидкое стекло» в вебе

Новый дизайн фирменных ОС от Apple наделал шуму и постепенно начинает проникать в различные элементы дизайна сайтов и приложений.

В этой статье показано, как легко повторить этот эффект с помощью возможностей как нативного JS и CSS, так и React.

Разные варианты можно посмотреть по ссылке.

upd. Оказалось, что работает не во всех браузерах. Например, на Safari вы можете увидеть просто блюр вместо Liquid Glass. Так что, чтобы посмотреть на эффекты пробуем Chrome и ждём, когда в других браузерах добавят нужные CSS-свойства.

#фронтенд

Большая часть интерфейсов рассчитана только на людей с «идеальным» зрением, хотя проблемы с восприятием цветов есть у 8% мужчин и 0,5% женщин. Для них «красные ошибки» и «зелёные успехи» часто сливаются в один и тот же серо‑коричневый фон.

Один разработчик с дальтонизмом настолько от этого устал, что написал Colorblind Accessibility Guide, куда свёл все основные правила.

Супер-кратко основное: используйте связку «синий / жёлтый / красный» вместо «зелёный / оранжевый / красный» и всегда давайте тройную подсказку — цвет плюс иконка плюс текст, причём с разными формами иконок для разных состояний.

@prog_stuff

Простейшая RAG-система на PHP

RAG (Retrieval-Augmented Generation или генерация, дополненная поиском) — это метод работы ИИ, в котором он не «фантазирует», а сначала ищет и анализирует релевантную информацию в заранее подготовленной базе, а потом использует найденную информацию для генерации ответа.

Собрать такую базовую систему можно за вечер. И в этом гайде предлагается взять не самый стандартный для таких задач язык — PHP в связке с фреймворком Neuron AI.

Про фреймворк мы уже писали ранее. Вот пост.

А теперь давайте посмотрим, как он работает на практике. Материал здесь.

#php #ai #ml