Логово верстальщика

👩‍💻 Exes and Ohs Проверьте, содержит ли строка одинаковое количество "x" и "o". Метод должен возвращать логическое значение и быть нечувствительным к регистру. Строка может содержать любой символ. Пример кода:

XO("ooxx") => true
XO("xooxx") => false
XO("ooxXm") => true
XO("zpzpzpp") => true // when no 'x' and 'o' is present should return true
XO("zzoo") => false

Решение задачи🔽

function XO(str) { // Преобразуем строку в нижний регистр str = str.toLowerCase(); // Подсчитываем количество 'x' и 'o' let xCount = 0; let oCount = 0; for (let char of str) { if (char === 'x') xCount++; if (char === 'o') oCount++; } // Сравниваем количество 'x' и 'o' return xCount === oCount; } // Примеры использования console.log(XO("ooxx")); // true console.log(XO("xooxx")); // false console.log(XO("ooxXm")); // true console.log(XO("zpzpzpp")); // true console.log(XO("zzoo")); // false

➡️ Tailwind CSS: как разработать продвинутую пользовательскую анимацию Анимация с Tailwind CSS обеспечивает отличный пользовательский опыт. Ознакомьтесь с примерами, демонстрирующими различные эффекты анимации, такие как вращение, подпрыгивание, пульсация, переворачивание и покачивание. Читать...

👩‍💻 Refs в React: от доступа к DOM до императивного API React достаточно удобный инструмент для создания веб-приложений. Еще больше его возможности расширяют рефы (Ref или Reference), действующие как ссылки на элементы кода React и упрощающие решение нестандартных задач. Читать...

🔝 Самые интересные статьи за последние дни: • DRY-фреймворк: как сократить HTML-код и писать только на CSS • Ультимативный ресурс по программированию: сборник бесплатных чит-листов по программированию • Atomic CSS Deep Dive • Создание кастомного интерактивного одностраничного минисайта с ИИ без платных сервисов • Polling vs Websockets (с примерами на React хуках)

64 бита на хранение числа в JavaScript разбивают на три промежутка: 1B для хранения знака,11 бит для экспоненты со смещением. А знаете, для чего предназначены ещё 52 бита? Об этом и в целом о работе с данными в JavaScript — новая серия открытого курса AvitoTech. 5 лекций уже доступны к просмотру. Так что если вы хотели освоить азы фронтенд-разработки, самое время учиться у лучших. Тем более, это бесплатно.

👩‍💻 5 маленьких, но полезных библиотек React Несколько библиотек React, которые мы рассмотрели в этой статье, довольно полезные и при том маленькие и простые в использовании. Читать...

👾 10 игр для изучения JavaScript В этой статье вы найдете десятку интересных игр для изучения JavaScript. Попробуйте их, ведь учиться, играя, куда легче! Читать...

🖥 В чем разница между UI и UX. Детальное сравнение Один из самых обсуждаемых вопросов в дизайнерской среде, как понять разницу между дизайном пользовательского интерфейса и дизайном взаимодействия с пользователем. Попробуем на него ответить, сравнив эти два вида дизайна более детально. Читать...

👩‍💻 Fancy wipe Стильный текст с анимированным появлением. Сделан на чистом CSS. Открыть код...

👩‍💻 Обзор 10 приемов JavaScript для эффективного программирования Пополни знания JavaScript 10 эффективными приемами и начни использовать его возможности по максимуму. Читать...

❓ Почему стоит задуматься о разработке статических сайтов Каждый создатель сайта стремится сократить время загрузки веб-страниц, повысить показатель конверсии, вовремя отловить ошибки рендеринга, избежать проблем, связанных с обслуживанием сайтов. Если все перечисленное - ваша головная боль, стоит задуматься о разработке статических сайтов. Читать...

🔝 Самые интересные статьи за последние дни: • React: одна любопытная особенность порталов • Формат описания идентификатора зависимости в JS DI • Думаете, вы всё знаете о box shadows? • PHP функции и способы их применения • Все, что вы хотели знать про иерархию инжекторов в Angular

👩‍💻 Two to One Возьмите 2 строки s1 и s2, включающие только буквы от a до z. Верните новую отсортированную строку, максимально длинную, содержащую различные буквы - каждая из которых берется только один раз - исходящие из s1 или s2. Пример кода:

a = "xyaabbbccccdefww"
b = "xxxxyyyyabklmopq"
longest(a, b) -> "abcdefklmopqwxy"

a = "abcdefghijklmnopqrstuvwxyz"
longest(a, a) -> "abcdefghijklmnopqrstuvwxyz"

Решение задачи🔽

function longest(s1, s2) { // Объединяем строки let combined = s1 + s2; // Преобразуем строку в массив, используя Set для удаления дубликатов let uniqueChars = [...new Set(combined)]; // Сортируем массив uniqueChars.sort(); // Преобразуем обратно в строку и возвращаем результат return uniqueChars.join(''); } // Примеры использования let a = "xyaabbbccccdefww"; let b = "xxxxyyyyabklmopq"; console.log(longest(a, b)); // "abcdefklmopqwxy" a = "abcdefghijklmnopqrstuvwxyz"; console.log(longest(a, a)); // "abcdefghijklmnopqrstuvwxyz"

🖥 Как эффективно оптимизировать большой объем данных во фронтенде Оптимизация производительности является ключевым аспектом разработки веб-приложений, особенно когда речь идет о работе с большими объемами данных. Именно такая задача была поставлена перед фронтенд-разработчиками IT Test. Рассказываем, как оптимизировать код и найти баланс между производительностью и читаемостью. Читать...

💡 SEO для разработчиков: что нужно знать программистам в 2024 году Технические основы СЕО для программистов: что нужно знать о мета-тегах, микроразметке, UX/UI, карте сайта, коде 404, подзаголовках. Читать...

👩‍💻 Топ библиотеки React 2024 года В этом руководстве представлены самые популярные библиотеки React 2024 года. Они помогают настраивать и оформлять приложения, управлять состоянием, получать данные, выполнять маршрутизацию и аутентификацию. С их помощью вы сможете создавать полноценные мобильные и веб-приложения. Читать...

👩‍💻 Card Mouse Hover Effect Карточки с интересным эффектом при наведении. Сделаны на CSS и JavaScript. Открыть код...

👩‍💻 Учебное пособие по Giphy API: как сгенерировать анимированный текст в формате GIF с помощью ReactJS В этом руководстве вы создадите приложение, которое генерирует динамический анимированный текст с помощью API Giphy с ReactJS. Читать...

👩‍💻 Твой JavaScript должен быть проще: 10 приемов современного разработчика Советы по написанию короткого, лаконичного и чистого кода на JavaScript Читать...

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