Эффект раскрытия гридовых ячеек при наведении

Демо | Github

https://tympanus.net/codrops/2024/03/13/grid-item-reveal-animation-on-hover/

Топ 10 алгоритмов для интервью

Курс по алгоритмам с использованием JS для успешного прохождения секции лайвкодинг.

https://www.youtube.com/watch?v=ufBbWIyKY2E&ab_channel=freeCodeCamp.org

Shima Dev Tool

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

https://www.youtube.com/watch?v=v8GkxClnf68

Скорость HTTP

Сравниваем основные серверные JavaScript платформы: Deno, NodeJs, Bun.

https://kitsonkelly.com/posts/http-speed

Индикатор прогресса

Туториал по созданию веб компнонента прогресса загрузки.

https://piccalil.li/blog/solution-009-progress-indicator/

Новые математические функции в CSS

Как работают pow(), sqrt(), exp(), hypot() и как их можно использовать на практике

https://danielcwilson.com/posts/mathematicss-powers/

Делаем DVD скринсейвер на чистом CSS

Пошаговый туториал по созданию олдскульного скринсейвера.

https://www.javiermorales.dev/blog/dvd

React TypeScript Cheatsheets

Типизируем React приложение правильно: шпаргалка, которая поможет правильно указать типы при работе с React компонентами.

https://react-typescript-cheatsheet.netlify.app/

Практический TypeScript

10 часовой видеокурс для тех, кто еще не знаком с TS: аннотации типов, алиасы, enums, интерфейсы, дженерки, React + TS и многое другое.

https://www.youtube.com/watch?v=JHEB7RhJG1Y

Safe alignment flexbox

Как значение safe влияет на расположение контента при использовании flexbox и где это может быть полезно.

https://www.stefanjudis.com/today-i-learned/safe-unsafe-alignment-in-css-flexbox/

Создание вертикальных контролов для форм

В Safari 17.4 добавили возможность использовать writing-mode: vertical-rl, что актуально при разработке приложений для стран Азии.

https://webkit.org/blog/15190/implementing-vertical-form-controls/

Создаем виртуальную 3D галерею на Three.js

Большой туториал по работе с Three.js, включающий создание сцен, работу со светом и текстурами, контролами, анимациями.

https://www.youtube.com/watch?v=imqiYWidUIA

Документируем свой JS код

Краткий курс по использованию JSDoc.

https://www.youtube.com/watch?v=YK-GurROGIg

7 простых правил для лучшего отображения данных

Как визуализировать данные понятно и наглядно для пользователей вашего приложения.

https://www.sitepoint.com/better-data-visualization-simple-rules/

Изучаем NestJS - Полный курс

Большой 14 часовой курс по разработке на NestJs: котроллеры, сервисы, модули, работа с БД, авторизация, сваггер и другие аспекты разработки веб серверов.

https://www.youtube.com/watch?v=sFnAHC9lLaw

Прощай, JS Profiler

Профайлинг CPU c помощью вкладки Performance в Chrome. О причинах ухода от профайлера, и как теперь мониторить производительность приложений.

https://developer.chrome.com//blog/profiling-cpu

Изучаем относительные viewport единицы в CSS

Как и когда использовать 100vh, 100dvh, 100lvh, 100svh.

https://webdesign.tutsplus.com/learn-these-viewport-relative-css-units-100vh-100dvh-100lvh-100svh--cms-108537t

KeyUX - библиотека, позволяющая удобно работать с вашим сайтом с клавиатуры

Сделана не только для доступности, но и для тех, кто любит использовать клавиатуру по максимуму в своей работе. Весит всего 2Кб и не использует дополнительные зависимости.

https://github.com/ai/keyux

Скролл-анимация с типографикой

Эксперимент с анимацией с появлением изображения в тексте при скролле.

Демо | Github

https://tympanus.net/codrops/2024/04/02/on-scroll-expanding-image-animation-within-typography/

Оптимизация карусели для EditorJS

Показательный пример того, что не все библиотеки собраны оптимальным образом, и как с эти можно бороться (если очень нужно)

https://dev.to/appqui/how-i-optimized-carousel-for-editorjs-2x-in-size-4efa