FrontEndDev

Инструменты для проверки доступности Обзорная статья о том, почему доступность - один из важных аспектов разработки, и какие инструменты можно использовать для тестирования. https://techhub.iodigital.com/articles/accessibility-tools

Экспериментальный React Transition API С первого релиза до настоящего времени у React не было своего API для анимации, и приходилось использовать библиотеки (например, Motion for React или React Spring). Наконец разрабочики решили залатать эту дыру. Теперь можно попробовать ViewTransition. Подробнее — в статье. https://motion.dev/blog/reacts-experimental-view-transition-api

Ваша карьера в Frontend-разработке начинается в Авито 😎 Приходите на оплачиваемую стажировку в Авито. Здесь вы будете работать с продуктами, которыми пользуются миллионы. Профессионально развиваться и расти вам помогут: • наставник — научит, как найти лучшее решение, и поможет разобраться в инструментах и технологиях • комьюнити стажёров — поделятся опытом и поддержат • доступ к базам знаний, библиотекам и корпоративным курсам — даст возможность нарастить экспертизу. Стажировка открыта в пяти направлениях, вы можете выбрать два — основное и запасное. Если попасть на первое не удастся, сможете пройти отбор на второе при наличии мест. Условия: • длительность программы — 6 месяцев • работа от 25 часов в неделю, после завершения стажировки — возможность остаться в компании на полную занятость • зарплата и корпоративный ноутбук • можно работать из офиса, удалённо или в гибридном формате. Более 80% стажёров продолжают карьеру в Авито. Присоединяйтесь к команде и растите вместе с нами! Регистрация открыта до 5 февраля.

Перемещение элементов в DOM при помощи moveBefore moveBefore позволяет перемещать элементы без первоначального удаления их из DOM, что добавляет удобства, т.к. в случае iframe - нет перезагрузки содержимого, активные элементы остаются в фокусе и т.д. Более подробно - по ссылке. https://www.bram.us/2025/01/16/move-elements-around-the-dom-while-preserving-their-state-with-movebefore/

Избавляемся от any в проектах на TS any отключает многие проверки типов и снижает безопасность кода. Заметка о том, какие правила линтинга использовать, чтобы сделать ваш код более надежным. https://typescript-eslint.io/blog/avoiding-anys/

Очередной кейс использования container queries и селектора :has() Ахмад Шадид рассказывает и показывает, как создавал функционал заглавной картинки для своего блога. https://ishadeed.com/article/modern-css-feature-image/

CSS text-box-trim О том, как работает свойство для обрезки лишнего пространства у текста, и для каких случаев его удобно применять. https://developer.chrome.com/blog/css-text-box-trim?hl=ru

6 полезных CSS сниппетов ▫️использование контейнерных запросов; ▫️создание прокрутки с привязкой; ▫️избегание position: absolute с помощью CSS Grid; ▫️быстрое создание круга; ▫️использование каскадных слоев; ▫️применение логических свойств для упрощения кода. https://web.dev/articles/6-css-snippets-every-front-end-developer-should-know-in-2023

Введение в Nginx Знакомство с базовыми концепциями одного из самых популярных серверов. https://www.netguru.com/blog/nginx-tutorial-basics-concepts

Примеры утечек памяти в JavaScript Разбираем несколько причин утечек памяти и способы их устранения. https://www.youtube.com/watch?v=HJSnq0z_cOE

Офер в Яндекс для опытных фронтендеров за два дня 15–16 февраля приглашаем фронтендеров с опытом работы от пяти лет получить офер в Яндекс через multitrack за 2 дня. Достаточно пройти несколько технических секций 15 февраля, чтобы уже 16-го получить офер и выбрать три команды, к которым вам было бы интересно присоединиться. Как правило, за несколько собеседований сложно понять, подходит ли вам команда и наоборот. Multitrack позволит вам поработать в трёх разных командах Яндекса и выбрать подходящую. Вы сможете погрузиться в рабочие процессы, познакомиться с будущими коллегами и понять, с какими задачами и технологиями хотите работать. Узнать подробности и зарегистрироваться.

RegexpGarden Игровое обучение регулярным выражениям. 42 задания от просто к сложному раскрывают аспекты работы с регулярками. 👉 Внимание, чтобы перейти к описанию урока нажмите на крестик в сайдбаре (рядом с Select Lesson) https://regexp-garden.madewith.fun/

2024 JavaScript Rising Stars Тренды и популярные проекты в экосистеме JavaScript за 2024 год. https://risingstars.js.org/2024/en

Передача переменных и значений между HTML, CSS и JavaScript Короткая заметка о том, как прокинуть значение в HTML с помощью CSS переменных и DOM API. https://frontendmasters.com/blog/sharing-a-variable-across-html-css-and-javascript/

Т-Банк открыл набор на новый поток стажировок 💻 Есть много направлений: разработка (на восьми языках программирования!), ML, SRE, QA, аналитика, менеджмент, редактура, маркетинг и юриспруденция. Ждут студентов и начинающих специалистов, готовых посвящать работе от 20 часов в неделю. Стажировки оплачиваются, а по результатам нескольких месяцев вас могут пригласить на интервью в штат. Вы будете участвовать в реальных проектах и разрабатывать решения с нуля с полным погружением в бизнес-процессы. Стажеры отлично справляются с тем, чтобы совмещать работу и учебу: менторы и руководители относятся к этому с пониманием. Выберите направление, отправьте заявку и решите экзамены до 30 января

Александр Моргунов — Разбираемся в Feature-Sliced Design Александр из Samokat.tech рассказывает, что из себя представляет архитектурная методология Feature-Sliced Design и ее основные концепты. https://www.youtube.com/watch?v=H_rJ0zB8rqc

AI ассистент прямо в DevTools С недавнего времени в Chrome появился свой асистент, который помогает с вопросами по отладке. Вот небольшой обзор и краткое руководство от разработчиков Chrome. https://developer.chrome.com/docs/devtools/ai-assistance?hl=ru

Оmatsuri Набор инструментов на каждый день: компрессор, декодер, генератор градиентов и многое другое. Это опенсорсный проект, репу можно глянуть тут https://github.com/rtivital/omatsuri https://omatsuri.app/

Онлайн-курс по frontend-разработке от НИУ ВШЭ Центр непрерывного образования ФКН НИУ ВШЭ открывает набор на новый онлайн-курс «Frontend-разработчик» для начинающих. Программа подойдет: 〰️〰️〰️〰️ - Новичкам в IT: освоите разработку сайтов - IT-специалистам, которые хотят освоить разработку интерфейсов: познакомитесь с особенностями и инструментами frontend-разработки За 4 месяца вы: 〰️〰️〰️〰️ - Узнаете, как устроены сайты - Научитесь создавать базовые элементы с помощью HTML и таблиц стилей CSS - Освоите разработку интерактивных страниц (языки JavaScript и TypeScript) - Научитесь разрабатывать одностраничные и мобильные приложения (библиотека React.js) - Сделаете итоговый проект Старт онлайн-курса — 17 февраля. Погрузиться во frontend-разработку можно на бесплатном онлайн-интенсиве «Frontend с нуля: первый шаг в веб-разработку». Подробнее о программе Реклама: НИУ ВШЭ ИНН 7714030726 Erid: 2SDnjcLjzFv

Основные ошибки при использовании React Testing Library Кент Си Доддс описывает распространённые ошибки при использовании RTL и предлагает рекомендации по их предотвращению. https://kentcdodds.com/blog/common-mistakes-with-react-testing-library