🧊 siberiacancode x IT-ХОЗЯЕВА

Как правильно API готовить 👍 Это тема доклада, который я сейчас готовлю. Многие знают, что мы сделали собственный инструмент — apicraft. До этого для генерации типов и клиентов мы использовали сначала Orval, а затем Hey API. В рамках подготовки доклада я снова сравнил эти инструменты, и вот что могу сказать. ⭐Всё ещё непонятно, зачем они генерируют так много лишнего кода. При этом довольно странно выстроена иерархия базовых запросов, клиентов и плагинов. ⭐С масштабируемостью и гибкостью всё стало намного лучше. За последние годы библиотеки многое переосмыслили и научились гибко прокидывать параметры. Но, например, Hey API до сих пор не генерирует готовые хуки для TanStack Query, а предоставляет только набор опций для них. ⭐Конфигурация всё ещё не идеальна. В мире, где API вполне может состоять из нескольких схем, непонятно, почему до сих пор нет нормальной поддержки массива конфигов. Настройка нейминга, структуры файлов и клиентов также остаётся крайне неудобной. ⭐Кастомные клиенты — это вообще отдельный вид боли. Почему их подключение сделано настолько сложно, мне до сих пор непонятно. Особенно с учётом того, что у себя мы решили большую часть этих проблем практически копипастом нескольких внутренних механизмов. Думаю, после ещё пары плагинов мы напишем большое благодарственное письмо команде Hey API, а затем сформулируем список вопросов и предложений по улучшению системы. Пока у нас нет планов полностью переписывать генерацию на собственный движок, но, возможно, в будущем нас ждёт и это.

Вы не поверите, я начал писать доку для mock-config 📲 Думаю такими полноценную 5.0.0 и документацию можно ждать уже скоро.

Мне одному смешно, как люди переобуваются на новые нейромодели каждую неделю, хотя в них почти уже нет разницы или я токсик?

Продолжаем работать над reactuse 🤩 За это время вышло много релизов, которые фокусировались на доработки старых апи. Улучшили такие хуки как useQuery, useWebsocket, но и в последних версиях добавили новые хуки: useNotification и useForm. Так же идет работа над улучшением сайта, каждый день мы выгружаем нейрослоп. Также очень приятно видеть подписчиков, которые используют reactuse в своих работах. И лишь хочу напомнить, что помочь проекту можно даже небольшим вкладом: поправить стили в документации, улучшить JSDoc или исправить найденную ошибку. Огромное спасибо всем, кто уже помогает развивать проект.

TypeScript 7.0 уже здесь 👉 Главная новость этого релиза — TypeScript полностью переписали на Go. Благодаря этому компилятор и языковой сервер работают в 8–12 раз быстрее, потребляют меньше памяти и получили полноценную многопоточную обработку. Особенно заметен прирост в больших проектах и монорепозиториях, а режим --watch стал значительно шустрее. При этом Microsoft рекомендует пока не спешить с обновлением. Для проектов на Vue, Angular и некоторых других фреймворках всё ещё советуют использовать TypeScript 6, поскольку экосистема ещё не успела адаптироваться к новому API встроенных плагинов. Для большинства остальных проектов TypeScript 7 уже считается стабильным и готовым к использованию.

Чат для проекта juniorsbootcamp 🤩 Многие попросили добавить чат в рамках juniorsbootcamp, чтобы ребята могли обсуждать задачи, задавать вопросы и делиться своими работами. Я не знаю, что из этого выйдет, но раз многие просили, то не вижу смысла отказывать. Также мы создали репозиторий с примерами работ. Там будут появляться примеры решений, и позже они также будут отображаться на сайте.

Я посмотрел ангуляр и это не так страшно 👨‍💻 В рамках juniorsbootcamp скинули работу на Angular, и знаете что — Angular стал в разы лучше. Когда мы говорим про DX, это не одна большая фича, а сумма множества мелких решений: как пишется код, как устроены шаблоны, как работает реактивность, сколько бойлерплейта нужно для простых вещей и есть ли готовые решения. И сигналы реально дали Angular хороший скачок вперёд. Я давно говорил, что Angular маленькими шагами движется в сторону современных фреймворков. При этом он постепенно теряет свою уникальность в хорошем и плохом смысле: становится проще, привычнее и ближе к тому, что мы видим во Vue/Solid/React. Думаю, ещё пару лет — и мы получим почти Vue experience, только в Angular-обёртке.

🍿 стартуем twitch — youtube — vk

Фон сайта теперь может зависеть от времени суток 😎 Интересный пример того, как современные возможности веб-платформы позволяют плавно менять фон страницы в зависимости от времени суток. Для этого используются Temporal API для получения текущего времени и CSS color-mix() для плавного смешивания цветов между рассветом, днём, закатом и ночью. Всё это реализовано практически без JavaScript-анимаций. Переходы выполняются средствами CSS через зарегистрированные кастомные свойства, а для браузеров без поддержки предусмотрены @supports и полифилл.

typescript 7 версия официально на npm 👌

🍿 стартуем twitch — youtube — vk

Попапы без JavaScript 😵‍💫 Джош выпустил подробное руководство по CSS Anchor Positioning — новой возможности платформы, которая позволяет привязывать тултипы, выпадающие меню, поповеры и другие элементы интерфейса к любому элементу страницы без вычисления координат в JavaScript. В статье разбираются anchor-name, position-anchor и position-area, автоматический выбор положения при нехватке места, а также новые возможности Anchor Positioning Level 2 для корректного позиционирования стрелок.

FSD — это беда, спасёт только FDA 👍 — Дмитрий Дин Круто, что во фронтенде постепенно приходит понимание: архитектуры с бэкенда нельзя просто натянуть на клиентский код. Даже концептуальное деление на сущности, фичи и слои часто начинает мешать реальным связям внутри продукта — логика размазывается по папкам, появляются спорные абстракции, а навигация по проекту усложняется с его ростом. Автор подробно разбирает проблемы FSD и предлагает FDA — модульный подход, в котором код группируется вокруг законченных частей продукта, а не заранее заданных типов сущностей. В докладе много хороших практик по границам модулей, зависимостям, публичному API и постепенному усложнению архитектуры только тогда, когда это действительно нужно. Надеюсь, что скоро и мы сможем представить вам наши практики. confreviewer x siberiacancode

🍿 АНОНС СТРИМА 9 июля в 14:30 по мск twitch — youtube — vk

shadcn/ui меняет библиотеку по умолчанию 👋 В shadcn/ui произошло важное изменение: теперь для новых проектов по умолчанию используется Base UI, а не Radix UI. При этом поддержка Radix никуда не исчезает — при необходимости его по-прежнему можно выбрать одной командой. Причина смены довольно простая: Base UI уже достиг стабильной версии, активно развивается, набрал более 6 миллионов загрузок в неделю и, по статистике shadcn, новые проекты выбирают его примерно в два раза чаще, чем Radix. Для тех, кто уже использует Radix, подготовили отдельный skill, который помогает выполнить миграцию без потери изменений в проекте.

🍿 АНОНС СТРИМА 8 июля в 14:30 по мск twitch — youtube — vk

Топ конференция, захейтила мой лендинг 👻 Это шутка. На подкасте разбирали лендинг reactuse. На самом деле UI/UX — одна из самых сложных частей разработки. Достаточно посмотреть на сайты большинства библиотек вроде ReactUse или VueUse, чтобы понять, насколько непросто сделать хороший интерфейс для технического продукта. Хочу разобрать один реальный кейс с нашего лендинга — бенто с хуками. Проблема в том, что хук сам по себе невидим, и лучший способ показать его — сделать небольшое демо. Но сразу возникает следующий вопрос: как пользователь поймёт, к какому именно хуку относится это демо? Самое простое решение — добавить подпись, но это быстро превращает интерфейс в перегруженный. В итоге немного переработал этот блок и добавили плавное выделение карточки при наведении курсора, чтобы сразу было понятно, с каким демо взаимодействует пользователь. Этот пример хорошо показывает, что UI/UX — это не просто «сделать красиво», а постоянно искать решения для задач, у которых зачастую нет очевидного ответа.

Новинки Chrome 150 😎 В этом релизе Chrome продолжает развивать CSS. Появились системные цвета AccentColor и AccentColorText для установленных веб-приложений, функция `polygon() получила поддержку скругления углов, zoom стал анимируемым, а новое свойство `text-fit автоматически подгоняет размер текста под ширину контейнера. Также `background-clip: `border-area упрощает создание градиентных рамок. Кроме этого, в CSS-функции `url() появились модификаторы `cross-origin(), integrity() и referrer-policy(), а методы прокрутки, такие как `scrollIntoView(), теперь возвращают `Promise, что делает их гораздо удобнее для работы в асинхронных сценариях.

Ну мне еще надо говорить почему i18next не библиотека, а забавная история 😵