Javascript js frontend

​Как улучшить код на TypeScript: 5 рекомендаций

Хотите писать код на TypeScript элегантно и профессионально? Тогда следуйте рекомендациям, основанным на лучших практиках!

#ru

Framer motion hamburger

Кнопка для бургер-меню, выполненная с помощью CSS и библиотеки React.js.

#css #js

​Видео в вебе, Browser Policy и палки в колёсах

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

Это негативно сказывалось на пользовательском опыте, и в какой-то момент разработчики браузеров решили, что хватит это терпеть.

В результате появилась Autoplay Policy.

Как понятно из названия, это политика автовоспроизведения видео в браузере. Инициатором её введения стал Chrome (с v.66), и на текущий момент эту политику поддержали все современные браузеры.

Итак, давайте поговорим, что это такое и какие палки и колёса мы можем встретить.

#ru

Если вам интересно разбор задач по Python - подписывайтесь на канал наших партнеров PythonTurbo.

В нем они разбирают задачки и дают решения на них.

Примеры:
1. "Преобразовать строку в целое число": https://t.me/bestpython/262
2. " Необходимо написать код, который будет превращать привычный rgb формат в hex." : https://t.me/bestpython/251

Подписывайтесь и решайте задачи: PythonTurbo

Learn JavaScript with p5.js: Coding for Visual Learners

Автор: Engin Arslan
Год издания: 2018

#javascript #english

Hover Effect

Эффект увеличения карточки и смещения соседних карточек при наведении, реализованный на чистом CSS.

#css

Руководство по медиа-запросам определения типа устройства ввода

В этой статье мы поговорим о том, как адаптировать наши сайты в зависимости от того, есть ли у устройства пользователя указатель и насколько он точен.

А чтобы адаптировать наш сайт к возможностям этих устройств, мы разберем, как правильно использовать специальные медиа-запросы hover, pointer, any-hover и any-pointer.

#css #ru

Menu hover glow

Анимированное меню, выполненное на чистом CSS.

#css

Simplifying JavaScript

Автор: Joe Morgan
Год издания: 2018

#javascript #english

Друзья, мы запустили новый канал Дизайн Гуру

Какой контент сейчас туда публикуем:

1. Наборы текстур, векторных шейпов, стикеры в PNG, шрифты
2. Плагины для Figma
3. Примеры крутого дизайна в любом виде
4. Бесплатные мокапы

Подпишитесь и напишите в комментарии под последним постом, что бы вы еще хотели видеть в нашем канале?

Ссылка: https://t.me/designgury

CSS Bear Toggle

Уникальный переключатель-медведь на HTML и SCSS.

#html #css

​Переключатель темного режима в веб-приложении

Разбираемся, как создать веб-приложение, реагирующее на выбор пользователем цветовой схемы в операционной системе.

#js #css #ru

Lotsa Notifications

Уведомления, выполненные с помощью SVG, CSS и JavaScript.

#css #js

50 Shades of Hue - CPC Monochromatic

Генератор монохромной цветовой палитры, который генерирует до 50 оттенков. Реализован с помощью React и Prism.js.

#css #react

Password Input Light

Поле ввода пароля с необычным просмотром пароля, реализованное с помощью CSS и JavaScript.

#css #js

JavaScript for impatient programmers

Автор: Dr. Axel Rauschmayer
Год издания: 2019

#javascript #english

Hexagon-tiles

Эффект мозаики на изображении, реализованный с помощью Three.js.

#js

CSS Blossoming Flowers at Magical Night

Анимированная сцена, выполненная с помощью SCSS и JavaScript.

#css #js

​Обработка событий CSS-переходов в JavaScript

Давайте разберем, какие события возникают в DOM при CSS-переходах и как их можно использовать в JavaScript. Рассмотрим несколько примеров на эту тему.

#js #css #ru

Color Palette

Палитра с оттенками цветов. Логика переключения между оттенками создана в JS.

#css #js