Free React For Beginners
3.46K subscribers
231 photos
5 videos
1 file
385 links
💻 Про #React та #frontend та #веб розробку
🧑‍🎓 Для початківців і не тільки

👉 https://www.youtube.com/@reactdev
Download Telegram
Сподіваюся усі живі та здорові. Приввтні мікро електростанції вже є, скоро буде і приватне ппо, мабуть.
👍2211
У мене залишився єдиний вільний вечір перед лікарнею - вівторок.

Тому поки я можу - пропоную щось зробити на ваш вибір

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

Зараз зберемо відгуки і у вечорі винесу на голосування.
19
В коментарях багато запитів на React + аутентифікація.

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

Голосувалку відкрию трохи пізніше. Наразі є LiveCoding на React без ідеї, дослідження GO/Rust/Rescript/elm/HTMLX, зброя і пограти в HOTA (якщо я нічого не пропустив)
24👍9🤔1
Голосуємо за завтрашній ефір (можна обрати декілька варіантів).

Буде десь о 19:00, нічого серйозного не очікуйте, просто відволіктися, поспілкуватися та провести час.
Anonymous Poll
17%
Дослідження GO
8%
Дослідження ReScript
12%
Дослідження Rust
2%
Дослідження Elm
19%
Дослідження HTMLX
23%
Граємо в третіх героїв
14%
Обговорюємо першу зброю для цивільних
51%
React - покодити щось рендомне
👍92
Як кажуть в коментарях - на каналі про React обрали відео про React. Оце несподіванка 😂

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

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

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

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

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

До речі, як вам останній ефір? Будемо дописувати апку?
👍394🏆2
Хочу щоб усі пішли на вихідні з гарним настроєм. Тому тримайте

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

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

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

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

Бережіть себе і допомагайте ЗСУ
37👍6❤‍🔥3
Хтось ходить на співбесіди? Які у вас були найцікавіші або найнеочікваніші питання?

Мені колись дали код на C++ і попросили знайти помилку) а позиція була .Net розробник)
😁20🤯3
Не так сталося, як гадалося. Нажаль одужання йде не швидко. Будь-які зусилля втомлюють, то ж про ефіри навіть не йдеться.

А от написати про щось цікаве - можу. Наприклад чим відрізняється ECMAScript від JavaScript і навіщо вам це знати. То ж якщо у вас є цікаві питання - пишіть, не соромтеся.
❤‍🔥26👍8
Free React For Beginners
Не так сталося, як гадалося. Нажаль одужання йде не швидко. Будь-які зусилля втомлюють, то ж про ефіри навіть не йдеться. А от написати про щось цікаве - можу. Наприклад чим відрізняється ECMAScript від JavaScript і навіщо вам це знати. То ж якщо у вас є…
Так чим же відрізняється ECMAScript від JavaScript?

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

Що це нам дає?

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

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

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

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

@reactbeginners
34🔥4👍3
Free React For Beginners
Так чим же відрізняється ECMAScript від JavaScript? Якщо говорити максимально лаконічно, то ECMAScript це інтерфейс (опис) мови програмування, а JavaScript це реалізація цього інтерфейсу. Отак усе просто) Що це нам дає? По-перше, ми завжди можемо почитати…
Знову Віталій зі своєю теорією. А можна це на практиці використати?

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

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

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

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

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

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

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

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

@reactbeginners
👍2832
👍3💔2
React, react... А ви знаєте на чому написаний LinkedIn?

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

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

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

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

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


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

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


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

@reactbeginners
26👍213❤‍🔥2