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

Чат: @web_overflow_chat
Співпраця: @web_overflow_support
Автори: @lluchkaa & @anastasiia_tarasenko
加入频道
#todo написати функцію на будь-якій мові програмування, яка на вхід приймає число N і на вихід повертає масив з першими N простими числами.

Наприклад, 5 => [2, 3, 5, 7, 11]
👍5🔥2🤔2😱2
New AI 23.03 😱

Поки ви читаєте цей пост, хтось анонсує новий супер-штучний інтелект. Але його ж багато не буває, тому сьогодні ми до вас знову з новинами.

На днях Google вступив в боротьбу з ChatGPT і вже відкриває доступ до Bard. Хоч він все ще з поміткою Experiment, ви все одно можете залишити свою заявку. Не спішіть радіти, адже України в списку немає, проте не сумніваюсь, що вже сьогодні будуть обхідні шляхи.

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

Не відстає і GitHub, який з анонсом Copilot X спробує захопити нішу саме розробників. Тут для вас одразу кілька варіацій. Можна спілкуватись у вже звичному форматі чату, отримати допомогу при роботі з документаціями або ж з Pull Requests, чи навіть попрацювати з ним з командного рядка.

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

#todo відгадати, скільки ще нових революційних штучних інтелектів ми побачимо до кінця тижня 😅

#news
😁8👍63🔥1
Welcome 👋

Let's practice our English! So...

👉 Tell us about your biggest mistake (fuckup) in the IT industry (at work, during learning). How did the situation finish?

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

Have a nice Friday! 💛

#english_friday
👍102🔥2🤔1
Zustand

Якщо вам потрібен менеджер стану для React, і ви віддаєте перевагу простоті, то Zustand стане чудовим рішенням. Це компактна бібліотека, яка надає інтуїтивний інтерфейс для роботи зі станом у React.

Однією з ключових переваг є саме простота: робота з Zustand схожа на використання звичайних хуків, тому вам не потрібно вчити нові підходи чи писати шаблонний код. Зокрема, дозволяє легко використовувати Immer, що істотно спрощує роботу з вкладеними об'єктами.

Отже, якщо ви шукаєте новий інструмент для роботи зі станами, обов'язково спробуйте Zustand!

👉 Читати документацію

#tips
👍133🔥3🤔3
This media is not supported in your browser
VIEW IN TELEGRAM
#todo розшифрувати текст з візуального відображення.
👍6🤯4🤔32😁1
Zapier 🔥

Github, Notion, Slack, Discord, Gmail, Jira/Trello, і це тільки початок списку сервісів, які стають нашою повсякденною рутиною. А чи задумувались ви над тим, щоб автоматизувати їх роботу між собою? Наприклад, коли хтось створює тікет в Jira, потрібно відправити повідомлення в канал у Slack.

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

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

#tips
👍134🔥4🤔3
Що таке React Suspense?

Памʼятаємо, що в React 18 нам підвезли concurrent mode, який може паралельно рендерити ваші компоненти.

React Suspense - це компонента, яка дозволяє показувати резервний варіант (наприклад, індикатор завантаження), поки його дочірні компоненти ще завантажуються. Виглядає це приблизно отак:

<Suspense fallback={<p>loading…</p>}>
<Children />
</Suspense>


Зараз такий функціонал використовується у двох випадках: для компонент, які обгорнуті в React.lazy, та у таких фреймворках як Next.js, Remix чи Relay. Проте з часом планують додавати нові способи використання Suspense.

👉 Читати більше

А ще, забігаючи наперед, в експериментальній версії React ви вже можете спробувати нові хуки: use та useEffectEvent. Звісно, вони ще можуть сильно змінитись, але ви вже можете слідкувати за їх розробкою.

А от саме хук use працює у парі з Suspense і дозволяє дочекатись завантаження ваших даних.

👉 Дивитись відео про use
👉 Дивитись відео про useEffectEvent

#interview
👍14🔥4🤔32👌2
👍53🔥2🤔2
👍13🔥4🤔4🤣32
#todo написати функцію на будь-якій мові програмування, яка на вхід приймає масив та число N і на вихід повертає новий масив, який утворився з циклічного зсуву оригінального масиву на N позицій вправо.

Наприклад:
[1, 2, 3, 4, 5], N=1 => [5, 1, 2, 3, 4]
[1, 2, 3, 4, 5], N=2 => [4, 5, 1, 2, 3]
🤔10👍6😱3🤯2🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Bard

На днях я отримав доступ до Bard - чат з штучним інтелектом від Google. Зараз він працює тільки в США та Об'єднаному Королівстві. Це ще досі експерементальний режим, проте цікаво, куди це все піде з урахуванням баз даних Google.

І ще коротка новина: Ілон Маск, Стів Возняк та інші відомі люди, які мають відношення до даної індустрії, написали листа з проханням призупинити розробки систем ШІ через ризики 🤔

#news
13🤔9👍6🔥2
Welcome 👋

Let's practice our English! So...

👉 Tell us about stereotypes about programmers that you think are truth/lie.

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

Have a nice Friday! 💛

#english_friday
🔥5👍32🤔1
Jotai 👻

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

Jotai - бібліотека React, що використовує атомарний підхід до роботи з глобальним станом. З нею ви зможете відчутно зменшити кількість простих Context у своїх застосунках. Створіть атом у глобальному просторі і використовуйте його за допомогою useAtom.

Також ви отримуєте багато різних допоміжних утиліт, наприклад: зберігання стану в localStorage/sessionStorage, робота з асинхронними даними та інші.

👉 Читати документацію

#tips
👍83🔥3🤩1
Хей-хей 👋

Друзі, беремо на тиждень відпустку. Хочемо набратися сил і повернутись до вас з новими ідеями та корисними матеріалами. У разі чого, ми завжди на звʼязку в чаті 💛
27👍12🔥4
Привііііт 👋

Дуже за вами сумували! І за традицією тиждень починаємо з цікавої задачки 💛

#todo знайти приховану помилку в коді, пояснити та виправити її.
👍93🤔3🔥2🎉1
ts-reset 🧽

Якщо ви працюєте з TypeScript, ви могли помітити, що в деяких місцях він присвоює неочікувані типи. Не завжди виходить отримати бажаний тип, коли використовуєте .filter метод з Boolean, або коли хочете перевіряти константний масив на деякі значення, або коли виконуєте JSON.parse і отримуєте any, тощо.

Matt Pocock створив корисний модуль, який допоможе вам виправити такі помилки. Все, що потрібно зробити - додати один імпорт в свій застосунок. Ви навіть можете інсталювати цей модуль як devDependency, адже в ньому містяться лише типи.

Співіснуйте з TypeScript в гармонії 💛

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

#library
👍136🔥2
Що таке webhooks? 🪝

Веб-хук - це спосіб, за допомогою якого кілька застосунків можуть спілкуватись між собою. Система, яка буде отримувати дані, оголошує URL-ендпоінт, за яким буде чекати повідомлень. У такий спосіб ви можете обробляти події без необхідності постійного опитування або перевірки оновлень. Коли у системі-джерелі виникає певна подія - вона відправить HTTP-запит з необхідними даними до системи-отримувача.

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

Ще такий спосіб дуже зручний для створення різних автоматизацій та інтеграцій. Тому, багато сучасних застосунків підтримують веб-хуки і ви легко можете додавати свій функціонал.

#interview
👍284🔥3😱1💯1
🔥7👍31
👍166🔥5🤔2
#todo написати функцію на будь-якій мові програмування, яка на вхід приймає масив та число N і на вихід повертає новий масив, який складається з підмасивів довжиною N.

Наприклад:
[1, 2, 3, 4, 5], N=1 => [[1], [2], [3], [4], [5]]
[1, 2, 3, 4, 5], N=2 => [[1, 2], [3, 4], [5]]
[1, 2, 3, 4, 5], N=3 => [[1, 2, 3], [4, 5]]
👍6🤔42🔥1👌1
Програмістом можна стати самостійно, частина 2 💻

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

👉 Читати частину 1

Ну що ж, почнемо:

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

MDN - це веб-сайт з документаціями, статтями та ресурсами для веб-розробників. Сайт містить детальну інформацію з веб-технологій, таких як HTML, CSS, JavaScript, Web APIs та інших.

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

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

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

#tips
👍346🔥41💯1