Полезная вЁрстка

rainy street lamp scene — объемная сцена с уличным фонарем под дождем. Реализована с помощью CSS и TypeScript. #анимация #css #js

Single Div Blob AI Loaders — анимации загрузки AI. Реализованы с помощью SCSS и JavaScript. #анимация #scss #js

Add to cart — Кнопки "Добавить в корзину" с эффектом небольшого затемнения при наведении. Реализованы с помощью SCSS, SVG и JavaScript. #анимация #scss #svg #js

Expanding Button — Анимированная кнопка с различными ссылками на медиа. Реализована с помощью SCSS, Pug и JavaScript. #анимация #scss #pug #js

Cute skeuomorphic checkboxes — стилизованный чекбокс с небольшими анимациями нажатия. Реализован с помощью SCSS. #анимация #scss

Сколько нужно времени, чтобы освоить востребованную профессию фронтенд-разработчика? Всего 10 месяцев! Вы можете совмещать обучение с любым своим занятием. Главное условие - желание. В Xeкслете вы можете пройти онлайн-курс по профессии «‎Фронтенд-разработчик». Во время программы вы: ✔️ Изучите JavaScript в связке с HTML и CSS. ✔️ Освоите React для создания сложных компонентов, которые легко поддерживать и использовать повторно. ✔️ Решите более 310 задач в браузере. ✔️ Создадите 4 проекта для портфолио на GitHubВыполните 150 тестовых заданий от наших партнёров. ✔️ Научитесь работать с чужим кодом и оформлять пул-реквесты в Open Source проектах. Обучение построено так, что его невозможно «отсидеть» или «прослушать». Мы не сторонники подхода «повтори за учителем»: вы будете не просто писать код, а научитесь самостоятельно находить лучшие решения. 📌 Пройдите первые 10 бесплатных уроков из профессии и получите дополнительно скидку 10% !

Skeuomorphic like button | SCSS nesting — анимированная кнопка лайка. Реализована с помощью SCSS и JavaScript. #анимация #scss #js

Card Hover Interaction — Карточки с всплывающей информацией при наведении. Реализованы с помощью CSS. #анимация #css

Хотим порекомендовать Вам канал Александра Шулепова. Он ведет телеграм-канал, куда выкладывает рабочие лайфкахи, короткие инструкции, которые пригодятся в работе и жизни. Например, как поднять конверсию на сайте, если вы не маркетолог, защитить сайт от взлома или как восстановить приложение на новых версиях iPhone и другие интересные темы. Подпишитесь, вам будет интересно читать записки разработчика без инфоцыганства и воды. Перейти на канал❤

ERROR — анимированное окно с ошибкой. Реализовано с помощью CSS, SVG и JavaScript. #анимация #css #svg

Animated Upload Modal — анимированная форма для отправки файла на сервер. Реализована с помощью CSS и JavaScript. #анимация #css #js

📝 Найдена пошаговая инструкция, как учиться веб-разработке бесплатно 1️⃣ Заходим в канал Бесплатные уроки по вебу, там выкладывают курсы от профессиональных авторов по разным темам: HTML, CSS, Javascript, Wordpress, React, PHP, Webflow, Figma и т.д. 2️⃣ Потом идём в самый крупный канал с реальными дизайн-макетами сайтов. Там берем шаблоны и тренируем навыки верстки и JS. 3️⃣ Чтобы найти анимации и крутые UX-UI решения, идем на Codepen.js и смотрим лучшие практики по вебу, пытаемся повторить и разобрать код. Профит.

Multi card Spotlight effect — карточки с интересным эффектом при наведении. Реализованы с помощью CSS, JavaScript. #анимация #css #js

Tuggable Light Bulb! — интерактивная лампочка с ручным переключением. Реализована с помощью CSS, Pug и JavaScript. #анимация #css

CSS-only Slide-up Caption Hover Effect — карточки с всплывающей информацией при наведении. Реализованы с помощью CSS. #анимация #css

Glowing button | SCSS nesting — кнопка с эффектом свечения. Реализована с помощью SCSS. #анимация #scss

Carousel with drag and wheel — анимированная карусель. Реализована с помощью SCSS, SVG и JavaScript. #анимация #scss #svg #js

Digital Rain – CodePen Challenge — сцена с "дождем" из символов, прямо как в матрице. Реализована с помощью CSS и JavaScript. #анимация #css #js

Button Hover Effects — кнопки с эффектом при наведении. Реализованы с помощью SCSS и JavaScript. #анимация #scss #js

overlapping sticky cards — карточки накрадывающиеся друг на друга при скролле. Реализованы с помощью SCSS. #анимация #scss