Верстальщик от бога

Мой топ CSS-in-JS решений #почитать CSS‑in‑JS — подход к стилизации, который позволяет писать стили прямо в JavaScript‑коде. Преимущества такого подхода: Изоляция стилей: компоненты получают свои собственные стили. Динамические стили: легко применять стили в зависимости от состояния компонента или пропсов. Поддержка тем: удобное управление темами и их переключение на лету. Интеграция с JavaScript. ⏱Читать статью

JavaScript. Обработка событий на примерах Автор: Янцев В. В Год издания: 2021 #javascript #ru Скачать книгу

▫️ Создание интернет-магазина на Opencart #посмотреть 18 уроков. ⏱Смотреть на YouTube

Маска изображения #почитать Часто упускаемое из виду CSS свойство mask-image может быть простым способом привнести немного индивидуальности в вашу работу над веб-дизайном. ⏱Читать статью

overflow #почитать

Свойство overflow позволяет буквально определить, что делать с содержимым блочного (то есть для элемента, у которого display определяется как block, inline-block, flex или grid) элемента, если оно не влезает в размеры — отобразить или обрезать (с полосами прокрутки или без).

⏱Читать статью

Вопросы к собеседованию React (Junior level) #почитать

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

⏱Читать статью

CSS3 - Создание слайдера в стиле аккордеона #почитать

На этом уроке мы создадим слайдер, который будет работать наподобие аккордеона. Разработку слайдера выполним только с помощью стилей CSS 3.

⏱Читать статью

🟡Друзья! Наступает осень — пора учиться 🎓 Сегодня мы рекомендуем супер-полезные каналы с еженедельными дайджестами полезных материалов по тестированию и проджект-менеджменту Подпишитесь и будьте в курсе последних новостей и видео в индустрии. Всего 1-2 поста в неделю и у вас есть все, что вышло за неделю. 🟡PM Live 🚩 проджект и продакт менеджмент 🟡QA Live 🚩 тестирование ПО

Создание статических сайтов из Markdown без HTML (pandoc, mkdocs, hugo и jekyll) #почитать

На протяжении нескольких лет практики написания скриптов на PowerShell, я веду заметки преимущественно связанные с данным языком и периодически фиксирую их в своем репозитории на GitHub (за последние несколько месяцев добавил достаточно много новых пример, в том числе шпаргалку по работе с командами Docker), чтобы всегда можно было к ним обратиться с рабочего компьютера через Интернет. Недавно задумался, почему бы не попробовать создать из файла в формате Markdown статический сайт, который можно очень просто, и главное бесплатно разместить на том же GitHub, особенно это стало актуально с тех пор, когда количество строк документа перевалило за 6 тысяч и на главной странице с описанием проекта весь объем документа уже не умещается, а используя приложение на Andrioid вовсе отображается пустая страница (хотя, достаточно разбить документ на несколько, что в будущем я и сделал для сайта). У меня нет опыта создания полноценных сайтов (за исключением конструкторов), и такой вариант я даже не рассматривал, язык описания README файлов очень даже подходит для оформления страницы, например, он также используется на Habr для написания статей, а в новом редакторе еще и в автоматизированном формате. Синтаксис написания у этого языка разметки очень простой, а по сравнению с HTML более компактный и читабельный (хотя, тут дело привычки).

⏱Читать статью

👑 Кто работает QA — тот в цирке не смеется 🤡 Наша сегодняшняя рекомендация — канал с QA юмором. Мы работаем в тестировании и уже не смеемся. Но если вас можно рассмешить — welcome в QA Юмор

Использование CSS анимации, основанной на прокрутке, для индикации прогресса прокрутки на основе секций #почитать

Индикатор прогресса прокрутки — довольно простая вещь, которую можно создать с помощью анимации, основанной на прокрутке в scroll()-стиле. Но мы создадим индикаторы для каждого раздела страницы, используя view()-стиль.

⏱Читать статью

🐛QA Automation | IT — полезные материалы по автоматизированному тестированию. Гайды, авторские статьи и обучающие видео. Подписаться

Как меня чуть не уволили за выбор React #почитать Грустная история о том, как неправильный выбор библиотеки привел к большим проблемам. ⏱Читать статью

Как я написал загрузчик YouTube видео на Ktor + HTMX #почитать Инструмент, который возвращает сайтостроение назад к истокам. ⏱Читать статью

Смежный селектор + #почитать

Смежный селектор в CSS, обозначаемый знаком плюс (+), позволяет выбирать элемент, который является непосредственным соседом другого элемента на одном и том же уровне иерархии DOM. Этот селектор эффективен для применения стилей к элементу, находящемуся в точном последовательном порядке после другого элемента в коде HTML.

⏱Читать статью

CSS медиа-запросы (media queries) #почитать ▪️Что такое медиа-запросы ▪️Синтаксис ▪️Типы устройств ▪️Логические операторы ▪️Медиа-характеристики ▪️Медиа-запросы в <link> и @import ▪️Дополнения из Media Queries Level 4 ▪️Код JavaScript, учитывающий параметры устройств ⏱Читать статью

position: sticky #почитать Элемент с position: sticky «прилипает» к экрану при прокрутке, пока не встретится с границей родительского блока. ⏱Читать статью

Необычные украшения изображений - с одним элементом #почитать

Как следует из названия, мы собираемся украшать изображения! На эту тему уже написано множество статей, но то, что будет рассмотрено здесь, немного отличается, потому что это скорее вызов. Вызов? Да, задача украсить изображение, используя только тег <img> и ничего больше. Все верно. Никакой дополнительной разметки, никаких дополнительных элеменов div и никаких псевдоэлементов. Только один тег.

⏱Читать статью

Друзья, сегодня рекомендуем отличный канал с материалами по бизнес- и системному анализу! 😇 аналитик от бога — лучший канал для аналитиков от создателей сайта systemanalysis.ru Что отличает нас от других каналов по системному анализу: ▪️мы — создатели systemanalysis.ru и канала Тестировщик от бога — одного из самых крупных телеграм-каналов по тестированию; ▪️мы пишем свои материалы: составили дорожную карту развития бизнес- и системных аналитиков, в которой собрали все, что надо знать для успешной работы; ▪️мы не постим ленту из хабра — все материалы, которые мы пишем или отбираем, мега-полезные. Перейдите в канал и убедитесь в этом сами. ▪️и многое-многое другое Подписывайся на аналитика от бога и узнай уже наконец разницу между product roadmap-ом и спецификацией требований 😇

Как сделать таймер на CSS #почитать

Давайте рассмотрим использование CSS в качестве альтернативы JavaScript для создания простых таймеров. Используем современные свойства CSS, такие, как @property, @keyframes, и псевдоэлементы со значениями counter().

⏱Читать статью