Рубрика «React»

Всем привет! Думаю, что не ошибусь если скажу, что почти каждому фронтендеру приходится заниматься разработкой сложных форм. Те, кто уже имеют такой опыт знают, что работа с формами доставляет боль и страдания. Необходимо держать в голове все правила валидации и заполнения форм, связи между зависимыми полями, нужно как-то связывать данные формы с UI, при этом избегая лишних ререндеров.

На большом проекте мы писали формы через MobX + MVC, думаю, что это не самый плохой подход для написания форм, однако можно выделить следующие недостатки:

Многое пишем руками

Читать полностью »

Хабы: React, FastAPI, TypeScript, Tailwind CSS, Open source, IPTV, Python

Теги: m3u, m3u8, iptv, fastapi, react, hls, epg, drag-and-drop, self-hosted

Введение

У меня был плейлист на 1000+ IPTV-каналов и стойкая привычка править его на свой вкус. Менять порядок каналов, чистить дубликаты, добавлять любимое в группу «Основное» — всё очень неудобно. Каждый раз при обновлении списка каналов/провайдера — заново.

В какой-то момент мне это надоело, и я вдохновленный идеей с помощью ИИ написали m3u StudioЧитать полностью »

  • Покажу на реальном примере, как выглядит найм в 2026.

  • Приведу примеры — свои и коллег из IT.

  • Разберу динамику спроса и предложения: сколько вакансий, сколько активных резюме. Способ простой — можете повторить для любого стека технологий.

  • Без HR-ской чуши про “перегретый/зрелый/охлажденный рынок” и нейрослопного лексикона.

Старые добрые времена

Речь сейчас не о том, что я какой-то особенный специалист или носитель уникальных навыков. То, что я описываю, происходило и со мной, и со всеми коллегами — даже с теми, кто младше по опыту и грейду.

Читать полностью »

Вступление

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

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

Проблемы начинаются, когда проект растёт:

  • Одна модалка нужна в десяти местах интерфейса — и в каждом месте свой <Modal /> с одними и теми же пропсами

  • Читать полностью »

На дворе 2026-й, и за это время как React, так и Vue сделали гигантский скачок в развитии и создании экосистемы вокруг себя. Но статистика до сих пор беспощадна к Vue. На React в два раза больше вакансий, чем на Vue. Сколько я ни спрашивал React-инженеров, ответ был всегда один и тот же: «React для серьезных проектов, а Vue так уж».. Серьезно? Почему вы до сих пор так думаете?? Ну хоть один пример приведите, что нельзя сделать во Vue. Хотя бы потратьте 1 день на изучение экосистемы Vue 3 Composition API, Vue Router, Pinia - да вы после этого забудете про свой React. А про различные useState я вообще молчу, Vue тут вообще вас всех обошел с обычными refЧитать полностью »

Привет! Я Никита, Staff-инженер в крупном финтехе. В этой статье я хочу поделиться нашим опытом построения системы observability. Мы прошли путь от простых логов до сквозной трассировки, и я покажу, как это работает на фронтенде.

TL;DR: В статье разбираем опыт внедрения OpenTelemetry в крупном финтех-проекте.
Проблема: Логи без контекста не позволяют быстро найти причину 500-й ошибки в распределенной системе.
Решение: Сквозная трассировка (Distributed Tracing) от фронтенда до бэкенда.
Что внутри: Реализация CompositeLogger на TypeScript, патчинг fetchЧитать полностью »

Когда говорят «React перерендерился» — обычно имеют в виду что-то расплывчатое. Новичкам это слово объясняет всё и ничего одновременно. В официальной документации процесс описан точнее: trigger → render → commit. Давайте разберём, что происходит на каждом этапе — без магии, зато с Fiber, флагами и браузерным пайплайном.


Render-фаза: вычисление изменений

Render-фаза — это не обновление DOM. Это вычисление того, каким DOM должен стать.

React рекурсивно обходит дерево компонентов, вызывает их функции (или render()Читать полностью »

Новое пополнение в списке «Российские разработоки мессенджеров». Нет, делаем его не по причине отключения нас от мировых сервисов...

Предыстория

В октябре был в путешествии, за пару месяц до, наша компания как и многие компании в РФ стали переходить на свои мессенджеры в замен Telegram. У нас выбор пал на Mattermost, ну это такой, аналог Slack. За период примерно 3 месяца я столкнулся с максимально ужасным UI по моему мнению. Нет, проработка его очень отличная. Но вот трудности в самом представлении для пользователей — ужас.


Threads

Читать полностью »

Полгода назад я решил провести эксперимент: месяц работать с AI-копилотами на максимум — Cursor, GitHub Copilot и ChatGPT — на реальном продакшн-проекте на React/Next.js. Не ради хайпа, а чтобы честно понять: это действительно ускоряет разработку или я просто трачу время на исправление чужих (нейросетевых) багов?

Спойлер: и то, и другое. Но дьявол, как всегда, в деталях.

Контекст

Я фронтенд-разработчик с пятилетним опытом. Основной стек — React, Next.js, TypeScript, Tailwind. Работаю в продуктовой команде из шести человек, проект — B2B-платформа с дашбордами, сложными формами и интеграцией с десятком внешних API.

Читать полностью »

Мне нравится направление, в котором движутся React и Next.js: нативные формы, Server Actions, меньше клиентского JavaScript, больше progressive enhancement.

На уровне идеи это очень красиво.

Но как только форма становится сложнее, чем одно поле email, выясняется, что вокруг нее снова появляется много однотипного glue code:

  • достать значения из FormData

  • собрать массивы и вложенные поля

  • провалидировать все через zod

  • превратить ошибки zod в удобный объект для UI

  • вернуть предсказуемый state для useActionState

  • снова руками прописывать defaultValue, defaultChecked, Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js