FrontEndDev

Работа с Context API в React Обзорная статья о том, как Context API помогает управлять состоянием приложения и шарить данные между компонентами без необходимости передавать их через props. Примеры использования Context API https://blog.logrocket.com/react-context-tutorial/

Условные типы в TypeScript Как использовать условные типы для упрощения кода и повышения его гибкости + примеры использования условных типов в различных сценариях программирования https://2ality.com/2025/02/conditional-types-typescript.html

TTFB и его значимость для производительности Cтратегии для улучшения TTFB и общей скорости загрузки страниц с учетом различных факторов. https://smashingmagazine.com/2025/02/time-to-first-byte-beyond-server-response-time/

🚀Приглашаем на бесплатный урок «React и графические библиотеки: визуализация данных» от онлайн-курса React.js Developer 20 февраля 19:00 (мск). Что будет на вебинаре? - Обзор популярных графических библиотек для React. - Установка и настройка необходимых зависимостей в проект React. - Примеры визуализации данных. Кому вебинар будет полезен? - React разработчикам, работающим с аналитикой и данными. - Разработчикам, желающим улучшить UI своих приложений. - Командам, внедряющим инструменты для анализа и представления данных. Что узнают участники вебинара? ✅Как визуализировать данные в React. ✅Как интегрировать визуализации в существующие приложения. ✅Как создавать интуитивно понятные и привлекательные визуализации для пользователей. ⏰ Успейте зарегистрироваться на бесплатный вебинар 20 февраля 19:00 (мск). Запись ограничена: https://otus.pw/0MOJ/ Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576

Пишем более чистый и понятный код с eslint-plugin-de-morgan Плагин предлагает правила для преобразования логических выражений, чтобы избежать избыточных операторов и улучшить читаемость https://github.com/azat-io/eslint-plugin-de-morgan

Flexbox Labs Удобный генератор лейаутов с grid и flexbox элементами. Можно выбрать готовый вариант или тыкать и смотреть как применяются свойства для контейнера и вложенных элементов. https://flexboxlabs.netlify.app/ Github: https://github.com/prazzon/flexbox-labs

Оптимизируем Critical Rendering Path О том, что такое Critical Rendering Path и о методах ускорения загрузки и отображения контента: минимизация CSS, JavaScript и оптимизация порядка загрузки ресурсов. https://www.debugbear.com/blog/optimizing-the-critical-rendering-path

Архитектура фронтенда на основе вертикальных слайсов Как вертикальные слайсы могут помочь в масштабировании проекта и управлении сложностью приложения. Еще один взгляд на архитектуру фронтенд приложений. https://amorgunov.com/posts/2023-05-28-vertical-sliced-architecture-in-frontend/

Друзья! 15 февраля состоится крупнейшая конференция Яндекса для frontend-сообщества — «Я 💛 Фронтенд». Что вас ждёт: 💛 Интересные доклады — ведущие эксперты индустрии поделятся своим опытом и лайфхаками. 💛 Code in the Dark — вместе с Семёном Левенсоном из Яндекс Маркета поучаствуете в соревновании по вёрстке и узнаете, как интеллектуальный помощник разработчика Yandex Code Assistant меняет правила игры. 💛 CodeRun — вместе с Никитой Дубко и Сашей Шинкевич из Контеста Яндекса познакомитесь с тренажёром для прокачки навыков разработчика. Это интересный формат решения задач, где нужно управлять котиком Кодеруном. Он ловит спецсимволы в свой рюкзак, и на их основе вы пишите код. Еще будут дискуссии с экспертами Яндекса, выступления опытных спикеров, соревнования по вёрстке и решение задач с Yandex Code Assistant. И это ещё не всё! Следите за обновлениями на сайте до 14 февраля — в онлайне вас ждёт много движа! Программа мероприятия и регистрация тут Не пропустите! 🚀

Релиз Vitest 3.0 Новые функции и улучшения: высокая скорость выполнения тестов и улучшенная поддержка TypeScript https://vitest.dev/blog/vitest-3

Используем TypeScript и TensorFlow для обучения модели Пошаговые инструкции по процессу настройки окружения, подготовке данных и созданию модели на основе библиотеки TensorFlow https://wanago.io/2025/02/03/machine-learning-typescript-tensorflow-training-first-model/

Ключ к стабильному деплою: npm ci Короткая статья о том, почему важно использовать команду npm ci для обеспечения стабильного деплоя и как npm ci помогает избежать проблем в продакшн, обеспечивая точное совпадение зависимостей и оптимизацию установки пакетов. https://dev.to/impranavkale/avoiding-production-disasters-with-npm-ci-the-key-to-stable-deployments-47ib

Интервью на английском: пошаговая инструкция Наши друзья из @acceleracio помогли многим ребята получить зарубежные офферы. С их помощью и вы сможете проложить дорогу к своей компании мечты! Четверг, 13 февраля в 20:00 по мск, готовимся к офферам из Европы и Америки: ✅ обсуждаем, что работает на собеседованиях, а что устарело, ✅ составляем отличное резюме, которое пройдет ATS проверку, ✅ даем инструменты для эффективного поиска работы, ✅ и отвечаем на ваши вопросы — конечно, с огромным удовольствием! Регистрация и ссылка на зум: @acceleracio_bot ⚡️ После вебинара в боте вас ждут инструменты, которые приведут к офферу ✨ @acceleracio — проект про карьеру, рекрутинг и искусство прохождения собеседований. Добавляйте в календари и приходите: сделаем этот год началом вашей международной карьеры!

Улучшаем UX c помощью scroll-select Статья о преимуществах использования scroll-select, позволяющего пользователям легче находить нужные опции в длинных списках. А также примеры реализации и советы по интеграции. https://blog.logrocket.com/improve-ux-with-scroll-select-box/

🎉 Результаты розыгрыша: Победитель: 1. Филипп (@felix2d6) Проверить результаты

Cоздании SPA на Vanilla JS Статья с основными принципами и подходами к разработке SPA без использования фреймворков. https://jsdev.space/spa-vanilla-js/

Друзья! Разыгрываем 1 билет на Podlodka React Crew! Podlodka — это отличная возможность послушать классные доклады и позадавать каверзные вопросы экспертам! Итоги розыгрыша подведем 8 февраля. Всем удачи! ✌️

Деплоим Next.js приложение с Deno Deploy Небольшой туториал о том, как разворачивать приложения Next.js с использованием Deno Deploy: преимущества и шаги для интеграции этих технологий. https://blog.logrocket.com/deploying-next-js-apps-with-deno-deploy/

Плавные переходы для top-level элементов с использованием свойства display Используем новые возможности CSS для управления элементами в верхнем слое. Автор объясняет, как можно плавно анимировать переходы с помощью @starting-style и transition-behavior. https://smashingmagazine.com/2025/01/transitioning-top-layer-entries-display-property-css/

Друзья! Стартует очередной сезон Podlodka React Crew – онлайн-конференции для React-разработчиков. Иду сам и по традиции зову вас с собой! Послушаем и обсудим новые фичи и подходы, и определимся, какие из них включить в свой roadmap и как расти дальше. В новом сезоне разберемся, какие инструменты и знания включают в роадмапы профессионального развития и насколько они применимы. В программе: 💬 Говорим на одном языке с пользователями: i18n в React-приложениях – Виталий Баев, контрибьютор Next.js и Vite 🌍 Как выбрать инструменты и сделать интерфейс удобным для всех? 📡 OpenTelemetry для фронтенд-разработчика – Валерий Катцин, frontend-разработчик в Точке 📊 Как собирать данные о работе приложения и использовать их для улучшения продукта? 🔥 "Долгожданный" React 19 – Алекс Рассудихин, разработчик с опытом во Vue, React, Next и Astro 🚀 Какие фичи вышли в продакшен, а какие – нет? 🤖 AI Integrated Developer Experience – Марк Байдебура, Senior Full-stack Engineer в Influencer 🧠 Где AI реально помогает, а где пока его лучше не использовать? 📅 Конференция пройдет 10-14 февраля. 🔗 Регистрируйтесь: podlodka.io/reactcrew Для подписчиков FrontEndDev есть промокод на скидку 🥳 500руб react_crew_2_mP8t41 По традиции разыграем бесплатный билет. Следите за постами!