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

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

12111 @frontend_mind
Открыть

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

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

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

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

    Cesium — Библиотека для работы в 3D Позволяет создавать трёхмерные глобусов и двумерных карт в веб-браузере без каких-либо плагинов. Особенности / преимущества: ✔️Использует WebGL для аппаратно-ускоряемой графики ✔️Кроссплатформенность ✔️Открытый исходный код ✔️Поддержка множества браузеров Сайт: https://cesium.com/platform/cesiumjs/ GitHub: https://github.com/CesiumGS #библиотеки #полезно #js 👉 @frontend_mind

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

    IT образование в 2022 стало бесплатным! Все лекции и гайды топовых вузов страны тут https://t.me/vse_ob_it

  • Реклама

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

    Карточки с эффектом перетаскивания, выполненные с помощью CSS и библиотеки Sortable.js #codepen #css #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇

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

    Render — Унифицированное облако для создания и запуска приложений и веб-сайтов Позволяет запускать приложения и веб-сайты с бесплатными SSL сертификатами, глобальным CDN и защитой от DDoS-атак, Особенности: 👉 Подробная документация 👉 Автоматическое развертывание из Git 👉 Поддержка JavaScript, Python, Rust, PHP, Ruby и т.д 👉 Поддержка множества фреймворков Сайт: https://render.com/ GitHub: https://github.com/renderinc #полезно #инструменты 👉 @frontend_mind

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

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

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

    ✨Топ игр для практики и изучения CSS 👉 Flexbox Froggy — Позволяет в забавной форме на практике изучать CSS Flexbox. Она охватывает множество свойств Flexbox на 24 уровнях. 👉 Grid Garden — Помогает в увлекательной игровой форме на практике изучать понятия CSS grid. Охватывает множество свойств CSS Grid на 28 уровнях сложности. Полезна в тех случаях, когда есть пробелы в познаниях о CSS Grid. 👉 CSS Diner — Создана Люком Пачольски, в ней есть все сведения о различных селекторах CSS. Изучить и освоить их вы сможете, пройдя через 32 игровых уровня. 👉 CSS Surgeon — Научит в увлекательной форме масштабировать, вращать и перемещать элементы с помощью CSS-преобразований. Также познакомит с основами использования свойств CSS transform для изменения элементов на веб-странице. 👉 Flexbox Defense — Знакомит со свойствами CSS Flexbox и включает 12 уровней сложности. 👉 Grid Critters — Игра для освоения освоения CSS Grid. Ваша миссия — использовать мощный инструментарий вашего корабля (Grid) для спасения инопланетных животных от вымирания. 👉 CSS Battle — В этой игре необходимо повторить заданный макет при помощи как можно меньшего количества кода. Можно соревноваться с другими игроками. А какими сервисами пользуетесь вы? Напишите в комментариях👇 #полезно #подборки_инструментов 👉 @frontend_mind

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

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

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

    Glide.js — Адаптивный тач слайдер Позволяет добавлять адаптивные слайдеры в проект. Особенности / преимущества: ✔️Небольшой вес (8kB) ✔️Модульность ✔️Написана на чистом JavaScript ✔️Стилизация с помощью стилей SASS Сайт: https://glidejs.com/ Гит: https://github.com/glidejs/glide #библиотеки #полезно #js 👉 @frontend_mind

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

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

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

    Релиз Chrome 103: 21 июня 2022 г. была представлена новая версия — Chrome 103 👇Вот её особенности👇 ✔️Добавлен экспериментальный редактор изображений, вызываемый для редактирования скриншотов страниц. В редакторе доступны такие функции, как кадрирование, выделение области, рисование кистью и т.д. ✔️Добавлена поддержка кода HTTP-ответа 103, который позволяет информировать клиента о содержании некоторых HTTP-заголовков сразу после запроса, не дожидаясь пока сервер выполнит все связанные с запросом операции и начнёт отдачу контента. ✔️Файлы в формате изображений AVIF добавлены в список разрешённых для обмена через API iWeb Share. ✔️В CSS-свойство overflow-clip-margin добавлен атрибут visual-box, определяющий с какого места следует начинать обрезку контента, вышедшего за границу области. Оф.Сайт: chromereleases.googleblog.com/2022/06…_21.html #инструменты 👉 @frontend_mind

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

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

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

    Code Beautify — Сайт с инструментами, позволяющими улучшить ваш код Искусственный интеллект делает код более привлекательным и удобочитаемым. Особенности: 👉 Доступно расширение для Chrome 👉 Поиск по инструментам 👉 Предоставляет множество различных инструментов 👉 Поддержка множества языков программирования Сайт: https://codebeautify.org/ #полезно #инструменты 👉 @frontend_mind

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

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

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

    Решение задачи "+1 к строке" #codewars #легко #js #ответы #50kata 👉 @frontend_mind

  • Реклама

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

    +1 к строке В этом задании необходимо написать функцию, которая увеличивает строку на 1. Если строка уже заканчивается числом, число должно быть увеличено на 1. Если строка не заканчивается числом, то число 1 должно быть добавлено к новой строке. Пример: 
    incrementString("foobar000") - вернёт "foobar001"

incrementString("foo") - вернёт "foo1"

incrementString("foobar099") - вернёт "foobar100"

incrementString("") - вернёт "1"

incrementString("foobar99") - вернёт "foobar100"
    ===Решать задачу на Codewars=== 📌 Пишите ваше решение в комментариях. Решение будет через несколько часов на этом канале. 👇 #codewars #легко #js #50kata 👉 @frontend_mind

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

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

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

    Matter.js — Двумерный физический движок Помогает вам легко симулировать 2D физику в браузере. Особенности / преимущества: ✔️Совместимость с мобильными устройствами ✔️Кроссбраузерность и поддержка Node.js (Chrome, Firefox, Safari, IE8+) ✔️Поддержка векторов и текстур ✔️Замедление и ускорение времени Сайт: https://brm.io/matter-js/ Гит: https://github.com/liabru/matter-js #библиотеки #полезно #js 👉 @frontend_mind