AnimeJS Staggered Grid Effect

Эффект при клике по элементу сетки, выполненный с помощью CSS и библиотеки Anime.js

https://codepen.io/Hyperplexed/pen/zYWvXMM

Подпишись👉 @codepen_1

Tabbar с анимацией при наведении, выполненный с помощью SCSS, без использования JavaScript

https://codepen.io/sashatran/pen/abqXVvy

Подпишись👉 @codepen_1

PhotoSwipe — Библиотека для добавления галереи изображений

Позволяет просматривать изображения на сайте в удобном формате.

Особенности:
Не зависит от сторонних библиотек
Поддержка динамического импорта
Улучшеная производительность анимаций
Работает на тач-устройствах

https://github.com/dimsemenov/Photoswipe

Подпишись👉 @codepen_1

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

https://codepen.io/kevinpowell/pen/ZErxmXO

Подпишись👉 @codepen_1

Электронные часы, выполненные с помощью SCSS и библиотеки React.js

https://codepen.io/Hyperplexed/pen/XWeaWGL

Подпишись👉 @codepen_1

🚀 С 25 по 29 августа пройдёт Podlodka React Crew #3 — сезон о паттернах и практиках фронтенда.

В программе:

💡 Паттерны и подводные камни View Transition API в React (Николай Шабалин, СберЗдоровье)

🧠 Глубокое погружение в архитектуру React Hooks (Максим Никитин, Rocket Science)

⚙️ Разбор FSD 2.1 на практике, без догм (Лев Челядинов, FSD Core team)

📚Подготовка к архитектурному интервью для фронтендеров (Игорь Антонов, Т-Банк)

📐Layout-паттерны за пределами Flexbox и CSS Grid (Саша Илатовский, Albato)

🎯 Все темы прикладные, с практикой и кейсами.

🔗 Подробности и билеты

P.S: Для подписчиков группы CodePen Community
скидка 500 р по промокоду react_crew_3_VvUtZc

Раскрывающиеся карточки

https://codepen.io/Jhonierpc/details/MWgBJpy

Подпишись👉 @codepen_1

Форма MasterCard

https://codepen.io/JavaScriptJunkie/pen/YzzNGeR

Подпишись👉 @codepen_1

Градиентные узоры, реализованные с помощью SCSS, без использования JavaScript и SVG

https://codepen.io/thebabydino/pen/NWxBzRv

Подпишись👉 @codepen_1

CSS 404 page

https://codepen.io/agathaco/pen/WKXREy

Подпишись👉 @codepen_1

Натюрморт на чистом CSS

Эта картинка от Бена Эванса — прекрасный пример того, на что способен CSS.

https://codepen.io/ivorjetski/pen/xMJoYO

Подпишись👉 @codepen_1

Раскрасьте этот диван!

Кайл Веттон создал интерактивный Pen, в котором вы можете раскрасить диван и фон. Может использоваться на e-commerce сайтах по продаже мебели.

https://codepen.io/kylewetton/pen/OJLmJoV

Подпишись👉 @codepen_1

Button — анимация появления разноцветных фигур при клике на кнопку, реализованная с помощью JavaScript.

https://codepen.io/Anna_Batura/pen/RwKgmLw

Подпишись👉 @codepen_1

💻Angular — один из самых строгих и системных инструментов разработки пользовательских интерфейсов. Его выбирают крупные компании, где важны масштабируемость, предсказуемость кода и возможность развивать продукт долгие годы. Мы расскажем вам как работать с этим инструментом. Записывайтесь на открытые уроки в преддверии старта курса «Angular-разработчик»:

📆26 марта в 20:00 МСК на открытом уроке разберём, как LLM ускоряют фронтенд-разработку. Покажем их развитие, подготовим Angular-проект к работе с ИИ, создадим приложение и обсудим, где ИИ реально помогает разработчику.

📆9 апреля в 20:00 МСК на открытом уроке разберём сигналы в Angular: создадим реактивную форму с валидацией, обсудим управление состоянием и сравним с подходом на RxJS.

📆21 апреля в 20:00 МСК разберём архитектуру Angular-приложения: слои, feature-подход, разделение UI, логики и API, а также паттерны и структуру реального проекта.

Подробности об уроках и регистрация: https://vk.cc/cVBl0E

Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru