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

Чат: @web_overflow_chat
Співпраця: @web_overflow_support
Автори: @lluchkaa & @anastasiia_tarasenko
Download Telegram
CSS changed 🟣

Перше, що варто зазначити, — CSS отримав нове лого. Історія походження цього кольору справді унікальна. Щоб дізнатися більше, перегляньте відео нижче.

Бонусом: Fireship розповідає про фічі CSS, які мало хто знає, але більшість із них вже стали або незабаром стануть стандартними у браузерах.

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

#tips
👍9🔥41
Welcome!

Let's practice our English! So...

👉 What’s one thing you wish people would stop doing on social media?

Have a nice #english_friday 💛
👍71
This media is not supported in your browser
VIEW IN TELEGRAM
#how_to створити frying pan preloader 🥘

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

👉 Відкрити посилання
👍11🔥5🤯1
Database Normalization 🤓

Якщо вам раптом доведеться працювати з базою даних, обов'язково потрібно знати, як правильно її спроектувати. Хороший дизайн БД, зокрема нормалізація, — саме про це розповідає автор у відео нижче.

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

#interview
👍116
👍5🤔3
🤔7👍4
Welcome!

Let's practice our English! So...

👉 If you had to choose one color to describe your personality, what color would it be and why?

Have a nice #english_friday 💛
👍43
Advent of Code 2024 🎄

Advent of Code - це різдвяний календар невеликих головоломок з програмування для різних рівнів підготовки, які можна розв'язати будь-якою мовою програмування, яка вам до вподоби.


Тому від сьогодні і протягом наступних 24 днів о 7 ранку за нашим часом відкриватиметься нова комірка з цікавими завданнями.

Як це працює?

1. Відкриваєте веб-сайт Advent of Code, знаходите завдання, яке ще не розв'язали.
2. Читаєте історію та завдання.
3. Логінитесь через будь-який зручний сервіс, щоб отримати свій варіант вхідних даних.
4. Найцікавіше — пишете код.
5. Вводите результат на веб-сайті. Якщо відповідь правильна, отримуєте зірочку та ще одне бонусне завдання.
6. Після цього залишилося найскладніше — чекати на наступний день.

Сьогоднішнє завдання коротко.

Є файл із числами, у кожному рядку — по два числа (тобто дві колонки чисел). Потрібно вертикально відсортувати числа, після чого знайти суму різниць чисел кожного рядка.

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

Ставте 👍, якщо плануєте брати участь в Advent of Code цього року. А також, надсилайте свої варіанти рішень в коментарі.

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

#aoc
👍14🔥32
Чи було б вам цікаво бачити завдання з Advent of Code 2024 у нашому каналі?
Anonymous Poll
86%
Так 🤩
14%
Ні
👍41
Advent of Code 2024, Day 2 🎄

Сьогоднішнє завдання коротко: ви працюєте з даними з атомної електростанції. Є файл, у якому кожен рядок описує звіт — рядок чисел, розділених пробілом. Звіт вважається безпечним, якщо числа строго впорядковані за зростанням або спаданням, і кожні два сусідні числа мають різницю, що більша за 0, але менша або дорівнює 3. Тож скільки безпечних звітів у файлі?

*Завдання із зіркою: псевдобезпечний звіт (в оригіналі — з амортизатором). Механізм пропускає звіти, якщо вони не є безпечними за попередніми правилами, але стають такими при відкиданні одного елемента.

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

#aoc
👍5🔥2
Advent of Code 2024, Day 3 🎄

Сьогоднішнє завдання коротко: працюємо з текстом, а саме - шукаємо інструкції у форматі mul(x,y), де x та y - це числа, що містять від 1 до 3 цифр у десятковому записі. Потрібно знайти добуток кожної такої пари чисел, а потім обчислити суму цих добутків.

Завдання із зіркою:
у тексті також є інструкції do() та don't():
- do() "вмикає" інструкцію mul;
- don't() "вимикає" mul.

Тобто, якщо в тексті зустрічається don't(), усі наступні добутки для mul не обчислюємо, доки не натрапимо на do(). За замовчуванням mul увімкнений.

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

Надсилайте свої варіанти рішень в коментарі. А також нагадуємо, що створили власний Leaderboard, тому долучайтесь! 💛

Код: 3111715-18668836

#aoc
👍6🔥2
Advent of Code 2024, Day 4 🎄

Сьогоднішнє завдання коротко: у тексті потрібно знайти всі слова XMAS та кількість їх входжень, які можуть бути записані горизонтально, вертикально або по діагоналі в усіх напрямках.

Завдання із зіркою:
знайти входження двох слів MAS, які формують X:
M M S S M S S M
A A A A
S S M M M S S M


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

#aoc
🔥4👍1
👍4😁2
Advent of Code 2024, Day 5 🎄

Сьогоднішнє завдання коротко: вхідний файл розділений на дві частини. Перша частина - це інструкція щодо порядку двох елементів у форматі XX|YY, де XX та YY - числа. Ця інструкція вказує на те, що число XX має бути перед YY у списку. Друга частина - це самі списки чисел (один список у кожному рядку). Обидві частини розділені порожнім рядком. Потрібно знайти правильно посортовані списки та обчислити суму медіан цих списків.

Завдання із зіркою: потрібно знайти неправильно посортовані списки, виправити порядок та знайти суму медіан цих списків.

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

Працювати з завданнями безпосередньо на сайті Advent of Code набагато цікавіше, адже до кожного з них є ціла історія!


#aoc
4👍2
Welcome!

Let's practice our English! So...

👉 Have you been nice this year and did you receive any gifts? What kind?

Have a nice #english_friday 💛
3😁3👍1
Advent of Code 2024, Day 6 🎄

Сьогоднішнє завдання коротко: текстовий файл представляє мапу, де кожен символ є окремою клітинкою. Пробіл позначає вільну клітинку, # - перешкоду, ^ - початкову точку сторожа. Сторож рухається по мапі, а у випадку зустрічі перешкоди повертає праворуч. Початковий напрямок руху сторожа - вгору. Скільки окремих клітинок відвідає сторож на своєму шляху, перш ніж вийти за межі мапи?

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

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

❗️Нагадуємо: код до приватного Leaderboard - 3111715-18668836

#aoc
👍43
React 19 🥳

🎉 - Нарешті! 🥴 - Знову?

Так, так, React 19 нарешті стабільний і готовий до використання! Забирайте свої forwardRef, Context.Provider та useContext. Швидко вивчайте екшени та серверні компоненти.

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

Які з усіх оновлень вам було б цікаво розібрати разом? І що ви взагалі думаєте про нову мажорну версію? 💸

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

#news
🎉9🥴71🤯1
Advent of Code 2024, Day 7 🎄

Сьогоднішнє завдання коротко: дано число target та масив чисел nums. Чи можливо розставити знаки + та * між числами nums так, щоб результат був рівний target?

Важливо: операції виконуються зліва направо, множення не має пріоритету над додаванням.

Завдання із зіркою:
додатково вводиться ще одна операція — конкатенація двох чисел. Чи можливо тепер отримати потрібний результат?

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

#aoc
👍5🤯2
Advent of Code 2024, Day 8 🎄

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

Сьогоднішнє завдання коротко: дано двовимірну мапу міста, де кожен символ — антена (окрім .). Сам символ означає частоту. Кожна пара антен з однаковою частотою має дві точки пучності. Для двох антен A і B з однаковою частотою точки пучності розташовуються:
- На прямій AB.
- У точках, дзеркально відображених відносно антени (точка, симетрична точці B відносно точки A, і навпаки).

Потрібно визначити, скільки унікальних точок пучності існує на мапі.

Завдання із зіркою:
Точки пучності знаходяться не лише на відстані вдвічі більшій за відстань між парою антен, а й на всій прямій, де розташовані антени, з постійним кроком, рівним відстані між антенами (обчислювати лише в межах мапи).

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

#aoc
4👍2🤯2
Advent of Code 2024, Day 9 🎄

Сьогоднішнє завдання коротко: дано доооовгий рядок, який відображає пам’ять диска. У рядку присутні тільки цифри. Перша цифра позначає кількість пам’яті, яку займає файл із ID=0, друга цифра позначає кількість вільної пам’яті, третя цифра — кількість пам’яті файлу з ID=1 і т. д.

2233133 => 00..111...2...333

1. Потрібно дефрагментувати диск: беручи файли з кінця, потрібно заповнити вільну пам’ять від початку диска.
00..111...2...333 => 003311132

2. Після цього обчислити чексуму: суму цифр у кожній комірці пам’яті помножену на індекс комірки.

⁉️ Яку структуру даних ви оберете для виконання такого завдання?

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

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

❗️ Створюйте git-репозиторій, опублікуйте його та поділіться посиланням у коментарях.

#aoc
2👍1