Available now! Telegram Research 2025 — the year's key insights 
JavaScript'er
Closed channel
Заявки приймаємо автоматично! Канал з лайфхаками для кожного поважаючого себе веб-розробника Запросити друга, якщо є: https://t.me/+my7itn9CGMplOTAy Зв'язок: @Ekater1na_admin
Show more7 344
Subscribers
-424 hours
-217 days
-8630 days
Posts Archive
7 344
Карусель карток
Карусель із фотографіями. Реалізовано за допомогою CSS та JS.
⤷ Взяти код
JavaScript'ер
7 344
Repost from Ти не знаєш JavaScript
CodePen дня: це компонент з реакцією на наближення від Amit Sheen
Весь JavaScript тут лише передає позицію курсора в CSS через кастомні властивості — і все. Всі обчислення виконуються в CSS за допомогою нативних математичних функцій
https://codepen.io/amit_sheen/full/gbbzbeR
Ти не знаєш JavaScript
7 344
Ви, можливо, знайомі з одиницею vh у CSS. 100vh - це висота в'юпорта.
На десктопах висота в'юпорта фіксована, але на мобільних пристроях усе складніше: під час скролу вниз в'юпорт змінюється - браузери зазвичай приховують елементи інтерфейсу (наприклад, навігацію), щоб звільнити більше простору.
У підсумку виникає неоднозначність: що саме означає vh?
Щоб вирішити цю проблему, CSS нещодавно отримав нові одиниці виміру
🔸 100svh (small viewport height) - це мінімально можлива висота в'юпорта, коли всі елементи інтерфейсу відображаються.
🔸 100lvh (large viewport height) - це максимально можлива висота в'юпорта, коли вся навігація та UI-елементи приховані повністю
🔸 Є також 100dvh (dynamic viewport height) - динамічна висота в'юпорта, яка автоматично перемикається між svh і lvh залежно від того, чи видно UI-елементи.
Translated with DeepL.com (free version)
7 344
Який метод JavaScript дозволяє обробляти кожне значення в масиві, створюючи новий масив з результатами?
7 344
Анімація меню
9 різних ефектів при наведенні на кнопку-бургер. Реалізовано за допомогою CSS.
⤷ Взяти код
JavaScript'ер
7 344
Який метод JavaScript використовується для додавання одного або кількох елементів у кінець масиву?
7 344
Проблема: ви хочете повторно кинути JavaScript-помилку, щоб видати більш зрозуміле (дружнє) повідомлення про помилку. При цьому ви хочете зберегти деталі початкової помилки.
Рішення: передайте оригінальну помилку через
cause
Докладніше: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error/cause
JavaScript'ер7 344
Яке значення буде у змінній h після виконання наступного коду?
let h = [1, 2, 3, 4, 5];
h = h.slice(1, 4);
7 344
Cube Effect Slider
Слайдер з кубічним ефектом. Реалізовано за допомогою CSS та JS.
⤷ Забрати код
JavaScript'ер
7 344
Vite – це інструмент для збірки модулів для веб-проєктів, розроблений творцем Vue.js Еваном Ю
Основні функції — Швидкий запуск сервера розробки: Vite використовує нативні ES-модулі (ESM), що дозволяє уникати попередньої збірки всього проєкту. — Гаряче перезавантаження: Зміни в коді відображаються миттєво, без перезавантаження сторінки. — Підтримка різних фреймворків: Vite працює з Vue, React, Svelte та іншими, а також з чистим JavaScript або TypeScript. — Обробка ресурсів: Vite дозволяє імпортувати та використовувати зображення, шрифти та інші статичні ресурси прямо в коді, автоматично оптимізуючи їх для виробничої збірки.Мови: TypeScript (83.4%), JavaScript (9.8%), HTML (5.2%), ... ⭐️ Star 74.3k https://github.com/vitejs/vite?ysclid=mdfuc8mkby977705397 JavaScript'ер
7 344
Цей чувак зробив хрестики-нулики ТІЛЬКИ на CSS (без HTML і JS)
Дивлюся на це вже пів години і досі не розумію, як воно працює. Якась магія з container queries, allow-discrete, кастомними типізованими властивостями.
Якщо відкрити DevTools у Firefox — там буквально нічого немає. Ось тут можна самому потикати: https://lyra.horse/fun/tic-nohtml/
JavaScript'ер
