Mr Frontender

Начинающие и опытные разработчики зачастую допускают одни и те же ошибки при написание CSS. Сегодня, мы рассмотрим, как можно оптимизировать CSS код. 1. Не перезаписывайте padding или margin Разработчики часто устанавливают padding или margin для всех элементов, а затем сбрасывают их для первого или последнего элемента. Однако, зачем использовать два правила, когда вы можете обойтись одним. Гораздо проще установить поля и отступы для всех необходимых элементов сразу. Используйте один из следующих...

В этой статье я расскажу об основных концепциях JavaScript, которые необходимо изучить каждому начинающему разработчику. 1. События JavaScript - это язык, который функционирует с помощью событий. Обычно какое-то действие или событие от пользователя инициирует выполнение скрипта. Разработчик создаёт обработчик событий, который будет выполняться при срабатывании определенного события, например, нажатие на кнопку, наведение курсора и т.д. Существует множество событий DOM, которые необходимо изучить начинающему разработчику...

Разработчики, которые приходят на React с шаблонных языков, таких как Handlebars, часто удивляются, что JSX не имеет встроенного условного синтаксиса. По-сути, JSX - это просто JavaScript, и сегодня я расскажу о 5 способах использования JS для условного рендера в React компонентах. 1️⃣ Переменные для компонентов Мы можем записать JSX-компонент в переменную и затем отрисовать эту переменную. Можно использовать 'if-else' или 'switch'. Изначально, я в основном использовал данный способ для условного рендеринга, потому что мне нравилось, что он сохранял JSX более "чистым"...

Адаптивный веб-дизайн (далее АВД) - это не какая-то программа или фреймворк. Можно сказать, что это комбинация различных концепций, с помощью которых мы стараемся сделать так, чтобы наша веб-страница хорошо выглядела на всех устройствах. Самое замечательное, что вы можете достичь АВД, используя только HTML и CSS ⚡ 1️⃣ Первое и самое главное, чтобы сделать АВД - это использовать тег <meta> viewport. Данный тег заставляет страницу следовать ширине экрана устройства. 2️⃣ Второй важный момент, который...

Создание с нуля небольших проектов - это лучший способ изучить фронтенд-разработку. Итак, вот 5 идей, которые вы можете использовать и, на их базе, создавать проекты с помощью ванильного JavaScript или вашего любимого фреймворка. 1. Приложение для списка дел (Todo List) Есть причина, по которой этот проект является классическим. Он учит вас многим основам, таким как работа с массивами, обработка пользовательского ввода и отображение информации на экране. Сосредоточьтесь на основных функциях, таких как добавление элементов и пометка их как выполненные, возможно, с помощью анимации...