#19 CSS для начинающих | Анимации @keyframes

Описание

? Привет! Меня зовут Александр Ламков, я фронтенд-инженер из компании VK. На этом образовательном канале делюсь знаниями по фронтенд-разработке со всеми желающими.

✏️ В этом уроке говорим про анимации - директива keyframes и свойство animation.

? Timeline:
▶ 00:00 | План урока
▶ 00:13 | Директива @keyframes
▶ 01:24 | Свойство animate
▶ 01:56 | Подсвойства animation
▶ 02:29 | Имя анимации, свойство animation-name
▶ 02:37 | Длительность анимации, свойство animation-duration
▶ 02:48 | Задержка перед выполнением анимации, свойство animation-delay
▶ 03:17 | Количество выполнения анимации, свойство animation-iteration-count
▶ 03:43 | Функция скорости анимации, свойство animation-timing-function
▶ 04:02 | Направление анимации, свойство animation-direction
▶ 04:50 | Пауза анимации, свойство animation-play-state
▶ 05:12 | Что дальше

? Полезные ссылки:
➖ Современный справочник по CSS: https://doka.guide/css/
➖ Справочник по фронтенду "MDN" от разработчиков Mozilla Firefox: https://developer.mozilla.org/ru/

?️ Бесплатные курсы на канале:
? Курс по HTML: https://youtube.com/playlist?list=PL0MUAHwery4ot0KmgGxlBSB7rXssLeA6h
? Курс по CSS: https://youtube.com/playlist?list=PL0MUAHwery4o9I7QQVj_RP4ZVpmdx6evz

?? Мне действительно есть, что вам рассказать, ибо сам я прошел этот путь относительно недавно. На данный момент имею чуть более трех лет коммерческого опыта, самоучка. За все время деятельности прошел путь от trainee в безызвестной «галере» со штатом в 15 человек, где верстал простенькие лендинги и интернет-магазины, до фронтенд-инженера в крупнейшей РФ компании, где занимаюсь вопросами архитектуры фронтенд-структур внутренних проектов и их оптимизацией. Между этими занятостями также был опыт работы на фрилансе, в стартапе (3-10 чел.) и в средней компании (50-100 чел.). Имею опыт в проведении оффлайн-митапов, лекций, преподавании и наставничестве.

? Автор:
➖ Личный сайт: https://aleksanderlamkov.ru/
➖ Telegram: https://t.me/friendlyFrontend
➖ Boosty: https://boosty.to/friendly-frontend
➖ GetMentor: https://getmentor.dev/mentor/aleksandr-lamkov-1480
➖ Solvery: https://solvery.io/mentor/aleksanderlamkov

#frontend #фронтенд #css