Як кажуть в коментарях - на каналі про React обрали відео про React. Оце несподіванка 😂

Ну що ж - значить будемо щось кодити на React. Наразі у мене є три варіанти:

1️⃣ Зробити UI для ланцюгів Маркова (пра-пра-пра бабка Chat GPT)
2️⃣ Зробити симуляцію нашого сусіда - з повенями, катастрофами і усім таким іншим
3️⃣ Зробити (почати) мікро застосунок для збору статистики по набоям (для мене)

Що саме будемо робити я ще не вирішив - то ж пишіть у коментарях. Лінк на ефір буде після обіду, орієнтовний час початку 19:00 або 20:00. Тривалість ефіру - поки не надоїсть. Очікуйте що буду тупити, часу на підготовку обмаль.

P.S. Стрім з героями або CS ми все одно зробимо і розмову про зброю теж проведемо. Але після лікарні (коли поки не знаю)
P.P.S. А ще я хочу зробити одне голосування, бо результати цього досить цікаві для мене. Але то вже потім.

Починаємо за 3 хвилини. Якщо у вас немає кота - собаку теж можна :)

Я повернувся.

Вийти погуляти на двір поки не зможу, але все йде на краще. А ще мені надіслали фото наших пічок, сьогодні викладу. Просто найкращі фото що я бачив)

До речі, як вам останній ефір? Будемо дописувати апку?

Хочу щоб усі пішли на вихідні з гарним настроєм. Тому тримайте

Ваша пічка, на яку ми збирали перед новим роком уже отримана. Разом із двома подружками 😊 І тепер вони гріють наших бійців на передовій.

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

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

То ж дякую усім хто приймав участь в цьому зборі і зробив такий чудовий подарунок. А хто не приймав - у вас ще буде шанс)

Бережіть себе і допомагайте ЗСУ

Ефір пана Сергія вже через три хвилини! Беріть смаколики, заварюйте чай, готуйте гривні для донатів — і гайда до Дивовижного світу веброзробки!

https://youtube.com/live/FLrgQ2-VBpE

Хтось ходить на співбесіди? Які у вас були найцікавіші або найнеочікваніші питання?

Мені колись дали код на C++ і попросили знайти помилку) а позиція була .Net розробник)

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

А от написати про щось цікаве - можу. Наприклад чим відрізняється ECMAScript від JavaScript і навіщо вам це знати. То ж якщо у вас є цікаві питання - пишіть, не соромтеся.

Так чим же відрізняється ECMAScript від JavaScript?

Якщо говорити максимально лаконічно, то ECMAScript це інтерфейс (опис) мови програмування, а JavaScript це реалізація цього інтерфейсу. Отак усе просто)

Що це нам дає?

По-перше, ми завжди можемо почитати як має себе поводити мова програмування і чому дорівнює 4=='4'. Власне ми можемо навіть написати власну реалізацію ECMAScript, якщо у когось є на це час та натхнення.

По-друге, тепер значно простіше розуміти що значить ES5, ES6 тощо. Це просто версії специфікації, які з'являються з часом і які відрізняються просто обсягом фіч. Наприклад, якщо ви бачите що рантайм підтримує ES7 - ви знаєте, що ви можете вільно використовувати async/await. А в ES6 ця конструкція буде просто набором літер.

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

Ну і на останок - тепер ви знаєте що відповідати на це питання на співбесідах, які, я дуже сподіваюся, будуть потроху з'являтися.

@reactbeginners

Знову Віталій зі своєю теорією. А можна це на практиці використати?

Звісно можна:

Відкриваємо tsConfig.json і дивимося властивість target. Ця властивість відповідає за те, до якого саме стандарту буде приведений наш TS.

Якщо там стоїть EsNext - нічого не чіпаємо. Це завжди наступна версія JavaScript. Вона динамічна, тому тут можна нічого не міняти.

Якщо там стоїть щось інше, наприклад ES5 то є місце для покращення. Спочатку треба визначити наступну версію. В цьому прикладі це буде ES6. Потім подивитися, наскільки широко цей стандарт підтримується. Наприклад ES6 повністю підтримується на 97.41% пристроїв. Якщо вас це влаштовує - перемикаємось. І так до поки ви не дійдете до найбільш сучасного стандарту який вас влаштовує.

Яка з цього практична користь? Чому не звести все до ES3? Все дуже просто і знову на прикладі. В ES3 банально відсутні ті можливості, які є у, наприклад, ES7. Той самий async/await. Відповідно, їх потрібно емулювати - тобто створити додатковий зайвий код. Відкрийте цей TsPlayground і подивіться що генерується для async/await. Таким чином, якщо ми поставимо вищий стандарт, наш код в результаті буде: а) менший, б) скоріше за все швидший (бо нативна реалізація зазвичай працює швидше) і в) збиратися це буде також швидше.

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

От таке от суто практичне значення тої теорії з якою ми розібралися минулого разу

Бережіть себе, допомагайте ЗСУ.

@reactbeginners

Хочете побачити маленький шматочок мого минулого життя?

Ось це він (тільки цей текст набагато менш формальний ніж зазвичай). І так, у мене дуже цікаве минуле)

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

@reactbeginners

React, react... А ви знаєте на чому написаний LinkedIn?

На EmberJS - який був створений ще в далекому 2011 році (за два роки до появи React). Пам'ятаю навіть виступ на FwDays був від людини яка дуже топила за Ember. Вікі пише, що навіть Apple Music його використовує)

Але це досить цікавий момент, як великі системи перетворюються на "працює - не чіпай" та завмирають у розвитку.

П.М. Не забувайте мініфікувати ваш JavaScript та перевіряти його обсяги. Бо може бути як на фото...
П.П.М. З мініфікацією то мій косяк, вибачайте.

О, fwdays опублікували мою останню доповідь про формошльопів)

Хто тоді не був - можна передивитися. Подивимось яка буде ваша думка 😅

https://youtu.be/KM_iXFwyRyA

Не використовуйте зайвий раз React.Fragment

Взагалі то це дуже крута штука яка дозволяє створювати контейнери без створення зайвих DOM-елементів, що покращує читабельність HTML та трошки швидкодію браузера:

<React.Fragment>
  <p>1</p>
  <p>2</2>
<React.Fragment>

Та вже досить давно, замість явного використання Fragment ми можемо використовувати конструкцію з пустих трикутних дужок: <></> - це майже те саме, тільки код виглядає чистішим (і без зайвих імпортів). Що я і раджу вам.

<>
  <p>1</p>
  <p>2</2>
</>

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

@reactbeginners

Голосування завершено, давайте підіб'ємо підсумки (а ще я розкрию страшну-престрашну правду)

Усього проголосувала 341 людина (що досить непогано, хоча і не може вважатися репрезентативним зрізом суспільства у цілому, з огляду на специфіку аудиторії).

За зброю без будь-яких обмежень маємо 41% голосів. За зброю без права носіння, а лише для тренування 43%. За повне обмеження - 16%.

Якщо узагальнити, маємо 84% людей, які підтримують доступ громадян України до зброї і це чудово. Більше того, 41% за вільне носіння зброї, це теж дуже показовий результат (який мене особисто тішить), тому що раніше, вважалося, що за вільне володіння зброєю лише 11% українців.

Тепер щодо пересторог і страшної таємниці (вибачте за цю пародію на клікбейт).

На сьогоднішній день, громадяни України які досягли 25 років, не мають судимостей, наркотичної залежності, та психічних проблем , можуть вільно купляти:

* Дробовики, в тому числі багатозарядні (з 21 року),
* Штурмові гвинтівки,
* Снайперські гвинтівки
та інші цікаві речі.

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

І незважаючи на все - масшутінгу у нас немає, а інциденти зі зброєю досить велика рідкість (хоча повірте, зброї у людей дуже багато. Лише за три місяці повномасштабної війни, лише однією мережею було продано більше 10_000 "дробовиків" (правильно казати гладкоствольної зброї) Оцінили масштаб?

А все тому, що стрільба з власної, легальної зброї це нонсенс. Знайдуть дуже швидко, зброю заберуть, а стрільця скоріше за все посадять навіть за самооборону. Поліція ставиться дуже прискіпливо до власників, дуже. І будь-який власник це чудово розуміє. Плюс, хто б що не казав, а збройова культура у нас існує. Спробуйте приїхати на тир/полігон і помахати стволом в різні боки 😃

Ось така от інформація для роздумів)

Дякую усім за голосування, за змістовні коментарі та позицію💪
@reactbeginners

А ну кажіть правду, хто мене зурочив?

На роботі прилетіла таска - інтегрувати React Query в Next.JS застосунок. Якщо кому цікаво - гайд тут

А ще є гарна новина - я нарешті більш-менш одужав, запустив великий екран то ж думаю скоро буде якийсь ефір. Може будемо дописувати апку, а може таки нарешті дозніму NextJS + CSS і викладу хоча б щось.

Зараз тільки з роботою розібратися треба.

Всім гарного тижня!

Знову бачу непорозуміння з використання контексту, тому давайте ще раз.

Маємо проблему - props drilling, коли ми змушені передавати пропси через декілька компонентів лише для якогось компоненту який лежить в самому низу.

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

І тут з'являється нюанс - контекст буде завжди викликати перерендер УСІХ компонентів які його використовують. Навіть якщо дані які їм потрібні не змінилися.  А, це, в свою чергу, буде викликати перерендер дочірніх компонентів, що викликає ефект доміно.

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

Підсумки - використовуйте контекст, він корисний, але для даних що рідко або взагалі не змінюються. Використовувати контекст для даних які змінюються багато протягом короткого проміжку часу (координати миші, позиція колонки при drag&drop) не варто.

@reactbeginners