Welcome!

Let's practice our English! So...

👉 If you could return to school, what would you change in your behavior/study?

Have a nice #english_friday 💛

Welcome!

Let's practice our English! So...

👉 How do you see yourself ten years from now?

Have a nice #english_friday 💛

Кристал вкрадений вкрали 💎

Сьогодні в чаті @VladNukem поділився книгою Simplified JavaScript for Very Important Programmers. Власне сам коментар можна знайти отут. Про книгу ми також чули, має бути цікаво, та і видана вона лише в минулому році.

Може це і не дуже добросовісно, але ми все ж таки поділимось PDF-файлом. Але заодно і додаємо посилання на блог автора, можливо, хтось захоче придбати паперовий варіант або ж просто підписатись.

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

#tips

Мусимо вам зізнатись, що...

ми вже дуже давно не були ні на яких співбесідах. Ми знайшли комфортний проєкт і вже більше року з нього не вилазимо. Тому поняття не маємо, що зараз питають і вимагають від кандидатів.

Але дуже добре, що в нашому чаті завжди знайдуться люди, які поділяться своїм досвідом. І ось @Yurets7777 зібрав список питань для співбесіди, які він для себе вивів за період квесту із пошуку роботи. А ми, зі свого боку, сформували їх в окрему статтю, щоб всім було зручно.

Зберігайте і готуйтесь до співбесід якісно. Також можете написати в коментарі питання, які було б цікаво розібрати 💛

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

#interview

#todo пройти опитування Stack Overflow 2024 Developer Survey.

Насправді це дуже важливо, адже так ми можемо показати, що в Україні є багато класних ІТ-спеціалістів. Минулого року з нашої країни долучилось лише 873 особи, що складає 1% від всіх опитуваних. Цього року потрібно покращити результат!

Welcome!

Let's practice our English! So...

👉 Dogs or cats?

Have a nice #english_friday 💛

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

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

Як зробити preview зображень для <input type="file" />?

Завантаженням зображень на веб-сторінках сьогодні нікого не здивуєш. А як показати зображення, ще до того, як воно було оброблене? Адже в нас є тільки файл, а не src у текстовому форматі. Логічно виходить, що нам потрібно перетворити даний файл у текст.

Перший спосіб - URL.createObjectURL.

// Дістанемо файл, наприклад отак:
const file = event.target.files[0]

const url = URL.createObjectURL(file)

// Додамо цей url в src-атрибут для img
img.src = url

Після цього - не забудьте звільнити цей URL за допомогою URL.revokeObjectURL().

Інший спосіб - використати FileReader. Знайти приклади з ним - ваше домашнє завдання 🤓. Лише додамо, що якщо вам потрібно зробити щось таке у service worker - цей метод спрацює, на відміну від першого.

👉 Відкрити документацію URL.createObjectURL
👉 Відкрити документацію FileReader.readAsDataURL

Ну і звісно не без приколів. Стандартний формат зображень на iPhone - HEIF/HEIC, який поки не підтримується більшістю браузерів. Тому, якщо вам необхідно підтримувати і цей формат, зверніть увагу на бібліотеку heic2any.

👉 Відкрити документацію heic2any

#interview

#todo написати функцію на будь-якій мові програмування, яка приймає шлях до файлу (текстовий рядок) та повертає масив чисел, де кожен елемент - кількість символів у відповідному рядку файлу.

ESLint v9 👨‍🔧

В квітні на світ зʼявилась нова версія ESLint. В ній використано нову структуру конфігурацій за замовчуванням, зʼявились нові правила та оновлення старих, і ще багато покращень.

Але спішити оновлюватись не варто, адже тепер версія Node.js має бути не нижче v18.18.0. Також, навряд чи ви користуєтесь лише чистим ESLint, тому варто перевірити, чи всі плагіни теж підтримують ESLint v9.

Команда ESLint підготувала навіть окремий застосунок, який допоможе вам мігрувати на нову версію. Більше ви можете почитати за посиланням нижче.

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

Також, розробники діляться своїм досвідом оновлення, тому на це теж варто звернути увагу.

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

#news

Welcome!

Let's practice our English! So...

👉 What TV shows are you watching right now?

Have a nice #english_friday 💛

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

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

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

Починаємо тиждень на позитивній ноті, тому…

#todo поділитися айтішним жартом/мемом в коментарях 😉

TypeScript 5.5 beta 🤓

Колись давно ми розповідали вам про ts-reset. Цей модуль виправляв поведінку TypeScript при використанні .filter(Boolean).

І ні, поки він сам цього робити чомусь не може 😁. Проте покращення зʼявились і тепер в нас є щось типу автоматичних перевірок на тип (самі придумайте як краще перекласти Inferred Type Predicates).

Краще один раз побачити ніж десять разів прочитати:

type User = { id: string };
type ProUser = User & {
  plan: string;
};

const users: (User | ProUser)[] = [
  { id: "1" },
  { id: "2", plan: "pro" },
  { id: "3" },
];

users.filter((user) => "plan" in user).map((user) => user.plan.toUpperCase());

Такий код до TypeScript 5.5 не вважається правильним, адже user в map все ще має тип User | ProUser, а отже властивості plan може не існувати.

Щоб дізнатись більше про цю бета-версію, переходьте за посилання внизу.

👉 Відкрити посилання
👉 Дивитись пост в X від t3.gg

#news