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

Чат: @web_overflow_chat
Співпраця: @web_overflow_support
Автори: @lluchkaa & @anastasiia_tarasenko
加入频道
Reduce в JS

[🍔,🍟,🍕,🍿].reduce(eat)
>>
💩

Обіцяли - виконуємо. Тому, що ж з себе представляє метод reduce і з чим його їсти?

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

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

До речі, у статті можна залишати свої коментарі 😉

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

#article
👍35😁87🔥1😱1🤩1
👍7🤩2🥰1
Recharts

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

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

Тому, якщо вам потрібні графіки на ваш сайт або просто хочете попрактикуватись - можете сміливо використовувати recharts.

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

#library
👍346🔥3🤩1
Опитування

Всім привіт! Сьогодні хочемо з вами більше познайомитись і зрозуміти, які люди у нас тут зібрались. Тому підготували два невеличких опитування. Будемо дуже вдячні, якщо візьмете участь 💛
18👍4🥰1👏1
👍14👏6🤔3🔥1🤯1🤩1
9👍2👏1
Що таке polyfill?

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

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

А що б ви зробили, якщо, наприклад, знали, що в деяких користувачів не буде методу filter в масивах? Можна написати свою і використовувати її, правда ж? Це по суті і є поліфіл. Тут тільки уточнимо, що він буде додаватись прямо як метод масиву (через Array.prototype.filter). А ще правильніше, якщо компілятор вашого коду перевірить, чи є в цьому браузері такий метод, і якщо ні, то додасть його.

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

Якщо цікаво одним оком глянути на приклад, гляньте головну сторінку Babel
Також можете почитати більше про поліфіли - читати статтю

#interview
👍356🔥4😁2👏1
🤔10👍2🔥2🤯2👏1
🤯20👍13🤔7🔥31🥰1😁1
Тренди серед мов програмування

Тут буде чисто субʼєктивна думка про те, що є і буде досить популярне в сфері ІТ. Розповідаю лише про те, що мені хоч трохи знайомо.

Javascript/Typescript - все і вся фронтенду, та один із найсильніших гравців серед інших сфер програмування. Багато хейтерів, багато фанатів, але факти кажуть лише про те, що кількість програмістів, проектів, фреймворків і бібліотек лише росте.

Python - точно не менш трендовий від Javascript. Зараз він просто повсюди, штучний інтелект, системне програмування, бекенд і тд. Простий для вивчення, але потужний у використанні.

Dart - фреймворк Flutter вже нарівні конкурує з React Native. Я вже говорив, що це супер рішення для стартапів, коли одним махом закриваєте купу девайсів. Тому мобілка і є основною ціллю в цій мові.

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

Java - все ще працює на 3 мільярдах девайсів і дозволяє створювати моди на Майнкрафт (це я так жартую). А взагалі, є досить велика потреба в розробниках, які володіють цією мовою, в основному, здається, це бекенд або десктоп.

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

Go/Rust - досить нові гравці, які взяли все хороше та постарались виправити все погане в попередниках. Обидві досить продуктивні, багато людей переходять на них. Rust навіть був визнаний мовою, яка найбільше подобається розробникам на Stack Overflow.

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

А якщо вам цікаво подивитись різні графіки, яка мова де рулить і хто що використовує, можете глянути статтю на DOU чи Stack Overflow.

Читати статтю DOU
Читати статтю Stack Overflow

#experience
31👍18🔥3🥰1👏1
👍51🔥1🥰1🤔1🤩1
Що таке ORM?

Або як працювати з базою даних, не використовуючи прямих запитів до неї.

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

Без використання ORM пошук жовтого покемона виглядав би десь отак:

data = query(“SELECT pokemon FROM pokemon_table WHERE color = ‘Yellow’”)
while (pokemon = data.next()) {
do_something_with(pokemon)
}

А з використанням ORM все буде трохи простіше:

pokemons = Pokemon.query(color=”yellow”)

Помітили, що немає самого SQL-запиту?

Все, що вам потрібно зробити - це створити клас, який опише певну сутність в базі даних. А тоді сама бібліотека ORM надасть вам інтерфейс для роботи з базою.

Безумовно є ряд переваг і недоліків. І от саме ця простота в користуванні, відсутність повторень в написанні запитів виглядає круто.

В кожній мові реалізовані свої бібліотеки, з тих що мені знайомі це:
- JS - TypeORM, Sequalize, Prisma (яка зараз досить сильно набрала популярність);
- Python - Django ORM, SQLAlchemy;
- C# - Entity Framework;
- Go - GORM;
… і багато інших.

Якщо ви працюєте з базою даних - навряд чи вийде оминути цю техніку. А якщо ще не встигли - саме час спробувати.

Більше можете почитати тут - читати коментар

#article
👍364🔥3🤔3😁1🤩1
Сортування - тип алгоритмів, який використовується чи не найчастіше. З курсу університету чи будь-якого іншого курсу основ програмування ви знаєте, що існує багато алгоритмів з різними швидкостями і складностями. Але вивчати їх за псевдокодом чи описом ітерацій буває іноді складно для розуміння. Тому ділимось відео, в якому наочно продемонстровано різні види сортування.

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

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

#tips
👍33🔥43👎1👏1🤔1🤯1
Як часто вам доводиться говорити з замовниками? І як часто ви уникаєте цього через страх говорити англійською?

У нас уже давно немає такої проблеми завдяки @speakyclub. (Правда Юра каже, що мене тепер неможливо заткнути).

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

Щойно з’явилося кілька у групах рівня В2 та А2 - одразу шейримо з вами!

Просто напишіть:
- у телеграм Яні
- або в інстаграм

P.S: Якщо вас цікавить інший рівень, можете все одно кинути їм заявку. Вони майже щотижня створюють нову групу.

Одне заняття коштує всього 180 грн 🔥
11👍5🤩3👎1🔥1🥰1👏1
9🤩2👍1🤔1
Як працює Garbage Collector?

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

Якщо ви працювали з С++, то ви маєте уявлення, яким болем чи заморочкою іноді може стати виділення і очищення памʼяті. Тому сьогодні поговоримо про Garbage Collector - механізм, який в нових мовах дуже активно використовується.

Насправді, саме виділення чи очищення памʼяті - це не проблема, в ОС вже є потрібні функції. Основна проблема в тому - які обʼєкти вже можна видаляти з памʼяті, а які ще потрібно залишити.

Основною концепцією Garbage Collectorʼа (зокрема в JS) є досяжність. Якщо до якогось обʼєкта неможливо доступитись (він недосяжний), тоді його можна видалити з памʼяті. Тож як Збирач Сміття розуміє хто є хто?

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

Ці помітки потрібні для того, щоб розуміти, кого точно видаляти не потрібно, а також, щоб запобігти вічним циклам, так як обʼєкти можуть циклічно посилатись один на одного. І коли закінчиться пошук (не буде нових непомічених обʼєктів, до яких можна доступитись), всі непомічені обʼєкти будуть видалені.

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

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

#interview
👍263🔥1👏1🤔1
👍123🔥1👏1🤔1
Що виведе консоль?
Anonymous Quiz
5%
1 1
10%
2 2
31%
1 2
54%
2 1
👏21👍73🤔2🤯1
🔥61👍1🥰1👏1