Code Ready | Frontend

👩‍💻 Вопрос с собеседования В чём разница между drop-shadow и box-shadow в CSS? Ответ: drop-shadow и box-shadow — это два разных CSS-свойства для создания теней, но они применяются в разных случаях и имеют разные особенности. • box-shadow — добавляет тень к рамке элемента, то есть вокруг его границ. Это свойство работает с любыми элементами, создавая тень, повторяющую контуры элемента. • drop-shadow — применяется с функцией filter и позволяет создавать более сложные тени для графики и текстов. Оно учитывает прозрачность и форму содержимого элемента, что особенно полезно для изображений и SVG. ➡️ @code_ready | #собеседование #css

📱 Улучшение визуализации цветов в CSS Color Highlight — это расширение для VS Code, которое автоматически окрашивает цветовые значения в CSS-файлах и обрамляет их рамкой, позволяя лучше понимать, какой цвет будет использоваться в итоге. ➡️ @code_ready | #плагин

Начните обучение в магистратуре в Центральном университете уже на 3-м курсе бакалавриата! Центральный университет — современный вуз, созданный при поддержке ведущих компаний России: Т-Банка, Авито и других. Учебу реально совместить с последними курсами бакалавриата или действующей работой. Обучение занимает 20 часов в неделю в вечернее время в первый год, а занятия проводят в центре Москвы профессоры из МГУ, МФТИ, РЭШ и практики из индустрии. Обучение в университете построено по принципам ИТ-компаний, со средой, способствующей росту и развитию. У каждого студента будет: • личный ментор по траектории обучения; • доступ к карьерному центру с коучами консультантами; • опыт работы в проектах 30+ компаний-партнеров уже во время обучения; • диплом гособразца. Участвуйте в онлайн-отборе, чтобы выиграть грант на обучение до 1,2 млн рублей. Больше подробностей про университет и конкурс грантов по ссылке! erid: 2VtzqvfbuGo Реклама, АНО ВО «Центральный университет», ИНН 774341802

👩‍💻 Свойство shape-outside Свойство shape-outside задает форму, по которой текст обтекает элемент. Это позволяет создавать уникальные текстовые обтекания, основанные на различных формах, таких как круги, эллипсы или многоугольники. Параметры свойства: • circle (radius at position) — круг с заданным радиусом и позицией. • ellipse (radius-x radius-y at position) — эллипс с заданными радиусами и позицией. • polygon (point1, point2 ...) — многоугольник, где каждая точка указывается координатами.

float: left — Для правильного применения обтекания текста с помощью shape-outside, элемент должен быть плавающим.

➡️ @code_ready | #свойство #css

В России можно посещать IT-мероприятия хоть каждый день: как оффлайн, так и онлайн Жаль только, что нет никакой единой "базы" ивентов. Чтобы заглянул -> увидел все что есть -> выбрал -> пошел. Или все-таки есть? 🔥 Смотрите: мы нашли канал, в котором публикуют ВООБЩЕ ВСЕ анонсы вебинаров, хакатонов, конференций, мастер-классов, ивентов от гигантов индустрии и лучших специалистов по кодингу, дизайну, аналитике и т.д. В общем, очень кайфовая вещь: здесь вы точно не пропустите ничего важного и интересного. Подпишитесь, чтобы не потерять: IT-мероприятия России / ITMeeting / IT events

👨‍💻 Эффект всплывающей подписи при наведении Эффект наведения на карточки с появлением подписи к изображению. Реализовано с помощью CSS. ⛓ Готовый код: Ссылочка ➡️ @code_ready | #кодпен

📱 Удаление HTML-тегов из строки Удаление HTML-тегов полезно для предотвращения XSS (межсайтовых скриптовых атак), что повышает безопасность сайта и защищает данные пользователей. Для извлечения текста без тегов из строки можно использовать объект DOMParser, который позволяет разобрать HTML-код и получить только текстовое содержимое. Рассмотрим ключевые строки кода, выполняющие эту задачу:

• new DOMParser().parseFromString(html, 'text/html') — Создает новый объект DOMParser и разбирает переданную строку HTML, создавая документ в формате HTML. • .body.textContent || '' — Извлекает текстовое содержимое из тела HTML-документа. Если тело пустое, возвращает пустую строку.

➡️ @code_ready | #гайд #javascript

Промпт-инженеринг — новый хайп или перспективная профессия? Рассказываем про направление с большим потенциалом и маленькой конкуренцией на рынке на нашей бесплатной лекции. По итогам эфира вы узнаете: — Кто такой промт-инженер и чем он занимается; — Как интегрировать скиллы промт-инжинеринга в работу, если вы работаете в IT; — Кому в действительности нужны его услуги и какие результаты это даст; — Сколько платят промт-инженеру в России и мире; — Кто может стать промт-инженером и какой порог входа; Кликай на ссылку и забирай подробную информацию вместе с классными бонусами. erid: LjN8KDjkL ООО Зерокодер, ИНН 9715401631

👩‍💻 Вопрос с собеседования В чём разница между «сбросом» и «нормализацией» CSS? Ответ: Сброс и нормализация CSS — это два разных подхода к обнулению стилей веб-страницы. • Сброс CSS — это процесс обнуления стилей, чтобы убрать браузерные стили по умолчанию, которые могут отличаться от одного браузера к другому. Цель сброса CSS — создать «чистую» страницу, на которой все элементы имеют одинаковый вид в разных браузерах. • Нормализация CSS — это процесс создания единообразных стилей для разных элементов, чтобы веб-страница выглядела одинаково во всех браузерах. В отличие от сброса CSS, нормализация CSS сохраняет некоторые стили по умолчанию браузера, но при этом пытается сделать их единообразными. ➡️ @code_ready | #собеседование

👩‍💻 Как работает Array.filter() в JS? Функция Array.filter создает новый массив, включающий все элементы исходного массива, которые соответствуют заданному условию. Она принимает один обязательный аргумент — функцию обратного вызова (callback), которая будет применена к каждому элементу исходного массива. Callback может принимать до трёх аргументов: • currentValue — текущий элемент массива. • index — индекс текущего элемента. • array — сам массив. Для каждого элемента массива функция обратного вызова возвращает либо true, либо false. Если true, элемент включается в новый массив.

В примере на картинке, num % 2 === 0 проверяет, является ли элемент четным. Только четные числа (2 и 4) попадают в новый массив evenNumbers.

➡️ @code_ready | #функция #js

📱 Fullstack Coding — коротко и ёмко про web разработку! Ежедневно контент пополняется новой информацией: • Объяснения и советы по frontend и backend технологиям, таким как html, CSS, Python, JavaScript 👩‍💻 👩‍💻 👩‍💻 • Ответы на часто задаваемые вопросы ❓ • Обсуждение на интересующие темы в отдельном чате 🙊 ➡️Так что подписываемся

📱 Повышаем читаемость HTML-кода Rainbow Tags — это удобное расширение для VS Code, которое улучшает читаемость вашего HTML-кода, раскрашивая теги в разные цвета. С помощью него вы сможете легко различать вложенные элементы и быстрее находить ошибки в разметке, что делает процесс разработки более приятным и эффективным.

Если расширение не работает, проверьте нет ли конфликтов с другими плагинами или поставьте более раннюю версию.

➡️ @code_ready | #плагин

CodeCombat — это онлайн-игра, где вы учитесь программированию, управляя персонажами с помощью написанного кода. Поддерживаются Python, JavaScript и Lua. Отличный способ освоить программирование через игру и задачи. ⛓ Ссылочка https://codecombat.com/ ➡️ @code_ready | #ресурсы

Ребятки, прям очень давно не было шпаргалок, хотите вернуть эту рубрику? 👍🔥 — если да 👩‍💻 Сейчас напомню про шпаргалку методов массива Она содержит основные методы JavaScript для работы с массивами. Они разделены на группы, каждый метод сопровождается кратким описанием его функциональности и примером использования. ➡️ @code_ready | #шпаргалка

📱 Тестирование API прямо в VS Code Thunder Client — это мощное расширение для VS Code, которое позволяет тестировать и отлаживать API запросы прямо в привычной среде разработки, без необходимости переключаться на отдельные приложения. ➡️ @code_ready | #плагин

👩‍💻 Вопрос с собеседования В чем отличие между Observable и Promise в JavaScript? Ответ: Observable и Promise — это два способа для работы с асинхронными операциями в JS. • Promise может завершиться успешно, либо с ошибкой, но выполняется лишь один раз. • Observable же представляет собой поток данных, которые могут быть доступны в любое время, он может генерировать несколько значений во время своей работы и быть остановлен в любое время.

Соответственно, промисы больше подходят для однократных операций, таких как загрузка файла, observable отлично справляется с потоками данных, таких как обновление данных в реальном времени.

➡️ @code_ready | #собеседование

😋 Ребятки, новая новость) Достаточно недавно, у меня появился новый канал @roadmap_ready. Там реально много полезных ресурсов для всех разработчиков, + каждый день выходят 3 новых поста ⛓ Курсы, книги, шпаргалки, статьи, видео, ресурсы, всё есть в новом канале 👇 Советую подписаться — https://t.me/+Q70FN159FnZmZGNi

👩‍💻 Сохраняйте очередную полезную статью на Habr!, которую мне удалось для вас добыть) Вкратце содержит: • Инструменты для тестирования, всё для проверки работоспособности и безопасности сайтов • Расширения для браузеров • Ресурсы для практики • Ссылки на полезные источники ➡️ @code_ready | #статья