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

Чат: @web_overflow_chat
Співпраця: @web_overflow_support
Автори: @lluchkaa & @anastasiia_tarasenko
加入频道
Методи масиву

Про методи масиву доволі часто запитують на різних співбесідах. І це не дивно, адже дуже часто ми працюємо саме з масивами даних. Завджи потрібно щось вставляти, видаляти, змінювати чи обчислювати. І Javascript дає багато методів для роботи з цією структурою даних. Ви не маєте знати їх всі напам'ять, але назвати хоча би декілька потрібно.

Тому зараз ми коротко розглянем основні з них:

.push - вставка в кінець масиву;
.pop - видалення з кінця масиву;
.splice - видалення і вставка всередину масиву;
.slice - отримання підмасиву з масиву. Коли у вас є масив із 100 елементів, а вам потрібні тільки елементи від 20 до 30 - користуйтесь цим методом;
.forEach - проходження циклом по масиву. Всередину передайте функцію, яка буде працювати з кожним елементом;
.indexOf - якщо вам потрібен індекс конкретного елементу з масиву - ця функція саме для вас;
.find, .findIndex - якщо вам потрібно за певними параметрами знайти елемент або його індекс, створіть функцію-предикат (функція, що повертає boolean) та використайте ці методи;
.map - коли вам потрібно з одного масиву створити інший, змінивши елементи;
.filter - допоможе вам профільтрувати масив, а саме створити новий тільки з елементів, які вам "підходять";
.reduce - дослівно зменшує ваш масив. І зменшує він його в одну змінну, тільки вам треба описати як це зробити. Це може бути просто сума елементів, добуток чи створення іншого обʼєкту з вашого масиву.

Детальніше про методи масивів - читати статтю

#interview
👍406🔥5👏1
🤔10🤯5👍31🔥1
🤔19👍102🔥2👎1👏1🤯1
3👍3🔥1🤩1
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