JavaScript'er

🥵І травку курив JavaScript

⚡️Нові можливості CSS - animation-timeline Алоха друзі! Напевно, багатьом тут доводилося хоч раз за свою кар'єру розробляти анімацію, яка залежить від стану скролла. І думаю що більшість з нас робила це за рахунок js eventa- scroll . Метод хоч і робочий, але не сказати що найкращий, його величезний мінус у тому що при скролінгу даний івент спрацьовує дуже часто, що як ви розумієте не дуже добре впливає на продуктивність. Так ось є інший спосіб. Цю штуку можна релізнути за рахунок CSS рахунок animation-timeline . Сама властивість вже не нова, але прив'язати таймлайн до скролла з'явилася можливість нещодавно. І так, трохи коду: .element { animation-timeline: scroll(nearest x) } Як бачимо наша функція приймає 2 параметри Параметр 1 - відносно чого вважаємо наш скролл: nearest - найближчий контейнер (дефолтне значення). root - вважає скролл щодо елемента document. self - призначає сам елемент скролл контейнером. Параметр 2 - вісь ( x або y ) Відповідно якщо ми вибираємо x то вважаємо таймлайн щодо горизонтального скролла, якщо y то вертикального. Загалом тепер ви ознайомлені із можливістю цієї нової фічі. Якщо захочете почитати докладніше про властивість animation-timeline, то ось вам посилання на документацію, але вона англійською. Успіхів в експериментах!🤓 JavaScript

🔍Шпаргалка по масивам #cheatsheet JavaScript

▶️Article Toggle Плавне перемикання світлої та темної тем. Реалізована за допомогою CSS та JavaScript. JavaScript

💬Що таке useLayoutEffect в React? Хук useLayoutEffect має такий самий api як і useEffect. Відмінності: - useLayoutEffect – синхронний і буде викликаний до того, як браузер зможе відобразити компоненти. Спрацьовує коли компоненти вже знаходяться на virtual dom (у пам'яті і можна прочитати/встановити різні властивості), але ще не були браузером. - useEffect - асинхронний і буде викликаний після того, як браузер відобразить компоненти. Хук useLayoutEffect запобігає зайвому оновлення компонента. JavaScript

🖥Responsive Image Carousel Зверстано на HTML та CSS. Логіка перемикання слайдів реалізована у JS. JavaScript

💬Питання на співбесіди Які значення в JS є хибними? Відповідь: хибними є значення, результатом перетворення яких у логічне значення є false. JavaScript

😆Краще, що бачив JavaScript

📌Годнота для розробників ПЗ Metabob - це ШІ-інструмент для миттєвого апгрейду вашого коду. Він використовує нейромережі та великі мовні моделі для виявлення, пояснення та виправлення кодових проблем. Також він ще й кидає ідеї, як оживити і поліпшити код! Підтримує Python, JavaScript, Typescript, C++, C та Java. </Codu>

📍Шпаргалка по регулярних виразах, масивах та інше #cheatsheet JavaScript

🔗Wavy login form Крутий дизайн логін-форми для вашого веб-сайту! JavaScript

🔥Шпаргалка по методу масиву #cheatsheet JavaScript

❓Що буде у консолі? a) [1, 2, 3] b) [1, 2, 3, 4, 5, 2, 4, 6, 8, 10] c) [2, 4, 6] Правильна відповідь – b JavaScript

🦈Shark Анімація акули. Реалізована за допомогою CSS та JavaScript. JavaScript

😉Може все таки ну? #mem JavaScript

💬Питання на співбесіді Що таке схлопування margin (margin collapsing)? Відповідь: Це коли вертикальні зовнішні відступи (margin-top і margin-bottom) у сусідніх елементів об'єднуються в один відступ, розмір якого визначається так: • Якщо обидва значення margin позитивні, вибирається найбільше значення • Якщо обидва значення margin негативні, вибирається найменше (найбільше за модулем) значення • Якщо одне з значень margin негативне, відступ дорівнює їх сумі. JavaScript | #співбесіда