JavaScript'er

💡Порада по Javascript Якщо ви маєте справу з фреймворками, що роблять ставку на незмінні структури даних (*cough* React), і вам потрібно змінити записи в масиві, ` with стане вашим найкращим другом. JavaScript'ер

😮Добірка різних інструментів на одному ресурсі: - генератор трикутників - генератор тіней для вибраного кольору - генератор градієнтів - SVG-фігури - Стиснення SVG - перетворення SVG → JSX - перетворення на BASE64 - генератор випадкових даних - колекція символів - генератор текстів - Відображення різних курсорів - Детальна інформація про натиснутою клавішу Особливо корисний генератор трикутників, щоб не підганяти розміри вручну, в інтерактивному режимі відразу видно результат І лишаємо саме посилання: https://omatsuri.app/ А для перегляду та пошуку необхідних символів є інший, цікавіший ресурс - https://www.toptal.com/designers/htmlarrows/ JavaScript'ер

🆕Ловіть простеньку шпаргалка з позиціонування елементів у CSS Grid Це ми зберігаємо, щоб не втратити:) JavaScript'ер

🖥Hamburger Menu Animation Проста але прикольна анімація для бургер-кнопки. Реалізовано за допомогою CSS. ⤷ Забрати код JavaScript'ер

🥸Питання із співбесіди Яка різниця між function declaration та function expression у JS? Відповідь: Function Declaration: • Використовується ключове слово function на початку рядка коду. • Зазвичай використовується для створення функцій, які мають бути доступні у всьому поточному контексті виконання (наприклад, усередині будь-яких блоків коду у поточному скрипті). • Функції, оголошені таким чином, піднімаються вгору в області видимості, що означає, що вони можуть бути викликані до фактичного оголошення функції в коді. Function Expression: • Функція надається змінною як значення. • Зазвичай використовується для створення анонімних функцій або функцій, які мають бути доступні лише в межах певного контексту виконання. • Функції, створені таким чином, не піднімаються вгору в області видимості (hoisting), їх можна викликати лише після того, як вони були надані змінною. JavaScript'ер

let one = [1, 2, 3, 4, 5];
let two = [6, 7, 8, 9, 10];

console.log(typeof(one + two));

JavaScript'ер

🙂Мені здається серед нас зрадник JavaScript'ер

📱Як працює Array,map() в JS? Array,map : Створює новий масив шляхом виклику зазначеної функції для кожного елемента вихідного масиву і збирає результати в новий масив. Вона приймає один обов'язковий аргумент - це функція зворотного виклику ( callback ), яка буде застосована до кожного елемента вихідного масиву. Callback може приймати до трьох аргументів: • currentValue - поточний оброблюваний елемент масиву. • index — Індекс поточного елемента, що обробляється в масиві. • array — Масив, яким здійснюється прохід. • Також є необов'язковий аргумент thisArg - значення, яке використовується як this при виклику функції callback Приклад коду:

 const numbers = [1, 2, 3, 4];
const doubled = numbers.map (num => num * 2);
console.log(doubled); // [2, 4, 6, 8]

JavaScript'ер

😅Щоб утирати сльози при падінні контейнера JavaScript'ер

Обрана, нічний чатик😎 Народ, пишіть, чим зараз займаєтесь: які проекти робите, що вивчаєте Ще чекаю Ваших порад та ідей по контенту, збираюсь покращувати якість і таке інше⚡

const obj = {
  a: 'one', b: 'two', a: 'three'
};
console.log(obj);

JavaScript'ер

😮Красива 3D карусель для зображень на HTML, CSS та JavaScript Ось весь код: 🐱GitHub JavaScript'ер

🖥Hono - простий надшвидкий фреймворк для Edges - npm create hono@latest Він працює в будь-якому середовищі JavaScript: Cloudflare Workers, Fastly Compute, Deno, Bun, Vercel, AWS Lambda, Lambda@Edge та Node.js 🐱GitHub ▪️Доки ▪️Приклади використання JavaScript'ер

✔️Menu Hover Underline Hover-ефект з плавним підкресленням та перефарбовуванням елементів меню. Реалізовано з допомогою SCSS. ⤷ Забрати код JavaScript'ер

⌛Цікавий проект: ентузіаст створив безкоштовний клон After Effects І що найкрутіше - працює прямо у браузері, безкоштовно та навіть без реєстрації. Інтерфейс схожий на After Effects і всі функції знаходяться на звичних місцях. Один ентузіаст зумів перевершити всю Adobe! Спробувати можна тут: https://pikimov.com/ JavaScript'ер

☀️EmberData — легка бібліотека для керування даними у веб-застосунках - pnpm add ember-data Вона дозволяє керувати даними в додатку за допомогою шаблонів, що масштабуються. Деякі особливості EmberData та її шаблонів: - упор на продуктивність та компактність - Підтримка Typescript - Підтримка будь-яких API: GraphQL, JSON: API, REST, tRPC - всього, що завгодно 📱GitHub ▪️Доки JavaScript'ер

🥲Коли з колегами вирішили піти з роботи раніше, але зустрілися з начальником JavaScript'ер

😮CSS властивість field-sizing Дозволяє маніпулювати поведінкою полів форми при заповненні За значення field-sizing: content; - відключить стандартну поведінку та дозволить підлаштовувати розмір полів форми залежно від контенту field-sizing: fixed; збереже поточну поведінку, і поле введення форми не змінюватиметься у розмірах

 input,
textarea,
select{
field-sizing: content;
min-width: 50px;
max-width: 250px;
padding: 10px 20px;
}

Експериментальна технологія, підтримка 66.51% JavaScript'ер