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

Чат: @web_overflow_chat
Співпраця: @web_overflow_support
Автори: @lluchkaa & @anastasiia_tarasenko
加入频道
Google I/O 2023 🎉

Вчора пройшла Google I/O 2023 презентація і було продемонструвано багато цікавих оновлень.

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

Розвиток відбувся не тільки у самому ШІ, Google буде інтегрувати його в свої сервіси, що полегшить роботу користувачам.

Також Bard став доступним у більш ніж 180 країнах (України там немає 😡). А якщо ви живете в США, то взагалі можете спробувати ШІ, який вбудований у стандартний пошуковик Google.

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

Загалом, цікаво буде всім 💛

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

#news
👍142🔥2
Welcome 👋

Let's practice our English! So...

👉 Do you think diploma is important for programmer and why?

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

Have a nice Friday! 💛

#english_friday
👍52🔥1
Що таке Big O? 😮

Big O нотація описує складність або ж ефективність алгоритмів чи структур даних. Такий підхід можна використовувати для позначення необхідної кількості часу чи, наприклад, памʼяті. У такому записі позначають саме верхню межу, або ж найгірший сценарій виконання.

Давайте пройдемось по прикладах:

O(1) - постійний час: алгоритм займає постійну кількість часу або пам'яті, незалежно від розміру вхідних даних. Наприклад, час діставання першого елемента з масиву не залежить від його розміру.

O(log n) - логарифмічний час. Зазвичай спостерігається в алгоритмах, які багаторазово ділять вхідні дані навпіл, наприклад, у двійковому пошуку. Коли розмір вхідних даних подвоюється, алгоритму потрібно виконувати лише постійну кількість додаткових операцій.

O(n) - лінійний час: час виконання алгоритму або використання памʼяті зростає лінійно зі збільшенням розміру вхідних даних. Найпростіший приклад - перебір усіх елементів у масиві.

O(n^2) - Квадратичний час: час виконання алгоритму або використання пам'яті зростає квадратично зі збільшенням розміру вхідних даних. Така складність спостерігається у алгоритмах з вкладеними циклами, наприклад, бульбашкове сортування чи сортування вибіркою. Відповідно, при трьох вкладених циклах складність буде O(n^3) і тд.

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

#interview
👍233🔥1😱1
👍92🔥2
Що виведе консоль?
Anonymous Quiz
48%
false false
11%
false true
27%
true false
14%
true true
👍20🤔9😱52🔥1👌1😐1
#todo написати функцію на будь-якій мові програмування, яка на вхід приймає масив чисел arr та число target, і на вихід повертає true, якщо у масиві arr є пара чисел, сума яких рівна target, в іншому випадку повертає false.

* завдання з зірочкою - пройтись по масиву тільки один раз 😉

Наприклад:
[1, 2, 3], 4true
[1, 2, 3], 5true
[1, 2, 3], 6false
👍7😱1
Welcome 👋

Let's practice our English! So...

👉 What is the best advice you've ever heard about programming learning?

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

Have a nice Friday! 💛

#english_friday
👍112🔥1
IT-Alias 🧩

Пропонуємо зіграти в alias, суть якої, полягає в поясненні слова іншим партнерам, не вживаючи самого слова.

Правила наступні: хто перший відгадав, той пояснює наступний ІТ-термін. Прохання до тих, чия черга загадувати - будьте на звʼязку, допоки хід не перейде до наступної людини 💛

Тож почнемо: css-властивість, яка спадає на думку, коли налили забагато води в стакан.
🔥84👍4
Маємо для вас невеличке оновлення! 🫣

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

Як це буде відбуватись?

Ви надсилаєте свій пост до нас в @web_overflow_support і ми будемо публікувати його в канал. Звичайно, він може підлягатись невеличкому редагуванню і перевірці на актуальність. Пости будуть маркуватись хештегом #post_from, після якого буде вказано ваш нік в телеграмі.

Навіщо це нам?

Ми ніколи не приховували, що ми не є експертами в усіх технологіях світу. І не рідко ми бачимо запити від підписників, які хочуть матеріали по фреймворкам, які ми в очі не бачили. А нам хочеться, щоб цей блог приносив користь всім!

Тому давайте ділитись знаннями та розвиватись разом! 💛
🔥20👍83🤯1
Що таке service workers? 👨‍🔧

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

Давайте розглянемо деякі особливості роботи service workers:

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

Перехоплення мережевих запитів. Service worker може перехоплювати запити, які ініціює веб-сторінка. Завдяки цьому вони можуть, наприклад, підмінювати відповідь, ну і відповідно, таким чином, реалізовувати кешування.

Офлайн-підтримка. Це одна з великих переваг service workers. Кешуючи HTML, CSS, JS та інші ресурси веб-сторінки, ви можете забезпечити її завантаження навіть за умови відсутності зʼєднання з мережею.

Push-сповіщення. Завдяки фоновому режиму роботи, service-worker може отримувати сповіщення від серверу та показувати їх користувачеві, навіть коли сторінка невідкрита, подібно до нативних застосунків.

Загалом, service workers - це потужний механізм для вдосконалення веб-застосунків, що робить їх важливою частиною розробки.

#interview
👍194🔥3
👍84🔥3
Що виведе консоль?
Anonymous Quiz
22%
6
13%
[1, 2, 3]
20%
[1, 3, 5]
45%
NaN
👍19🤯53🔥1
#todo знайти всі локації неподалік 🗺

Потрібно написати функцію на будь-якій мові програмування, яка на вхід приймає масив локацій типу { lat: number; lng: number }, поточну локацію типу { lat: number; lng: number } та радіус числового типу. Функція має повернути відфільтровані локації, які знаходяться у даному радіусі від поточної локації.
👍52🔥1
Як швидко перейти з однієї технології на іншу? 🤯

Передісторія: на початку травня замовник вирішив, що нам терміново потрібен мобільний застосунок. Разом з командою ми обрали Flutter. Найцікавіше те, що він вирішив, що його повинні писати я та Юра, хоча я ніколи не писала на мобілку, і про це йому неодноразово говорила. Тому я повинна була швидко в ньому розібратись та почати допомагати Юрі в розробці. Проблема ще була в тому, що Flutter використовує мову програмування Dart, тобто я повинна була спочатку вивчити нову мову, а потім вже новий фреймворк.

В мене було зовсім мало часу і ось їм план дій:

1. Знайти статті, які допоможуть розібратись з новою технологією на базі тих, які ти вже знаєш. В моєму випадку, я почала читати статті, в яких пояснюється в чому схожість та відмінність JavaScript і Dart, Web-розробка і Flutter-розробка тощо. Ці статті швидко допомогли мені збагнути, які моменти я знаю зі свого досвіду, а які принципи для мене зовсім нові, і я повинна звернути на них увагу.

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

3. Брати таски. Після того я відразу почала працювати над функціоналом, який не є початковим у нашому застосунку, тому я мала час повільно, але впевнено його робити. Було складно, вилазило багато моментів, про які я взагалі не здогадувалась, кожен новий елемент я гуглила, 100500 раз розказувала, що більше ніколи не проміняю JavaScript, але не дивлячись на це, завдяки практиці, я швидко вчилась.

Вкінці я отримала крутий досвід та результат - Mobile UI is absolutely epic! I can't believe you've only been working with Flutter for a few weeks. Both you and Yurii are incredibly talented. We always appreciate your help!!

#experience
👍28🔥97😱2👏1
Welcome! 👋️️️️️️
Let's practice our English! So...

👉 What would you do in your free time, if you had enough money for the rest of your life?

Have a nice #english_friday 💛
👍103🤔2🔥1
Clerk 👨‍💻

Сьогодні знову про авторизацію.

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

Будемо чесними, ми ще не встигли його добре протестувати, але виглядає багатообіцяюче 🤩

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

#tips
👍172🔥2🤔1
Нас попросили нагадати, що у нас є чат - @web_overflow_chat 💛
7😁2😱2🔥1
JSDoc 📄

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

Приклад такого коментаря можна побачити на прикріпленому фото. Окрім @param та @return там можна знайти ще дуже велику кількість тегів.

Дізнатись більше про коментарі та їх можливості ви можете за посиланням нижче.

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

#tips
👍134🔥1
Увага! Шукаємо React-розробника з досвідом 13 років 😅

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

Тому сьогодні хочемо поділитись крутою статтею, яка дозволить вам якісно оптимізовувати свій код на React і використовувати його можливості на максимум 💛

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

#interview
😁34👍16🎉21