Web Overflow 🇺🇦
4.42K subscribers
382 photos
40 videos
3 files
518 links
Затишний блог про веб-розробку і не тільки 💛

Чат: @web_overflow_chat
Співпраця: @web_overflow_support
Автори: @lluchkaa & @anastasiia_tarasenko
加入频道
Vim Motions 🕹️

Це мав бути душний пост про те, як я сетапив neovim, але він буде тільки після того, як я повністю завершу налаштування.

Хочу сьогодні розповісти про Vim Motions і я справді вважаю, що цей пост теж буде корисним, адже це напевно головна причина чому люди взагалі іноді задумуються над vim. І що найкраще - використовувати Vim Motions можна напевно в будь-якому редакторі/IDE.

Отож, що це взагалі таке?

Vim Motions - це команди для швидкої роботи з текстом. Вони дозволяють ефективно рухатись по тексту чи редагувати його без використання миші, що економить час. І найкраще в цьому те, що знаючи основну базу, можна комбінувати це все у складніші конструкції. Для прикладу, d (delete) - оператор видалення, w (word) - рух до початку наступного слова, а команда d3w (delete 3 word) - видалить три слова.

👉 Vim as your editor from ThePrimeagen
👉 Vim motions for absolute beginners
👉 Vimified
👉 Vim Adventures

👉 Vim для VS Code
👉 Vim для JetBrains

#tips
👍10🤪21
dependencies vs devDependencies vs peerDependencies 🍐

При роботі з JavaScript, правильне управління залежностями проєкту є ключовим моментом. У package.json ми можемо побачити різні типи залежностей, кожен з яких має своє призначення.

dependencies — це ключові залежності вашого проєкту. Вони містять всі бібліотеки та фреймворки, без яких ваш додаток не зможе працювати в production середовищі. Якщо ваша програма викликає якусь бібліотеку або інструмент під час виконання, вона повинна бути додана до розділу dependencies.

devDependencies містять інструменти, які використовуються тільки під час розробки додатку. Вони не потрапляють у production, тому що їхня функція полягає в тому, щоб полегшити процес написання та тестування коду. Наприклад, компілятори, такі як Babel, інструменти для тестування, такі як Jest, лінтери чи форматувальники будуть у цьому розділі.

peerDependencies визначаються тоді, коли ваш пакет розрахований на використання разом з іншими бібліотеками, які повинні бути встановлені на рівні проєкту користувача. Це стосується плагінів або модулів, які розширюють функціональність певних фреймворків або бібліотек. Вони не встановлюються автоматично, а лише сигналізують користувачеві про необхідність самостійно їх додати.

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

#interview
👍92
👍51
👍61
#todo написати функцію на будь-якій мові програмування, яка приймає 4 параметри типу Point { x number; y number } та повертає true, якщо ці точки формують квадрат, інакше - false.
2👍2🍾1
Чи знали ви, що таке rubber ducking? 🐥

Якщо ні, то ось посилання для короткого ознайомлення.

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

А чи є у вас гумова качечка? Якщо так, діліться фото в коментарях 🙃

#tips
👍64
Right Sidebar ➡️

В більшості середовищ розробки присутній Sidebar з певним функціоналом, зазвичай - дерево файлів, пошук та інше. Ви точно бачили такий в VS Code.

От останнім часом спільнота активніше говорить про те, що є сенс в тому, щоб пересунути sidebar в праву сторону, щоб при зміні його розміру код залишався в одному місці. А з якої сторони у вас знаходиться sidebar?

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

#shorts
👍8🤯1
Welcome!

Let's practice our English! So...

👉 What’s the one quote you live by, and how does it inspire you?

Have a nice #english_friday 💛
👍31🔥1
#how_to використовувати Object.groupBy в JavaScript.

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

#shorts
👍43😱2
Never* use git pull ↙️

Якщо ви працюєте над проєктом не самі, то вам часто доводиться стягувати зміни з поточної гілки або з базової. Якщо ви робите це через git pull - ви кожного разу будете отримувати новий merge комміт. Наче нічого поганого, але постійно буде присутній один "зайвий" комміт.

А от як цього можна уникнути завдяки rebase - дивіться у відео за посиланням нижче.

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

#tips
9👍6
VS Code Remote tunnels 🚇

Уявіть ситуацію, що весь ваш проєкт на робочому компʼютері в офісі, а вам терміново треба з дому щось змінити. Здається у VS Code є рішення.

Яке саме? Дивіться у відео за посиланням нижче.

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

#tips
👍111
Збір від "Повернись живим" та MacPaw

"Повернись живим" та MacPaw збирають 3,2 млн грн для купівлі кейсеваку для 53-ї та 54-ї піхотних бригад. Це спецмашина, яка евакуює поранених з найскладніших територій фронту.

🚑 Машину потрібно терміново доставити на фронт, тому 5, 10 чи 15 гривень від вас – це чиєсь врятоване життя.

А той, хто задонатив 200грн і більше - можуть виграти MacBook Air чи iPhone 15 Pro Max.
Або ж унікальний сталевий жетон від RBTNK за кожну закриту дружню банку на 10к грн. Для цього - пишіть до @macpawfoundation в Instagram чи Facebook.

👉 Долучитись до збору
👍134
👍51
Що виведе консоль?
Anonymous Quiz
7%
0 1 2 3 4 5
9%
1 2 3 4 5
40%
5 4 3 2 1 0
45%
5 4 3 2 1
👍132🔥1
#todo написати функцію на будь-якій мові програмування, яка приймає додатнє число n та повертає випадковий вектор довжиною n у форматі (x, y), де x - зміщення по осі X, y - зміщення по осі Y.

Наприклад:
n = 5 => (3, 4)
n = 5 => (4, 3)
n = 5 => (-3, -4)
👍31😱1
TailwindCSS container queries 🥡

Колись давно ми розповідали про Container Query в CSS. За даними Can I use майже 91% девайсів користувачів зможуть використовувати цей функціонал.

TailwindCSS з коробки не підтримує Container Query, але вони розробили окремий плагін, який дозволяє використовувати цей функціонал, майже так само, як ви використовуєте media-query.

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

#library
👍42
Ollama 🤖

Ollama — це open-source платформа для запуску LLM (великих мовних моделей) безпосередньо на вашому комп'ютері. Це дає вам можливість використовувати потужність штучного інтелекту без потреби в хмарних сервісах, що не тільки підвищує швидкість обробки, але й забезпечує більший контроль за вашими даними. Ви можете вибрати з великої кількості готових моделей, а також знизити витрати, використовуючи ресурси свого пристрою.

Ollama також дозволяє налаштовувати та розширювати моделі під ваші конкретні завдання, пропонуючи спеціальний файл конфігурацій — Modelfile (нічого вам не нагадує?).

#tips
👍42
Welcome!

Let's practice our English! So...

👉 If you could invent a new holiday, what would it celebrate, and how would people celebrate it?

Have a nice #english_friday 💛
👍41
#how_to налаштувати debugger для Next.js проєкту в VS Code.

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

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