Textarea auto-expand

Автоматическое расширение текстовой области. Реализовано с помощью JavaScript и CSS.

#анимация #css #js

https://codepen.io/vsync/pen/nrKwbm

@javascriptv

Volume button knob 

Кнопка увеличения/уменьшения громкости, написанная на CSS(SCSS), JavaScript(TypeScript)

#button #js #typescript

https://codepen.io/rodzyk/pen/mdxvQby

@javascriptv

JavaScript: визуализация Event Loop

Одной из ключевых особенностей JavaScript является способность обрабатывать асинхронные операции с использованием цикла событий. По сути, цикл событий — это то, что позволяет JavaScript обрабатывать несколько задач одновременно, не дожидаясь завершения одной задачи, прежде чем переходить к следующей.

В этой статье с помощью визуализации рассматривается, как работает Event Loop:

https://dev.to/lydiahallie/javascript-visualized-event-loop-3dif

#js

Инструменты фронтенд-разработчика — ESLint

ESLint — это популярный JavaScript-линтер с открытым исходным кодом, который используется для анализа кода и выявления в нём ошибок.

Также ESLint предоставляет разработчикам набор правил, которые могут быть настроены в соответствии с конкретными потребностями проекта или команды. По сути, благодаря этому инструменту намного проще поддерживать стилистику кода и избегать базовых ошибок:

https://eslint.org/

#js

@javascriptv

​Руководство по Solid JS

Solid JS — это реактивная JavaScript-библиотека для создания пользовательских интерфейсов. Она однократно компилирует шаблоны, а при изменении состояния приложения выполняется только тот код, который необходим для визуализации этого изменения.

Видео-руководство по Solid JS на примерах знакомит со всеми аспектами использования этой библиотеки:

https://www.youtube.com/playlist?list=PL4cUxeGkcC9gU_GvFygZFu0aBysPilkbB

#js

Section design with hover effect

Адаптивные карточки с красивым анимированным фоном при наведении. Реализованы с помощью CSS и JavaScript.

https://codepen.io/uiswarup/pen/BaaexdO

#js #анимация #css #javascript

@javascriptv