#how_to створити range input різного типу 🤩

Виконаний з допомогою React!

👉 Відкрити посилання

#how_to створити 3D Card Hover 🔥

Виконаний лише з допомогою HTML та CSS!

👉 Відкрити посилання

#how_to створити Movie Poster Interaction 🔥

Виконаний лише з допомогою HTML та CSS!

👉 Відкрити посилання

#how_to створити анімацію на секретний код 🔥

Виконаний лише з допомогою HTML та CSS!

👉 Відкрити посилання

#how_to створити анімацію для borders 🤌

Виконаний лише з допомогою HTML та CSS!

👉 Відкрити посилання

#how_to створити Hamburger CSS Animations 🍔

Виконаний лише з допомогою HTML, SCSS та JavaScript!

👉 Відкрити посилання

#how_to створити анімацію люстри 💡

Виконаний з допомогою HTML, CSS та JavaScript!

👉 Відкрити посилання

#how_to створити анімацію виділення тексту 💬

Виконаний з допомогою HTML та CSS!

👉 Відкрити посилання

#how_to створити CSS Typing Effect 📝

Виконаний з допомогою HTML та CSS!

👉 Відкрити посилання

#how_to створити Infinite Scroll Animation ♾️

Виконаний з допомогою React та SCSS!

👉 Відкрити посилання

#how_to створити Confetti Button 🎉

Виконаний з допомогою React та CSS!

👉 Відкрити посилання

#how_to скопіювати текст в буфер обміну з допомогою JavaScript 📋

👉 Відкрити посилання

#how_to створити button hover effects with box-shadow 🎉

Виконаний з допомогою HTML та SCSS!

👉 Відкрити посилання

#how_to створити кнопку для виклику за телефонним номером 📞

Потрібно всьо лиш створити звичайне посилання з спеціальним href:

<a href="tel:+380999999999">
  Подзвонити
</a>

Також можливо створити посилання, яке відкриє вікно для відправки email:

<a href="mailto:[email protected]">
  Написати email
</a>

#how_to створити shimmer wave text animation 🎉

Виконаний з допомогою HTML, SASS і JavaScript!

👉 Відкрити посилання

#how_to додати більше одного ref до елемента в React? 👀

function mergeRefs<T = unknown>(
  ...refs: (React.MutableRefObject<T> | React.LegacyRef<T>)[]
): React.RefCallback<T> {
  return function (value) {
    refs.forEach((ref) => {
      if (typeof ref === 'function') {
        ref(value)
      } else if (ref !== null) {
        ;(ref as React.MutableRefObject<T | null>).current = value
      }
    })
  }
}

// Example
const forwardedRef: React.ForwardedRef<HTMLInputElement>
const localRef = useRef<HTMLInputElement>()

<input ref={mergeRefs(forwarderRef, localRef)} />

#how_to оголосити тип глобальної змінної в TypeScript

👉 Відкрити посилання

#how_to ввімкнути inlay підказки в VSCode

👉 Відкрити посилання

#shorts

#how_to ввімкнути font ligatures в редакторі.

👉 Ввімкнути font ligatures в VS Code
👉 Ввімкнути font ligatures в JetBrains IDE

#how_to використовувати Object.groupBy в JavaScript.

👉 Дивитись відео

#shorts