Frontend Разработка | JavaScript & Верстка сайтов. HTML, CSS и React. Уроки для Фронтенд Developer. JS, Vue и Web технологии. IT Карьера, Курсы и Coding.

Совет по CSS 💡 Возможно, ты не знал, что можно задать и min-width, и width всего одной строкой кода в CSS 👉 @frontend_1

▶ Видео

CSS-совет 💡 Нет необходимости создавать отдельные версии логотипа в градациях серого для тёмного и светлого режимов. Это легко делается с помощью CSS-фильтров 👉 @frontend_1

Как добавлять условные свойства объектов в JavaScript При создании объектов в JavaScript иногда требуется включать определённые свойства только при выполнении конкретных условий. Этот приём можно реализовать с помощью оператора расширения (…) в сочетании с условной логикой. Давайте разберём, как овладеть этим мощным инструментом для более гибкого и динамичного создания объектов. Проблема статических свойств объектов Представьте: вы создаёте объект пользователя и хотите добавить разные свойства в зависимости от его статуса. Возможно, он администратор, или у него есть премиум-подписка, или и…

3 полезных совета по Tailwind CSS Tailwind CSS произвел революцию в том, как мы подходим к веб-дизайну, предложив утилитарно-ориентированный фреймворк, который позволяет быстро разрабатывать и легко настраивать интерфейсы. В этом посте мы рассмотрим три менее известных, но очень полезных совета по Tailwind CSS, которые помогут ускорить рабочий процесс и улучшить качество кода. 1. Используйте size-{n} для одинаковой ширины и высоты Вместо того чтобы отдельно задавать ширину и высоту, можно использовать утилиту size-{n}, если элементу нужны одинаковые размеры. <!-- Вместо этого --> <div cla…

Приглашаем Backend‑, Frontend‑, FullStack‑разработчиков, системных аналитиков, архитекторов ПО и Team Lead оценить формат обучения курса OTUS «Архитектор программного обеспечения» на бесплатных открытых уроках: • 9 ноября, 20:00 — «Монолит или микросервисы? Руководство для архитекторов, которые ценят свои нервы». Разберём критерии выбора архитектуры, скрытые издержки моделей, паттерны перехода (Strangler Fig, BFF и др.), роль DevOps и мониторинга. • 23 ноября, 20:00 — «NoSQL в бою: как Cassandra помогает строить отказоустойчивый бэкенд». Фокус на архитектуре Cassandra, балансе консистентности…

Где CSS подложил вам ловушки Мне кажется, что каждый фронтендер множество раз сталкивался с ситуацией, когда CSS переставал работать так, как ожидаешь. Причём не имеет значения опыт разработчика. С одинаковой вероятностью в тупик может попасть как джун, так и опытный разработчик. Не зря же CSS стал героем такого количества мемов. Я и сам не раз попадал в подобные ситуации. Но, несмотря на все эти сюрпризы, CSS мне по-прежнему нравится. Конечно, изменить стандарты я не могу. Зато могу рассказать о ловушках, в которые когда-то я попался. Возможно, некоторые из них окажутся неожиданными и для в…

Сократите свой CSS-код с помощью :where() Используйте псевдокласс-функцию :where(), когда нужно применить одинаковые стили к нескольким элементам, не беспокоясь о том, что порядок селекторов повлияет на специфичность правил. Это простой способ сделать CSS более предсказуемым и удобным для поддержки. /* Without :where() */ .container > h1, .container > .card h1, .container > .card:last-child { border: 2px solid red; padding: 10px; } /* With :where() */ .container > :where(h1, .card .h1, .card:last-child) { border: 2px solid red; padding: 10px; } 👉 @frontend_1

Распространённые коды состояния HTTP 👉 @frontend_1

CSS совет 💡 Возможно, вы не знали, что в CSS можно задавать поворот, используя единицу измерения turn 👉 @frontend_1

Ищем студентов-айтишников без опыта. Платят выше рынка. Только проверенные компании: Сбер, Авито, Альфа-Банк и еще 20+ работодателей на Найти IT в Санкт-Петербурге. 📍 24 октября, DAA EXPO Участие бесплатное. Регистрируйся ⬅️