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

Чат: @web_overflow_chat
Співпраця: @web_overflow_support
Автори: @lluchkaa & @anastasiia_tarasenko
加入频道
Що виведе консоль?
Anonymous Quiz
8%
3
36%
6
30%
[Function add]
26%
Error
🔥6🤯5👍2🤔2🐳21👌1
Welcome 👋

росія - країна гній, але це не завадить нам підтримати нашу традицію! Тому…

👉 Tell us what is the first thing you will do after the end of the war and win of Ukraine (except drinking 😅)?

Як завжди, можете писати свої відповіді тут або в чаті.

Have a nice Friday! 💛

#english_friday
🔥33👍75🙏2
Привіт 👋

Як нам всім відомо, найкраще вивчати програмування на практиці. Тому ділимось з вами крутими іграми для вивчення CSS.

CSS Diner практикуйте CSS селектори у цікавому форматі.
CSS Battle використовуйте свої навички CSS, щоб відтворити картинку за допомогою HTML/CSS.

👉 Хто пропустив, для вивчення Flexbox та Grid у нас також була своя підбірка - відкрити пост

Зберігайте! 💛

#tips
👍27🔥65🥰2🤩2🏆1
👍6🔥43🤔2🤯2
Що виведе консоль?
Anonymous Quiz
28%
1
27%
2
33%
[1, 2]
12%
Error
👍20🤯14🤔52🔥2
🚀 Знайшли для вас новий крутий сервіс для пошуку роботи - Otta

На жаль, ситуація на ринку не покращується, а навіть навпаки. Вже чуємо історії, що навіть сіньйорів запросто звільняють з компаній. Тому такі сервіси як ніколи вчасно.

Otta - це платформа для пошуку роботи на основі машинного навчання, яка використовує ваші зарплатні очікування, кар'єрні цілі та скіли, щоб підібрати вам найкращі вакансії. Там можна знайти багато пропозицій від топових компаній. Тому, напевно, даний сервіс більше підійде для програмістів рівня middle-senior, але завжди можна спробувати щось підібрати і для нижчого рівня.

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

#tips
👍73🔥2🤩1😍1
Good Morning!

Let's practice our English! We have soooo important topic for you. It is ...

👉 How do you manage your work with blackouts? And how do you feel about this reality? Also, you can share some photos if you want!

Як завжди, можете писати свої відповіді тут або в чаті.

Have a wonderful Friday! 💛

#english_friday
8👍5🔥2
Drag and drop

У вас коли-небудь були таски, в яких треба було розробити drag & drop? Особисто мені траплялись лише нескладні випадки, такі як drop файлів для завантаження або ж перетягування кораблика на поле у морському бої. А от коли доведеться, наприклад, зробити копію дошки з Trello чи Jira - буде вже трохи важче.

Ну і звісно ж потрібно буде шукати якусь бібліотеку в допомогу. І тут порадимо вам передивитись коротке відео (всього лиш 184 секунди з вашого дня 😉), у якому зможете отримати підказки, що ж краще використати, а що вже застаріло і краще пропустити.

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

#library
👍209🔥3🥰2👏1🤩1🐳1
🇺🇦 З Днем Збройних Сил України!

Дякуємо ЗСУ, за можливість жити в себе вдома.
Дякуємо ЗСУ, що в України є майбутнє.
Дякуємо ЗСУ, що ми можемо планувати свій день.
Дякуємо ЗСУ, що сьогодні ми пішли на роботу.
Дякуємо ЗСУ, що в моменти відчаю нагадуєте, що все буде Україна.
Дякуємо ЗСУ, що віддаєте найцінніше, щоб ми могли жити під українським прапором та розмовляти українською мовою.

Дякуємо за те, що ви є.
За те, що ви обираєте.
За те, що ви виборюєте.

Пишаємось Вами!
50👍8🥰6👏2🕊1
5👍3🔥2👏2
React: Class vs Functional

Ні для кого не секрет, що в React є два способи написання компонент - класи та функції. Тому часто на інтервʼю бувають питання про різницю даних підходів.

Давайте розбиратися...

Хуки в React зʼявились відносно нещодавно. Відповідно, функційний підхід дозволяв лише використовувати пропси та повертати JSX елемент. Хочеш стейт - використовуй класові компоненти. Це вже залишилось в історії, а що ж відмінного зараз?

- Функційна компонента - це просто функція, а от клас обовʼязково має наслідувати базовий клас компоненти з React (напишіть в коментарі, які класи ви знаєте).
- Логічно, що у функціях немає конструктора, а в класах є.
- Також відмінністю є те, що класова компонента має методи життєвого циклу, а функційна - хуки. Тут трохи різні підходи, але в кінці ми отримуємо однаковий функціонал.
- Продовжуючи тему методів - в класів є методи, які перехоплюють помилки (можете загуглити Error Boundaries).
- На кінець, додам ще одне - React.forwardRef працює лише на функціях, тому якщо хочете передати ref в класову компоненту - обгортайте її перед тим ще і у функцію.

А щоб ви були максимально впевненими в собі відповідаючи на таке питання на інтервʼю - прикріпляємо статтю.

Читати статтю

#interview
👍214🔥2👏2🤔1🤯1
👍5🔥4🤯2👏1🤔1
Що виведе консоль?
Anonymous Quiz
51%
(1, 2, 3) 1
25%
1 3
7%
3 1
18%
Error
🤯29🔥9👍5🤔4🐳4👏1💯1
Якщо хтось буде питати, то ми тепер магістри 👨‍🎓👩‍🎓
🎉83🔥7🤩4👏2
Favicon media

🤫 Псс... коли будете додавати favicon до проекту, перевірте, як воно виглядає на темній і світлій темі системи. Трохи непрактично показувати білу іконку на білому фоні. А як це можна виправити - дізнайтесь з тіктоку на YouTube (та-та, заохочуємо вас дивитись тільки корисні тіктоки!!)

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

#tips
12👍8🔥2👏1🤩1
Hello 👋

We want to know more about you guys. So...

👉 Do you have some hobbies except IT. What do you like to do in your free time?

Як завжди, можете писати свої відповіді тут або в чаті.

Have a wonderful Friday! 💛

#english_friday
👍106😁3🔥1👏1
SemVer + CHANGELOG

Чи помічали ви коли-небудь "нотатки", коли оновлювали додаток в App Store чи Play Market? Часто там можна побачити щось таке, як "Bug Fixes", або ж зміни, що були додані в новій версії, описані людською мовою. Такі деталі зберігаються в файлику CHANGELOG, в якому від версії до версії описано, що ж було додано, змінено чи видалено.

До речі, якщо говорити про самі версії, там зазвичай є три числа, записаних через крапку. Коли і як їх потрібно змінювати? Тут рекомендуємо коротко переглянути такий підхід як Семантичне Версіонування (SemVer).

Прикріпляємо для вас документації/статті українською мовою:

Читати про CHANGELOG
Читати про SemVer

#article
👍86🔥4👌2👏1
any vs unknown vs never

Привіт, привіт! 👋
Трішки пропадаєм, щось багато всього навалилось. Будемо виправлятись!

Сьогодні пропонуємо розібратись між деякими типами в Typescript, а саме з any, unknown та never. Зазвичай про any знають найбільше, а хочеться навпаки 🥲

- any - це повне відкидання типізації, робіть з обʼєктом що хочете, на свій страх і ризик. Навіщо вам тоді взагалі Typescript?
- unknown - це така собі загадка, якщо хочете щось з нею зробити - розгадуйте. Можна через typeof або type predicates (про які ми вже колись писали). А ще це "база" всіх типів, про це почитаєте нижче.
- never - в змінну такого типу не можна ні присвоїти значення, ні використати його. Який тип має повертати функція, яка завжди кидає помилку?

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

Читати статтю

#interview
13👍4🔥2🎉1🤩1
👍62🔥2🤔1
👍19🤔52🔥2