Обновить
128K+

TypeScript *

Cтрого типизированная надстройка для JavaScript

89,98
Рейтинг
Сначала показывать
Порог рейтинга
Уровень сложности

Нормализация состояния в React через реестр сущностей: паттерн на Zustand с рекурсивным парсингом и мягкими удалениями

Уровень сложностиСредний
Время на прочтение7 мин
Охват и читатели5.4K

В этой статье я разберу паттерн Entity Registry — плоский реестр сущностей на базе Zustand, который автоматически нормализует любые ответы API, хранит данные в едином словаре по ID и обеспечивает точечный ре-рендер только тех компонентов, чьи данные действительно изменились. Отдельно разберём трюк с enumerable: false для мягких удалений — пожалуй, самую изящную часть паттерна.

Читать далее

Главные игроки экосистемы JavaScript по состоянию на 2026 год

Уровень сложностиПростой
Время на прочтение18 мин
Охват и читатели7.6K

Ранее мы писали похожие статьи о CSS, но JavaScript заслуживает не меньшего внимания! Тем более что JavaScript лучше справляется с версионированием. Мы рассмотрим новые возможности самого языка, а также основные среды выполнения, фреймворки, библиотеки и инструменты.

Читать далее

Тесты зелёные, архитектура мёртвая

Время на прочтение6 мин
Охват и читатели5.2K

Мы разобрались с асинхронщиной, идемпотентностью и моками. Код выглядит хорошо. Тесты проходят. Но когда проект вырастает до тысячи тестов, начинают падать вещи которые падать не должны, и причина почти никогда не в логике теста.

Причина в архитектурных минах которые заложили месяц назад и забыли. В этой части разберём самые частые из них и настроим ESLint чтобы робот ловил их вместо лида на ревью.

Примеры кода намеренно упрощены для наглядности. Фокус на идее, не на архитектуре.

Читать далее

Как делать приложения для Маркетплейса Битрикс24 и не сойти с ума: подводные камни, которых нет в документации

Уровень сложностиСредний
Время на прочтение9 мин
Охват и читатели6K

За пару лет я сделал с десяток приложений для Маркетплейса Битрикс24 — коннекторы мессенджеров, роботы, iframe-панели. На PHP, TypeScript и Python. Каждый раз одно и то же: документация разбросана, примеры устарели, а реальные подводные камни вылезают только в продакшене.

Эта статья — сборник всего, что я хотел бы знать перед тем, как начать: формат токенов при установке, мультитенантность, обновление OAuth, петля сообщений в коннекторах и ещё десяток граблей с кодом и решениями.

Читать далее

Cruzo — минималистичный UI-фреймворк без лишней сложности

Уровень сложностиСредний
Время на прочтение5 мин
Охват и читатели9.5K

Иногда возникает странное ощущение, что фронтенд уже не про решение задач.
А про поддержание сложности.

Я в разработке ещё до AngularJS и React. Тогда всё было просто: HTML и немного JavaScript — и этого хватало даже для приложений с rich UI.

Потом пришли фреймворки.
Один из первых — AngularJS — и это был вау-эффект.
Ты больше не трогаешь DOM руками. Просто описываешь, что хочешь получить.

Потом: Flux, Redux, TypeScript, Angular 2+. Фронтенд в этот момент стал высокотехнологичным, но в то же время неприятным. Нужно писать кучу обслуживающего кода, не всегда понятно, как оно работает, возникают сложности с отладкой.

Ознакомиться с Cruzo

TypeScript врёт — а вы об этом не знаете. Валидация ответов сервера

Уровень сложностиПростой
Время на прочтение3 мин
Охват и читатели6.2K

Недавно я обнаружил, что далеко не все знают об одной простой вещи — и это меня удивило.

Многие думают примерно так: «я описал интерфейс, указал что GET /users возвращает User[], TypeScript подсвечивает все поля, автодополнение работает — значит всё под контролем». Звучит разумно. Но есть одна проблема.

TypeScript работает только во время компиляции. В рантайме его нет.

Когда реальный ответ прилетает с сервера — никакой проверки не происходит. TypeScript просто верит вашей аннотации и молчит. Что реально вернул сервер — string вместо number, переименованное поле, отсутствующий объект — он не знает и знать не будет.

Вы узнаете об этом позже. Обычно от пользователей.

Читать далее

Playwright + Appium + WebdriverIO: как эта связка усиливает тестирование гибридного Android-приложения

Время на прочтение14 мин
Охват и читатели6.2K

Привет, хабровчане! С вами снова Евгений Иванов, QA-lead в компании Fix Price. В этот раз поделюсь с Вами опытом внедрения автоматизации для гибридного мобильного приложения на Android. 

У этого решения есть свои плюсы и минусы, и мы продолжаем работать над его развитием. Но уже сейчас понятно: оно приносит реальную пользу команде во время регрессионных и предрелизных прогонов. Расскажу подробнее, как мы собрали связку Playwright + Appium + WebdriverIO и что из этого вышло.

Читать далее

Зная эти паттерны ты решишь 60% задач на собеседовании

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели16K

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

Читать далее

Пост-квантовый гибридный алгоритм шифрования для высоко-нагруженных систем с реализацией на TypeScript

Уровень сложностиСредний
Время на прочтение9 мин
Охват и читатели9.6K

Новый пост-квантовый гибридный алгоритм шифрования для высоко-нагруженных систем с реализацией на TypeScript. Ring-LWE, работа с ключами с использованием MAC и SHAKE-256, защита от основных видов атак и другие мысли в реализации протокола QuarkDash.

Читать далее

Когда UI-kit начинает дрейфовать: плагин для WebStorm против поломок React-контрактов

Уровень сложностиСредний
Время на прочтение6 мин
Охват и читатели8.9K

В любом зрелом фронтенде проблема редко в том, чтобы написать еще один Button.

Проблема начинается позже. Когда у компонента уже есть десятки использований, Storybook, типы, обвязки, legacy-слои и пара человек, которые “чуть-чуть расширили API, потому что так было удобнее”.

В этот момент UI-kit начинает незаметно плыть.

Читать далее

Claude отключил мне OpenClaw. Штош… я написал замену TG+Claude Max по oAuth

Уровень сложностиСредний
Время на прочтение5 мин
Охват и читатели12K

В субботу Anthropic заблокировал мой рабочий сетап, построенный на oAuth Claude Code и Telegram. Вместо того чтобы ждать, я за вечер написал self-hosted замену с блэкджеком и постоянной памятью. Рассказываю, как устроен TeleClaude — опенсорсный инструмент, который позволяет управлять проектами через топики в Telegram, используя вашу локальную подписку Claude с лимитами из oAuth. Никаких облаков, API и дополнительных трат. Разбираю архитектуру, систему памяти и показываю, как запустить у себя.

Читать далее

NextAuth + Django JWT без второй авторизации и ручного хаоса токенов

Уровень сложностиСредний
Время на прочтение11 мин
Охват и читатели5.6K

Во многих fullstack-проектах на Next.js и Django авторизация разваливается в одном и том же месте. На фронте удобно использовать NextAuth, потому что он закрывает формы входа, OAuth, серверную сессию и клиентские хуки. На бэкенде хочется иметь обычный JWT-контур на Django REST Framework, чтобы защищать API, работать с access и refresh токенами и не привязывать бизнес-логику к фронту. В итоге часто получается неприятная схема: пользователь логинится через NextAuth, потом отдельно логинится в Django, потом где-то вручную перекладываются токены, а через пару недель вся эта связка начинает ломаться на refresh, logout и OAuth.

Что делаем. Пользователь проходит один вход на фронте, а дальше фронт уже работает с токенами Django как с единственным источником доступа к API. Без второй формы входа, без ручного хранения access token в localStorage, без отдельного костыля под Google OAuth.

Разберем рабочую схему, в которой NextAuth отвечает за пользовательскую сессию на фронте, а Django остается владельцем API-авторизации и выдает JWT. На credentials-входе NextAuth сразу получает access и refresh от Django. На Google OAuth фронт сначала пускает пользователя через провайдера, потом синхронизирует его с Django и тоже получает пару токенов. После этого все запросы идут через один axios-клиент, который сам подставляет access token, сам обновляет его через refresh и сам завершает сессию, если refresh уже недействителен.

Читать далее

Модальные окна в React: архитектура управления для сложных интерфейсов

Уровень сложностиСредний
Время на прочтение13 мин
Охват и читатели7.6K

Модальные окна — один из самых недооценённых слоёв UI-архитектуры. Формы, подтверждения, панели действий — в любом крупном проекте их десятки. И почти в каждом проекте их управление со временем превращается в хаос.

Не потому что разработчики ленивые. А потому что модалки обманчиво просты. useState(false) — и готово. Пока модалка одна, в одном месте, с одним набором данных — проблем нет.

Читать далее

Ближайшие события

Как я в одиночку сделал систему аналитики для Clubs в EA FC, потому что нормальной статистики там просто нет

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели8.8K

Начну с контекста. Я играю в EA FC (ранее FIFA) в режиме Clubs (11×11), где каждым виртуальным игроком управляет человек. Сам по себе режим интересный, но мне, как человеку, который любит цифры и аналитику, довольно быстро стало не хватать доступной статистики.

Я пришёл в лигу, у которой уже был свой сайт (я в этой статье опущу тему о том, что я администрировал проект порядка 3 лет). Там статистику собирали вручную: люди пересматривали записи матчей и заносили базовые показатели — голы, ассисты, перехваты, отборы и так далее. На основе этих данных считались различные рейтинги: лучшие игроки, бомбардиры, разрушители и прочее.

Выглядело это примерно так: набор таблиц, где действия сгруппированы по категориям и амплуа.

Читать далее

«Фронтенд умер»? Жаль, что я узнала об этом только после четырех лет учебы

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели10K

Предлагаю открыть портал в ад и задать вопрос, который сейчас, кажется, витает в воздухе у всех, кто связан с разработкой: фронтенд вообще еще жив? Или логичнее уже сейчас срочно переучиваться, пока через пару лет не пришлось делать это в панике?

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

Читать далее

Frontend Status: свежий дайджест фронтенда и AI — 03.04.2026

Уровень сложностиПростой
Время на прочтение8 мин
Охват и читатели5K

Привет!

Это одиннадцатый выпуск Frontend Status — дайджеста по фронтенд-разработке.

В этом выпуске:

📺 Плейлист по отладке Next.js с Sentry.

🤖 Рэйчел Эндрю и Эдди Османи — два взгляда на AI: когда использовать, а когда координировать целый оркестр агентов.

🛡️ GlassWorm: атака через невидимые Unicode-символы в npm-пакетах и расширениях VS Code.

🎨 CSS Anchor Positioning: два круга, стрелка и ноль строк JS от Темани Афифа.

⚛️ Storybook MCP для React, data-testid как признак недоступности и пошаговые туры через React Joyride.

👁️ Vue Devtools не работает в продакшене? QA-инженер написал свой инспектор.

🌎 Chrome 147 с scoped view transitions, Safari TP 240 и дайджест веб-платформы за март.

🖌️ Осмысленное трение в UX, ARIA-роли для дизайнеров и тест масштабирования шрифтов в Figma.

…и многое другое.

Читать далее

Как я рендерю 3D-квартиры в браузере: Next.js + Three.js, процедурная мебель и мультиплеер на WebSocket

Уровень сложностиСредний
Время на прочтение7 мин
Охват и читатели9.1K

Привет, Хабр. Расскажу, как устроен мой сайд-проект — пиксельная аркада Прикольня, где у каждой компании друзей своя 3D-квартира с мебелью, аватарами и контентом на стенах. Под капотом — Next.js 16, Three.js через React Three Fiber, WebSocket-мультиплеер и PWA. Без единого .glTF файла — вся мебель процедурная.

Читать далее

TypeScript в Next.js как система контрактов, а не типизация ради типизации

Уровень сложностиПростой
Время на прочтение8 мин
Охват и читатели5.1K

Когда разработчик начинает писать на Next.js с TypeScript, первая реакция часто довольно холодная. Вместо того чтобы двигаться быстрее, он начинает чаще видеть ошибки. Где-то не совпал shape объекта, где-то строка не подходит в более узкий тип, где-то TypeScript напоминает, что значение может быть undefined. На этом месте легко сделать неправильный вывод. Кажется, что TS просто добавляет трение и требует больше служебного кода.

Обычно проблема не в TypeScript, а в способе мышления. Если использовать его как набор аннотаций поверх уже написанного кода, пользы действительно немного. Но если смотреть на типы как на систему контрактов между слоями приложения, картина меняется. Особенно в Next.js App Router, где у нас постоянно есть границы server и client, внешний ввод из URL, формы, мутации и разные состояния интерфейса.

В этот момент TypeScript перестаёт быть типизацией ради типизации. Он начинает отвечать на более важный вопрос: какие состояния в проекте вообще допустимы, а какие не должны пройти дальше границы. По такой модели я выстроил один из своих проектов Workbench. Не начинать с мысли давайте везде поставим типы, а начинать с мысли где у нас проходит граница, что в неё входит и что из неё может выйти. После этого многие решения в коде становятся почти очевидными.

Читать далее

Одностраничный сайт на Next.js с навигацией по якорям

Уровень сложностиПростой
Время на прочтение3 мин
Охват и читатели7.5K

Одностраничный сайт с навигацией по якорям на Next.js: как синхронизировать скролл и URL без лишнего кода.

Читать далее

ИИ Workflow для определения и актуализации критериев поиска каскадов ликвидаций на рынке

Уровень сложностиСложный
Время на прочтение15 мин
Охват и читатели7K

Самоадаптирующаяся ИИ-система, актуализирующая критерии каскада ликвидаций

В 2026 году каскады ликвидаций меняют механику быстрее, чем любой статичный бот. Разбираю полный ИИ-воркфлоу на Claude: от фонового агента до фундаментального анализа рынка на открытых источниках

Читать далее