Web Overflow 🇺🇦

2022-07-11 13:46:11 VS Code Extensions

Як середовище я зараз використовую VS Code. Для підвищення продуктивності і комфорту я часто додаю собі різні розширення. Тому хочу поділитись особисто своїми.

GitLens - дає багато функціоналу для роботи з Git. З ним буде набагато легше працювати з репозиторіями, ходити по історії файлів і купу всього іншого. Тепер кожен раз коли я зустрічаю стрічку гавнокоду - я одразу бачу, що то я її написав 2 місяці назад.

Code Spell Checker - хороший програміст - грамотний програміст. З цим розширенням ви одразу помітите помилку у слові, якщо вона є. А якщо раптом слово правильне, а в базі його немає, завжди можна додати його як виняток.

Indent Rainbow - кольорова табуляція. Так, багато хто не любить, коли в редакторі мільйон кольорів (наприклад, Настя), але з цим розширенням буде візуально легше контролювати відступи. До речі, хто користується Bracket Pair Colorizer - тепер цей функціонал вже вбудований в VS Code.

Better Comments - кожна ваша TODO тепер буде підсвічуватись. Там звичайно є і інші правила, тому ви можете різними способами класифікувати свої коментарі.

Project Manager - помічник в роботі з різними проектами. Щоб запустити проект, вам потрібно знайти проект, відкрити папку з ним і тд. А це розширення допоможе автоматизувати цю роботу. Просто вибираєте проект із списку і починаєте над ним працювати.

Це були досить загальні розширення, ніяк не повʼязані з конкретними технологіями. Вони в мене включені завжди. А інші я вже підключаю в залежності від проекту. Тому якщо у вас проект на певній технології, раджу глянути відповідні розширення: Javascript Snippets, ESLint, Prettier, React Snippets, Angular, Svelte, Python.

Також раджу вам переглянути вкладку популярних розширень.

І на завершення поділюсь розширеннями, які я використовую чисто для краси. Це One Dark Pro, для файлових іконок - Material Icon Theme, а для іконок в VS Code - Material Product Icons.

#tips Відкрити / Коментувати

2022-07-11 13:46:11 Відкрити / Коментувати

2022-07-10 19:36:54 Поки ми застрягли в поїзді, хочемо нагадати, що у нас є чатик.

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

Приєднуйтесь! Відкрити / Коментувати

2022-07-08 09:05:00 Duck typing

Хто ми? - JS розробники.
Що ми хочемо? - Зберігати в одній змінній булеани, стрічки та функції.
~ Мій розумний знайомий

Сьогодні не про типізацію в JS, а про duck typing (качину типізацію, якщо українською) у програмуванні. Коротко, це можна описати так: "Якщо воно виглядає як качка, плаває як качка і крякає як качка - це напевно і є качка".

Реальний кейс: уявіть, що у вас завантажуються дані з якогось джерела (бекенд, файл тощо). Хай це буде Користувач (User) з полями імʼя (firstName) і прізвища (lastName). І вам для достовірності потрібно перевірити чи справді цей обʼєкт є Користувачем. Тому у вас зʼявиться схожа умова:

‘firstName’ in user && ‘lastName’ in user

Помітили щось схоже? Якщо є імʼя і прізвище, то це - Користувач. А насправді там може бути ще багато інших полів. І якщо піти далі, то можна додавати перевірки і на інші поля. Але принцип перевірки не зміниться - на основі властивостей обʼєкта, ми будемо асоціювати його з певним типом. Це і є duck typing.

Трішки детальніше можете ознайомитись тут - читати статтю
А якщо хтось добре знайомий з Typescript, можете також глянути Type Predicates - читати статтю

А які у вас були випадки використання такої типізації?

#article Відкрити / Коментувати

2022-07-08 09:05:00 Відкрити / Коментувати

2022-07-07 09:05:00 А зараз супер короткий лайфхак - якщо відкрити репозиторій в github і просто натиснути "." (на англ. розкладці), то у вас в браузері відкриється веб-версія VSCode.

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

Тому, хто ще не пробував, раджу це зробити. І на додачу, можете глянути собі Github Codespaces. Це фактично те ж саме, тільки з наворотами. Тут у вас буде майже повноцінний компʼютер і зможете запускати свої проекти просто у браузері. Тільки, здається, там треба PRO аккаунт. Але якщо ви студент, то зареєструйте свою студентську пошту і зможете отримати його безкоштовно

#tips Відкрити / Коментувати

2022-07-06 09:05:00 Відкрити / Коментувати

2022-07-06 09:05:00 #quiz Відкрити / Коментувати

2022-07-05 21:02:51 Hoisting

Швидше за все інтервʼю вам буде проводити людина вже з великим досвідом. І може вийти так, що це буде “олд“ Javascript’а з мільйоном років досвіду. А починав він кодити на ньому ще коли не було класів, const і let, і інших функцій. І так як він ще користувався var, він запитає вас про hoisting.

Тож, що таке hoisting?

Hoist в перекладі з англійської - підйомник. Виходить, що hoisting - це підняття. А у Javascript - це механізм підняття вверх оголошення функцій (оголошених через function) і змінних (оголошених через var).

Набагато краще просто один раз побачити. Якщо напишете такий код:

console.log(x);
var x = 3;

У ньому не буде помилки, адже Javascript буде бачити отаке:

var x;
console.log(x);
x = 3;

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

Зараз, я вважаю, це погана практика, яка може збивати з пантелику. Тому можна додати "use strict", який трохи обмежить такі "фічі" Javascript.

Детальні можете глянути тут - читати статтю

#interview Відкрити / Коментувати

2022-07-05 21:02:51 Відкрити / Коментувати