Обновить
17.85

ReactJS *

JavaScript-библиотека для создания интерфейсов

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

Организация импортов в React + TypeScript: настройка ESLint для порядка и чистоты кода

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

Стек: React, TypeScript, ESLint 9, IDE: VS Code.

Импорты в приложении – самодокументируемая шапка файла. Взглянув на неё, можно быстро сделать вывод о содержимом: какие библиотеки, компоненты, типы и стили - если речь о React-компоненте - используются в файле, и создать общее впечатление о модуле.

Хорошо, когда эта «шапка» имеет единый порядок: мы быстро можем увидеть, например, какие типы использует файл, много ли компонентов он содержит и т.п. Короче говоря – это ускоряет и точечный, и общий анализ файла. Ну и просто приятно, когда код содержится в порядке и подчиняется единым правилам.

Читать далее

Новости

Как мы улучшили время загрузки React Native приложения в 10 раз

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

Эта статья - перевод поста в блоге Alex, Baton Corporation Team Lead, вышедшего 20 февраля 2026 г.

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

Далее следует перевод

Как я ускорил работу с Claude Code в 2 раза: разбираем Agentation

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

Я совсем не опытный фронтендер, но вайбкодинг уважаю и люблю. Отдельная боль - это создание стабильных и хороших UI для своих проектов. И вот представь: используешь Claude Code в разработке своего очередного стартапа-единорога и пытаешься объяснить агенту что нужно поправить: "сделай кнопку темнее и ту фигуру закругленней". Какую? «Ну ту, в сайдбаре». Так их там три. «Вторую сверху, с иконкой». Агент правит первую и как итог - ты возмущаясь, пишешь подробное описание с координатами, классами, соседними элементами и всё равно 50 на 50, что он поймёт. Если знакома эта боль, то есть интересная штука под названием Agentation.

Реноме у него довольно рекламное: за пару месяцев проект набрал 120 000+ загрузок на npm и наделал много шума, став частью воркфлоу многих разработчиков, которые активно vibe-кодят с AI. В этой статье разберем: что это за штука, как устроена изнутри, зачем нужна версия 2.0 с MCP, как завести и пользоваться самому и стоит ли вообще тратить время. Спойлер - если ты React-разработчик и работаешь с AI-агентами, то да, попробовать стоит.

Читать далее

Умный выбор домена: MCP-Server + Cursor. Как я перестал перебирать занятые имена

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

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

Проверять каждый вручную — мучение. Я нашел элегантное решение: связал Cursor IDE и свой MCP-сервер для проверки WHOIS. Теперь агент сам предлагает и сразу проверяет доступность доменов. В статье делюсь конфигом и показываю, как это настроить за 5 минут.

Настроить Cursor

Выбор стека для веб-сайта: обзор типов рендеринга — SSR, SSG, CSR и другие

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

В современном мире веб-разработки выбор стратегии рендеринга сайта является одним из ключевых решений, определяющих его производительность, оптимизацию для поисковых систем (SEO) и пользовательский опыт. От того, как и где генерируется HTML-код вашего приложения, зависит скорость загрузки, интерактивность и даже стоимость инфраструктуры. В этой статье мы подробно рассмотрим основные типы рендеринга — Client-Side Rendering (CSR), Server-Side Rendering (SSR), Static Site Generation (SSG), Incremental Static Regeneration (ISR) и набирающие популярность React Server Components (RSC) — их преимущества, недостатки, влияние на SEO и производительность, а также приведем примеры технологических стеков для каждого подхода.

Статья будет полезна для всех кто занимается разработкой сайта(вайбкодеры, веб-разработчки итп.)

Читать далее

Четыре провала за четыре года — и четыре человека с AI, которые переписали всё за два месяца

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

Четыре года мы пытались переписать нашу платформу для проведения IT-соревнований Codenrock. Четыре раза отступали. На пятый — два разработчика, тестировщик и UI-дизайнер справились за два месяца. У каждого — Claude Code на максимальной подписке. 

Это история о том, как технический долг накапливает проценты, как мы выбирали стек для новой платформы и что на самом деле значит «80% кода пишет AI».

Читать далее

Nexus State: Современный менеджер состояния для JavaScript-приложений

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

В экосистеме JavaScript-разработки управление состоянием приложений всегда оставалось одной из самых сложных задач. От глобальных переменных до сложных библиотек вроде Redux и MobX — разработчики постоянно ищут более простые и эффективные решения.

Сегодня мы познакомимся с Nexus State — новой библиотекой для управления состоянием, которая сочетает простоту использования Atom-подхода с мощными функциями для реальных приложений. В этой статье мы рассмотрим архитектуру Nexus State, его возможности, и проведем объективное сравнение с существующими решениями.

Читать далее

Тихие сбои React Compiler и как их исправить

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

React Compiler обещает избавить от ручной мемоизации и вернуть разработчику фокус на логику интерфейса. Но за этой когнитивной разгрузкой скрывается тонкий риск: в ряде случаев компилятор тихо откатывается к обычному поведению React, и вы узнаёте об этом только по деградации UX. В статье — практический разбор «тихих» сбоев, ограничений синтаксиса и способа заставить сборку честно сигнализировать о проблемах через ESLint.

Разобрать проблему

Как приблизить веб-звонки к нативному UX

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

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

Поэтому некоторые популярные сервисы вообще запрещают звонки из мобильного браузера и просто отправляют пользователя устанавливать нативное приложение.

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

Читать далее

Работа над ошибками. Как я ускорял Next.js приложение. React Compiler, Redis и многослойное кеширование

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

Как заставить летать список из 5000+ товаров на странице? Нативный рендер кладёт вкладку, а все базовые оптимизации уже сделаны.

Разбираем послойно: внедрение React Compiler (React 19), виртуализация через TanStack, гибридное кэширование (Redis + unstable_cache) и архитектура работы с анонимными пользователями без лишних запросов к БД. Работа над ошибками, которая ускорила проект в разы.

Как я ускорял Next.js

Небоскребы на болоте: 3 фундаментальные ошибки разработчика на React

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

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

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

Моя главная претензия к современному реактивному сообществу проста: вы потеряли фундамент. Вы строите небоскребы на болоте, игнорируя три фундаментальных правила игры, которые заложили авторы библиотеки.

Читать далее

Как я боялся Copilot, и продолжаю боятся

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

Здравствуйте!

Цель статьи - поделиться опасениями от использования ОТЛИЧНЫХ AI-ассистентов и услышать мнение сообщества по их поводу.

Я C# разработчик, и в своей работе в 90% случаев использую VisualStudio. 50% моей работы - создание типовых RESTful сервисов для бэкэнда нашего продукта. Еще процентов 30% - работа с обработкой изображений и видео. И процентов 20% рабочего времени я трачу на различные R&D исследования разной степени сложности.

В 2023 году ChatGPT плотно захватил умы прогрессивного человечества. Мы развлекались как могли. А я в свою очередь стал использовать ChatGPT, а затем и DeepSeek для рутинных задач. Например, сгенерировать набор классов по JSON, отредачить текстовку и т.п. Работа не всегда была выполнена чисто - то напутает с типами данных, то поломает стилистику. В общем приходилось ревьювить каждую генерацию. Но в целом, это здорово помогало экономить время. К тому же мало помалу я составил идеальные промты для каждой задачи, и казалось вот оно светлое будущее.

Затем появился Copilot и часть своих задач я начал выполнять непосредственно в VS. Copilot научился нативно интегрироваться в IDE, представлял удобнейший инструмент для включения результатов своей работы в код и остальные плюшки. Коллеги, между тем, на месте не стояли и расширяли набор сценариев взаимодействия с Copilot. Да и сам Copilot предлагал все более интересные модели.

Начались шуточные разговоры про бездушную машину, замену человека и прочие шутки в этом роде. И если вы подумали, что именно этого я боялся, то нет. Точнее на данном этапе я этого совсем не боялся.

Читать далее

WebSocket и RTK Query: живое общение в React-приложении

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

Представьте, что вы смотрите онлайн-трансляцию матча. Счёт меняется — и вы видите это мгновенно, без перезагрузки страницы. Или вы пишете коллеге в чате — сообщение появляется у него в реальном времени. Это не магия, а технология WebSocket.

В этом уроке вы узнаете:

Читать далее

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

Мы запихнули LifeOS в Telegram Mini App: как сделать сложный UI на React + Framer Motion и не сойти с ума

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

На рынке тысяча трекеров привычек. Еще тысяча трекеров зала. И еще сотня приложений для медитаций. Проблема одна: они разрозненны. Данные о том, что я плохо спал, никак не влияют на план тренировок в другом приложении. А медитация живет в вакууме от уровня стресса.

Мы хотели создать LifeOS — единую систему управления собой, которая живет там, где я провожу 90% времени. В Telegram. Никаких впнов, ноушенов и тому подобное не надо.

Но была проблема: стандартные Telegram WebApps часто выглядят... как веб-сайты из 2010-го. Мне нужен был «вайб» Apple: премиальный, темный, с глубокими тенями и, главное, тактильный.

Так появился UltyMyLife. Вот как мы строили архитектуру дисциплины на React.

Интересный факт: Перед тем как релизнуть проект, мы поняли, что нужен полный редизайн, и в итоге потратили еще пару недель.

Читать далее

Заголовок<br>

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

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Читать далее

Главные изменения JavaScript в 2026 году

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

В 2026 году обновят JavaScript. Окончательный список изменений сформируется из проектов ECMAScript, достигших 4 этапа к марту. Но многие из них уже на заключительной стадии, а другие готовы и доступны в некоторых браузерах и средах. Под катом — что ждёт разработчиков и какие проблемы будут решены в этом апдейте.  

Читать далее

Запилил кросс-фреймворк Markdown/MDX парсер, чтобы не мучаться с контентом

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

Всем привет!

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

С одной стороны, есть «конструкторы» типа unified, remark и rehype. Штуки мощные, но настраивать весь этот AST-конвейер и систему плагинов — это какой-то оверхед и лишняя сложность, имхо.

С другой стороны, есть @next/mdx, который вроде и ок, но слишком завязан на страницах и вообще не умеет работать на клиенте.

Раньше я обычно выбирал что-то вроде markdown-to-jsx или react-markdown.

DX у них приятнее, работают и на клиенте, и на сервере, весят мало.

Но вот беда: они «из коробки» не переваривают HTML или MDX, и ты снова вязнешь в настройке плагинов. А если добавить туда i18n (типа i18next или next-intl), начинается настоящий ад. Куча if/else в коде, чтобы отрендерить нужный язык, и бандл раздувается до небес. Плюс вечные косяки с front-matter. Ну и до недавнего времени всё это было только для React.

В общем, решил я написать свое решение для intlayer. Чтобы просто работало.

> К слову, за основу я взял форк markdown-to-jsx v7.7.14 (от quantizor), который базируется на simple-markdown v0.2.2 (от Khan Academy).

Когда пилил этот парсер, ставил перед собой такие цели:

- Максимально легкий вес

- Кросс-фреймворковость (React, Vue, Svelte, Angular, Solid, Preact)

- Простая настройка: никаких бесконечных цепочек плагинов

- Поддержка SSR и клиентского рендеринга

- Настройка на уровне провайдера: можно легко прокинуть свои компоненты из дизайн-системы

- Компонентный подход: полный контроль над рендерингом каждой части приложения

Читать далее

Плиточная карта России на React: прототип с drag & drop и zoom без библиотек

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

Здравствуйте, снова я — Дмитрий, React-разработчик. Все мы видели с вами такие карты, именуемые картойдами, в данном случае — карта России, я взял первую попавшуюся из интернета, для примера.

Читать далее

Моя RAG-система: как я за 8 дней собрал RAG для своего сайта визитки

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

За 8 дней частичной занятости я собрал RAG-систему на NestJS + PostgreSQL (pgvector), которая обрабатывает ~11 000 чанков документов.

Первая версия отвечала около 4 минут, после оптимизации - 40–60 секунд.

Главный вывод: RAG - это не «векторный поиск + LLM», а в первую очередь подготовка данных, фильтрация контекста и аккуратная работа с промптами.

Читать далее

Создание приложения на React Native: часть первая

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

В этой статье мы познакомимся и детально изучим процесс создания приложения на кроссплатформенном фреймворке React Native. Рассмотрим, какие библиотеки понадобятся для работы, как правильно настроить структуру приложения, собрать его и протестировать его на различных устройствах.

Приступим
1
23 ...