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

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

#shorts

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

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

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

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

#shorts

#how_to налаштувати debugger для Next.js проєкту в VS Code.

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

А також зверніть увагу на client-side та server-side налаштування. Вони спрацюють для відповідних не-Next.js проєктів.

#how_to створити toggle pill 💊

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

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

#how_to створити frying pan preloader 🥘

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

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

#how_to увімкнути автоформатування коду.

👉 VS Code
👉 JetBrains

📩 Відправили листа – а потім згадали, що не прикріпили файл? Або випадково надіслали клієнту замість файлу з комерційною пропозицією мемчик з котиком? 🐱

На жаль, У Gmail немає чарівної кнопки "Редагувати" чи "Видалити", але можна додати невелику затримку перед відправкою. Це ваш шанс передумати та виправити помилку.

#how_to додати затримку перед відправкою електронного листа в Gmail:

1. Натискаєте іконку налаштувань;
2. Натискаєте кнопку "Переглянути всі налаштування";
3. Шукаєте "Скасувати надсилання";
4. Змінюєте значення на 30 секунд.

Тепер у вас буде час врятувати свою репутацію – або хоча б уникнути фейспалму від власного ж листа 😅

git config --global user.name "Linus Torvalds"
git config --global user.email "[email protected]"

#how_to підписати commit за допомогою GPG-ключа 🔑

👉 Відкрити коротку інструкцію
👉 Відкрити детальну інструкцію від GitHub

#how_to перевантажити функції в TypeScript.

👉 Читати пост

#how_to створити ефект набору тексту, як у терміналі 💻

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

Aerospace Script 🪟

Window manager — це програма, яка керує вікнами ваших застосунків: їхнім розташуванням і розміром.

Серед таких програм (або схожих до них) можна виділити:
- Linux: i3, Hyprland;
- MacOS: Magnet, Rectangle, Yabai, Amethyst.

Зараз я тестую Aerospace. І в один момент я зрозумів, що мені дечого не вистачає.

#how_to втикати відосіки під час роботи, якщо у вас один монітор: двічі натискаєте праву клавішу на відео в YouTube та натискаєте Picture in Picture.

Проблема в тому, що через використання WM я розділяю вікна на різні воркспейси, а вікно Picture in Picture залишається тільки на одному з них. Оскільки fixed-режиму для вікон немає, єдиний варіант — змусити вікно автоматично переміщуватися під час зміни воркспейсу.

Ось як це зробив я:

exec-on-workspace-change = [
  '/bin/bash/', '-c',
  'aerospace move-node-to-workspace --window-id $(aerospace list-windows --monitor focused --app-bundle-id com.google.Chrome --format "%{window-id} %{window-title}" | awk "\$0 ~ /Picture in Picture/ {print \$1}") $AEROSPACE_FOCUSED_WORKSPACE'
]

#experience

#how_to створити ефект прокручування на числах.

Бібліотека NumberFlow дозволяє легко реалізувати цей ефект, не має жодних залежностей і добре кастомізується. Підтримує React, Vue, Svelte та Vanilla JS.

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

#how_to захистити ваші гілки на GitHub 😎

Буває, що кіт випадково пробіжить по клавіатурі і робить force push на стейджинг видаляючи половину всієї історії? 🐈

Щоб уникнути таких неприємностей, можна налаштувати правила для окремих гілок.

Для цього перейдіть у Settings вашого репозиторію, а потім в Rulesets. Там ви можете створити окремий список правил, які застосовуються до певних гілок або тегів (target). Можна одразу заблокувати force push на основні гілки, вимагати лінійну історію (якщо це потрібно) та дозволяти зміни лише через PR, який має бути обов'язково перевірений іншою особою, а всі коментарі — закриті. Налаштувати можна навіть список дозволених способів зливання гілок (merge, rebase, squash). Загалом, які налаштування вибрати — залежить від ваших вимог.

UPD: Доступні rulesets в public репозиторіях або ж у приватних репозиторіях з підпискою GitHub Pro, GitHub Team чи GitHub Enterprise Cloud.

👉 Protected branches on GitHub
👉 Protected branches on GitLab

#how_to використовувати :has() 💅

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

#how_to обрати версію TypeScript у VS Code.

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

Використайте комбінацію клавіш CTRL + SHIFT + P та оберіть TypeScript: Select TypeScript Version...

#how_to створити loader 😇

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

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

#how_to використати background clip для створення тексту з градієнтом 🔥

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

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

Знову опитування!

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

Ось коротке нагадування про рубрики, які будуть в опитуванні:

#interview - розбираємо типові питання з технічних співбесід (давненько не було, зізнаємось).
#quiz - вирішуємо tricky задачки (переважно від Юри).
#todo - ділимось цікавими задачами, які треба вирішити кодом (або просто змушуємо вас щось зробити 😅).
#english_friday - щоп’ятниці обговорюємо цікаві теми англійською.
#how_to - ділимось класно реалізовані кейси (здебільшого з CodePen).

Для нас це важливо ⬇️