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

👉 https://www.youtube.com/@reactdev
Download Telegram
❗️Трохи інформації про канал❗️

🤯 Ми провели опитування щодо можливості додання "неформату" в канал, і хоча думки розділилися, формат каналу залишається без змін. Неформат поїде в окремий канал, якщо такий з'явиться.

💰 Ми закінчили експерименти з рекламою на YouTube, і наразі реклама на каналі вимкнена. Була ідея монетизувати канал і зароблене відправляти ЗСУ, але розмір того що ми отримали настільки мерзенний мізерний що це просто немає жодного сенсу.

🕺 Ми плануємо відпочинок на після нового року. Перший пріоритет - довести курс до кінця (сподіваюся ми встигнемо до 31.12, але багато чого залежить не від нас), потім пауза і зменшення активності, потім буде обговорення що робити з курсом V3 і куди рухатись.

👉 Якщо у вас є коментарі або запитання - прошу під пост.
👍32🤯1
🔥Друга частина про новий #React #Router - практика🔥

😍Нарешті викладаю другу частину про React роутер, на цей раз суто практичну. Взяли апку без роутера і поетапно додали туди роутер.

До речі апка вийшла цікава, нашим буде приємно)

👉Ласкаво прошу для закріплення матеріалу.
🔥13👍41
😅 Отже ми пішли в Redux 😅

😂 Скажу чесно - якби моя воля я б Redux не читав. Причина цьому проста - на сьогодні існують більш зручні рішення ніж Redux. Як ті що відносно давно на ринку - MobX, так і нові, такі як Recoil.

👉 Але коду написаного на Redux настільки багато що ми мусимо дати хоча б щось. Тим паче що сама ідея Redux дуже цікава для будь-якої розробки. Тому ми викладаємо перше відео (дякую Ігорю за лекцію) з Redux циклу де ми зачепили:

✍️ useReducer як найпростішу реалізацію redux
✍️ синхронний Redux з Redux Toolkit

А от асинхронний Redux буде трохи згодом.

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

Бережіть себе, зустрінемось наступного разу!

П.С. Дублюю лінку на відео - https://youtu.be/2L77hzkirgo
👍254🥰2
😢 Харків, Запоріжжя - мої співчуття 😢
25🤯4
✍️ Redux - частина друга ✍️

😢 Можливо це не на часі, бо у багатьох немає світла, води та навіть опалення (у мене, наприклад ні води ні опалення), але ми продовжуємо викладати навчальні відео.

👉 Тому як ви знайдете час та сили - ось друга частина відео про #redux, middleware та thunk. Штуки не найпростіші але й не захмарні.

Дякую Ігорю за лекцію, а ви бережіть себе і давайте продовжувати лупати цю скалу.
👍2410
😎React, UI бібліотеки або як нам час економити😎

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

👉Саме тому, ми використовуємо сторонні бібліотеки які вже відтестовані та задовольняють усі вимоги. Не є виключенням і UI компоненти, які також можна "взяти" зі сторонніх бібліотек, таких як, наприклад MUI (material UI). Саме про них і йде мова в нашій новій лекції, яка вже завантажена на YouTube.

🧨 Ми також зачепили StoryBook - популярний інструмент для документування власних UI компонентів, який буде в нагоді у великих проектах.

Бережіть себе і до скорої зустрічі.
👍20🔥1
Спрощуємо роботу з формами у React

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

👉 Саме з такою бібліотекою ми сьогодні і познайомимось . Це React Hook Form яка розроблена для використання у функціональних компонентах, має зручні інструменти з коробки та підтримую асинхронну валідацію і валідацією за допомогою Yup, Joi та інших.

😎 Cама бібліотека важить 25kb (мініфікована, не жата), має 2.6 мільйонів заважантажень на тиждень та 32 тисячі зірок. Останній коміт був учора, тож ви можете бути впевнені що хоча б ще один рік бібліотека буде жива та підтримувана.

Бережіть себе і до скорої зустрічі!
👍15🔥4
Розбір домашнього завдання з React-Router-Dom

✍️Під час розгляду домашніх завдань наших студентів ми побачили певну кількість типових помилок при роботі з React-Router-Dom. І тому, поки є світло, вирішили записати відео з код рев'ю однієї з робіт.

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

Бережіть себе і з наступаючим всіх святами!
👍212🔥2
З наступаючими вас святами!

😊 Я дуже радий, що ще тоді, у квітні ми розпочали цю освітню ініціативу і змогли протриматися до другого курсу. Якби рік тому мені хтось сказав що я буду на YouTube, або ми з колегами запишемо майже 60 відео я б лише посміявся.

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

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

❤️А в цьому році у мене все. Вітаю вас зі святами. Бажаю сил, бажаю снаги та терпіння, бажаю вакансій, бажаю гарних колективів і цікавих проектів. Вірю що все у вас вийде!

Бережіть себе і гарних всім свят!
73👍13🔥5
З новим роком!

Сил, наснаги та Перемоги!
70👍16😁1
Лекції на початок 2023

👨‍💻 Новий рік лише розпочався а ми вже плануємо наступні лекції, і ось найближчі:

👉 Верстка в прямому ефірі з Сергієм Бабічем - 12.01.22, 19:00. Буде компонентний підхід, css змінні, grid-и та інші корисні прийоми.
👉 React та StoryBook. Навіщо та як?
👉 React та Performance - оптимізація завантаження
👉 React та Performance - оптимізація в runtime
👉 Web та Secure coding

Як бачите дата є лише для першої лекції, всі інші зараз в стані розробки, але чекати довго не доведеться.

Тож бережіть себе і чекаю всіх вас на наших ефірах!
🔥57👍127
😊 І також - якщо ви передивилися наші курси і вам чогось не вистачило - напишіть про це під цим дописом і можливо ця лекція також з'явиться на нашому каналі!

❤️ А ми та всі учасники будемо вам вдячні!
33👍5
Трохи про гроші, бо це важливо.

✍️ Як більшість знає - в 2022 році ми збирали пожертви для наших військових через мою картку а також через OpenCollective. В 23 році ми продовжимо це робити і всі гроші які ви нам переводите - будуть відправлені на Перемогу.

💎 Наш залишок - 2584,30 грн., лежить цілим і чекає на слушну нагоду принести користь, або нагальної потреби. (ну і поки я його доб'ю до якоїсь круглої суми), то ж за бажанням долучайтесь.

Дякую вам за довіру, це велика відповідальність для мене.
👍26
Верстаємо з Бабічем наживо, 12 січня о 19:00

😎 Верстка — це те, що ми маємо опанувати в першу чергу, і часом нам може здаватися що з нею все зрозуміло: div туди, span сюди, float: left, та й погнали в продакшн!

🥸 Та насправді HTML та CSS набагато складніші та глибші, ніж здається на перший погляд. В них постійно можна знаходити щось нове, несподіване, магічне та й просто прикольне. Головне — практикуватись у верстці, навіть якщо ви вже досягли 80-го рівня в #React та силою самої лише думки рухаєте кнопки на найскладніших формах.

👉Саме з цією метою Сергій Бабіч і верстатиме для вас у прямому етері та спробує розібратись, чи можливо застосувати компонентний підхід в чистому HTML та CSS, поділиться деякими цікавими спостереженнями та знахідками, трошки посвариться на дизайнерів, питиме лимонад та відповість на ваші запитання.

❤️ Готуйте каву та печиво, ефір буде не маленький. А ще під час трансляції ми спробуємо зібрати кошти для ЗСУ.

Бережіть себе, чекаю всіх, верстки забагато не буває!
👍21🔥152
Поки Сергій готується до сьогоднішнього ефіру про верстку...

🤓 Я також готуюся до наступного ефіру про #перформанс #React застосунків. Не скажу що все йде просто, бо моментів багато і треба їх якось впорядкувати, але справа потроху рухається.

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

👉А я всіх чекаю вже сьогодні, 12 січня о 19:00 на лекції Сергія Бабіча з верстання, якого, як відомо, забагато не буває!

Бережіть себе і до скорої зустрічі!
🔥27👍93🎉1
Прямий ефір починається!

Верстати чи не верстати - ось у чому питання, на яке прямо зараз, під час прямого ефіру, буде відповідати Сергій Бабіч!

Приєднуйтесь!
👍17
🥸 Про експертність 🥸

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

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

👉 До чого я веду. Не знати щось - це нормально. Визнавати, що ти чогось не знаєш - це нормально і жодним чином не робіть нікого гірше. Набагато гірше бути тим, про кого писав класик:

- Несіть мені усі по три рубля, і мудрості вам дам я 🤬

❗️Тому не соромтеся казати "я не знаю", не соромтеся ставити начебто "дурні" запитання і давайте вчитися разом, аби не бути такими "експертами".

Бережіть себе і тихих вам вихідних
👍429
А ось і матеріали з останнього ефіру

Приїхали матеріали з останнього ефіру про верстку:

— Дизайн
— Репозиторій
— Бабіч

Тепер можна спробувати повторити верстку і піддивитися в ті моменти які не встигли.

Бережіть себе!
22🔥10👍3
Публічне код рев'ю: шукаємо добровольців

🥲 Ми тут планували зробити сесію з код рев'ю, але в людини яка спочатку погодилася, тепер змінилися плани.

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

👉 Від вас треба робочий код на #React та згода на його публічне обговорення. Проводитимо я та Сергій, буде не боляче 😅

А цей тиждень у нас буде присвячений #webperformance тож нові пости саме про це - незабаром.

Бережіть себе і до скорої зустрічі.
👍23