Обложка канала

Frontend Головного Мозга. Страница 42

Настоящий клондайк для frontend-разработчиков.

  • Frontend Головного Мозга

    Генератор толпы, выполненный с помощью CSS и библиотеки GSAP.js #codepen #css #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Frontend Головного Мозга

    Релиз Firefox 95: Функция Crypto.randomUUID(), режим картинка в картинке и многое другое 7 декабря 2021 г. была представлена новая версия — Firefox 95 👇Вот её особенности👇 ✔️Для всех поддерживаемых платформ реализован дополнительный уровень изоляции, основанный на технологии RLBox. ✔️В контекстное меню режима "картинка в картинке" добавлена опция для перемещения кнопки переключения режима просмотра в противоположную сторону на видео. ✔️Для платформ Windows 10 и Windows 11 предоставлена возможность установки Firefox из каталога Microsoft Store. ✔️Добавлена функция Crypto.randomUUID(), возвращающая криптографически надёжный 36-символьный UUID. ✔️Устранено 18 уязвимостей, из которых 11 помечены как опасные. 8 уязвимостей вызваны проблемами работы с памятью, такими как переполнения буферов и обращение к уже освобождённым областям памяти. Оф.Сайт: www.mozilla.org/en-US/f…asenotes #инструменты 👉 @frontend_mind
  • Frontend Головного Мозга

    Анимация загрузки, выполненная с помощью SVG, CSS и JavaScript #codepen #css #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Реклама

  • Frontend Головного Мозга

    Bit — облачный хаб компонентов Предоставляет набор готовых компонентов для популярных фреймворков JavaScript, а также позволяет совместно работать над компонентами. Особенности: 👉 Открытый исходный код 👉 Предварительный просмотр компонентов 👉 Автоматические метки компонентов 👉 Встроенная система поиска компонентов Сайт: https://bit.dev/ Гит: https://github.com/teambit/bit #полезно #инструменты 👉 @frontend_mind
  • Frontend Головного Мозга

    Переливающийся текст, выполненный на чистом CSS без использования JavaScript #codepen #css #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Frontend Головного Мозга

    Решение задачи "Война алфавита" #codewars #легко #js #ответы #22kata 👉 @frontend_mind
  • Frontend Головного Мозга

    Война алфавита Есть две группы враждующих букв — левые и правые. Вам необходимо написать функцию, которая принимает строку fight, состоящую только из маленьких букв, и возвращает, кто выиграл бой. Выигрывает бой та сторона, мощность которой оказалась больше. Если побеждает левая сторона, функция должна вернуть "Left side wins!", а если побеждает правая сторона, функция должна вернуть "Right side wins!", в противном случае функция вернёт "Let's fight again!". Левая сторона букв и их мощность: w - 4 p - 3 b - 2 s - 1 Правая сторона букв и их мощность: m - 4 q - 3 d - 2 z - 1 Остальные буквы не имеют силы и являются жертвами. Пример:
    alphabetWar("z") - вернёт "Right side wins!"
    
    alphabetWar("zdqmwpbs") - вернёт "Let's fight again!"
    
    alphabetWar("zzzzs") - вернёт "Right side wins!"
    
    alphabetWar("wwwwww") - вернёт "Left side wins!"
    
    
    ===Решать задачу на Codewars=== 📌 Пишите ваше решение в комментариях. Решение будет через несколько часов на этом канале. 👇 #codewars #легко #js #22kata
  • Frontend Головного Мозга

    Переход между страницами, сделанный с помощью Slim, SCSS и JavaScript #codepen #scss #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Frontend Головного Мозга

    Curtains.js — библиотека для анимации изображений и видео Преобразует элементы HTML DOM в интерактивные текстурированные плоскости 3D WebGL. Особенности / преимущества: ✔️Не имеет зависимостей ✔️Определение размера и положения плоскостей с помощью CSS ✔️Полностью написана на JavaScript ✔️Подробная документация ✔️Имеет пакет для React Сайт: https://www.curtainsjs.com/ Гит: https://github.com/martinlaxenaire/curtainsjs #библиотеки #полезно #js 👉 @frontend_mind
  • Frontend Головного Мозга

    Бесплатный вебинар Frontend- разработка. Создаем вишлист для деда мороза и друзей🎅🏼🎁 В Skypro уже полный джингл бэлс поэтому они решили сделать вам подарок и провести бесплатный вебинар, чтобы все желающие могли “прощупать” профессию frontend-разработчика. Почему Вам понравится? ✅Вы узнаете. подходит ли Вам это направление ✅Решите практические задания вместе с экспертом ✅Добавите работу в свое портфолио Когда? 🗓14 декабря ⏰16:00 по Москве 💥Длительность 1,5 часа Регистрация на БЕСПЛАТНЫЙ вебинар по ссылке go.skyeng.ru/fronten…_webinar
  • Frontend Головного Мозга

    Эффекты при наведении на кнопки, выполненные с помощью чистого CSS без использования JavaScript #codepen #css #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Frontend Головного Мозга

    CodeCov — code coverage сервис Предоставляет отчеты по покрытию вашего кода тестами. Особенности: 👉 Поддержка более 20 языков программирования (JavaScript, Python, PHP, Java, Kotlin и т.д) 👉 Интеграция с GitHub, GitLab, Bitbucket 👉 Объединение отчетов 👉 Уведомления для Slack или Gitte 👉 Имеет расширение для браузера Сайт: https://about.codecov.io/ GitHub: https://github.com/codecov #полезно #инструменты 👉 @frontend_mind
  • Frontend Головного Мозга

    3 причины подписаться на аккаунт @selectel🔥 1. Основы программирования простым языком и без снобизма. 2. Полезные факты о железе, дата-центрах и хостингах. 3. Актуальные новости из IT. Подписывайся, чтобы получать больше IT-материалов и каждый день узнавать что-то новое!
  • Frontend Головного Мозга

    Анимированный баннер Cookie, выполненный с помощью SCSS и библиотеки GSAP.js #codepen #scss #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Frontend Головного Мозга

    ✨Топ инструментов для кроссбраузерного тестирования, Часть 2: 👉 BrowserStack — Онлайн-утилита, позволяющая проверять веб-сайт в различных браузерах. Содержит список сотен браузеров, мобильных устройств и стратегий тестирования. Используется некоторыми крупными проектами, такими как jQuery и React.js. Подробный обзор тут. 👉 Puppeteer — Модуль Node.js для взаимодействия с браузерами Chrome и Firefox. Позволяет использовать API для создания скриншота, автоматизации взаимодействия с пользователями, а также общего автоматического тестирования сайта. 👉 Ranorex Studio — Инструмент для процессов тестирования веб-приложений и кроссбраузерного ПО. Предоставляет возможности автоматического тестирования большого спектра современных веб-технологий и их вспомогательных функций. 👉 Testcomplete — Имеет обширные возможности автоматизации процесса тестирования веб-приложений в системах разнообразных браузеров и ОС. Предоставляет возможность проверки в режиме реального времени на настоящих устройствах. 👉 Comparium — Веб-приложение для быстрых и надежных тестов. Имеет доступ к широкому спектру браузеров, версий браузеров и платформ. Позволяет создавать полностраничные скриншоты. 👉 Playwright — Инструмент разработанный для автоматического тестирования браузера с помощью API. Также может перехватывать сетевые запросы, эмулировать мобильные устройства, географическое местоположение и разрешения. 👉 SauceLabs — Кросс-браузерный инструмент автоматизации, созданный на основе веб-драйвера Selenium. Позволяет автоматически тестировать страницы в браузерах с помощью тестовых сценариев. А какими сервисами пользуетесь вы? Напишите в комментариях👇 #полезно #подборки_инструментов 👉 @frontend_mind
  • Реклама

  • Frontend Головного Мозга

    Интерактивный глаз, выполненный с помощью CSS и библиотеки Three.js #codepen #css #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Frontend Головного Мозга

    Scroll Reveal.js — библиотека для создания анимации при прокрутке Позволяет анимировать элементы при входе и выходе из окна просмотра. Особенности / преимущества: ✔️Небольшой вес (16kB) ✔️Поддержка мобильных устройств ✔️Возможность тонкой настройки анимации ✔️Поддержка Chrome, Firefox, Safari и Edge ✔️Удобный API Сайт: https://scrollrevealjs.org/ Гит: https://github.com/jlmakes/scrollreveal #библиотеки #полезно #js 👉 @frontend_mind
  • Frontend Головного Мозга

    Эффект наклонённых карточек, выполненный с помощью Stylus без использования JavaScript #codepen #scss #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇