Новый React 19: 7 изменений. Что внедрять? Тестируем useActionState, useFormStatus, ref, use и др.

[@PurpleSchool]

Посмотреть: 🍿 Последний выпуск новостей веб-разработки - kzbin.info/www/bejne/n36pqqSmnryLlbs 🍿 React Native за 3 часа - kzbin.info/www/bejne/pnrNnJ6te5mdmZI 💬 Telegram-канал с полезными советами по разработке - t.me/purple_code_channel Пройти обучение: ➔ А для тех, кто еще учится созданию приложений - у нас есть большой практический курс по React. Вместе напишем 4 комплексных проекта и освоим ключевые навыки работы с этой библиотекой - purpleschool.ru/course/react-redux/?D0%BD%D0%BE%D0%B2%D1%8B%D0%B9+react+19%3A+7+%D0%B8%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B9.+%D1%87%D1%82%D0%BE+%D0%B2%D0%BD%D0%B5%D0%B4%D1%80%D1%8F%D1%82%D1%8C%3F+%D1%82%D0%B5%D1%81%D1%82%D0%B8%D1%80%D1%83%D0%B5%D0%BC+useactionstate%2C+useformstatus%2C+ref%2C+use+%D0%B8+%D0%B4%D1%80. ◉ Бонус в течение 24 часов. К курсу по React добавим карьерный курс «Прохождение собеседования» за 1 рубль. Вводите промокод NEWREACT при офомрлении заказа.

[@StasKhitrich]

Спасибо за видео. Не увидел для себя ничего, что вызвало бы желание перейти с 18 реакта на 19. В целом, сказал бы, что всё больше склоняюсь к возвращению на vue)

[@PurpleSchool]

@@StasKhitrich 👍

[@Kotovar]

Неплохо, что от форвардрефы избавляемся) Надо с use разобраться, выглядит интересно)

[@PurpleSchool]

👍

[@drewnaumenko2469]

Выглядит как костыльность хуков хотят подпереть другим костылем хуком. Вот весело будет спагетти 🍝

[@ЕвгенийКондобаров-ю7г]

Прикольно, спасибо за разбор!

[@PurpleSchool]

@@ЕвгенийКондобаров-ю7г пожалуйста!

[@Commondore]

Спасибо за обзор! Многие вещи уже использовал ещё весной типа северных экшенов. Но use и ref порадовали. Ещё бы compiler подвезли вот это была бы реально обнова так обнова 😅

[@PurpleSchool]

@@Commondore 👍

[@artems5802]

Спасибо за обзор

[@PurpleSchool]

Пожалуйста

[@InverserPro]

Мы строили, строили и, наконец, построили тоже самое, что делал PHP сто лет назад😂 🎉🎉🎉 Ох и react 😮

[@Kotovar]

Для несведущих в PHP - можно подробностей?) Интересно

[@PurpleSchool]

Ну на php не сдалешь клиентское приложение. Скорее затащили всё лучшее с сервера)

[@InverserPro]

@@PurpleSchool ну, почему же не сделаешь, без js можно взаимодействовать с сервером... А отдавать HTML для PHP, как пряники жевать.

[@InverserPro]

@@Kotovar дело было, когда я был ещё совсем маленьким. Значит сидишь ты такой, кодишь, и тебе не надо билдить. Примерно так)

[@boycovclub]

@@PurpleSchool лучшее с сервера ?))))

[@Epic0n]

Правильно все делают, а то вздумали на клиенте бесплатно рендериться, а как Верселю и прочим АВСам зарабатывать? )

[@PurpleSchool]

😀

[@Kestisr]

Thx for video!

[@PurpleSchool]

Welcome!

[@ViacheslavUstinov-g4x]

Изменение работы с ref безусловно обрадовало, в остальном же - ощущение, что половина представленных фич должна быть скорее в библиотеках, а не в ядре проекта, ну и хук use в текущей имплементации как-то странно смотрится (нейминг, модель использования и тп)

[@PurpleSchool]

👍

[@АртурДемидов-г7ф]

У меня конечно вопрос, а почему некоторые фичи вроде серверные компоненты и экшены добавляют именно в реакт? Пусть этим занимаются разрабы next если им это нужно. Я люблю тот реакт где у меня есть 3 файла: .html, .css, .js и отдавая это через nginx я получил рабочее приложение на реакте

[@PurpleSchool]

Тут скорее вопрос вектора развития Frontend. И Vue и Angular тоже из коробки это умеют.

[@gatos-su]

Некс превратился в пхп из 2002 года. Для развития конкуренции фреймворков, чтобы разрабы каждый раз не писали велосипед

[@doroshko]

Невозможно смотреть этот АСМР с шепотом и чавканиями. :( Уже который раз нактыкаюсь на ваш канал, очень полезная инфа, хорошая подача, но звук. Это АСМР программирование? Ощущение что вы над ухом стоите у меня и шепчите причавкивая. Думаю не меня одного это раздражает, и если будет много фидбека об этом вы пофиксите этот момент. Возможно микрофон подальше и говорить нормальным тоном а не шептать легко решит этот фактор.

[@_oxios_]

Как страница знает что нужно ждать пока Post(из примера) загрузит свои данные?

[@НайтиСебя-у6щ]

Я в шоке, ты такой умный... Хочу так же все знать...

[@dmitriyv.2330]

А есть ли способы не использовать Next, но использовать фичи React 19? Типа те же серверные компоненты, или это апдейт только для "всеми любимого" некста?

[@PurpleSchool]

Да, можете использовать шаблон Vite с SSR

[@ficus708]

А в чем проблема nextjs?

[@chirkov]

@@ficus708 если делаешь админки, то ssr не нужен в принципе например

[@viooi2582]

При отправке html, реакту всё равно нужно выполнять весь свой старый код для инициализации приложения, коме рендеринга, для того чтобы знать состояние приложения. Так что оптимизация только для первой отрисовки и seo

[@PurpleSchool]

@@viooi2582 да

[@ВалентинЗырянов-з4ч]

Так серверные компоненты не ssr Они не присылают html Или я что-то не так думаю?

[@PurpleSchool]

@@ВалентинЗырянов-з4ч ssr процесс рендеринга нашего приложения на сервере. Серверные компоненты - выполняются исключительно на сервере

[@Artur-pk3sw]

а что с react compiler?

[@PurpleSchool]

@@Artur-pk3sw пока в бете

[@sergey7144]

А в чем теперь принципиальная разница next от реакта?)

[@PurpleSchool]

@@sergey7144 next имеет роутинг, настройки меты и прочее

[@sergey7144]

@@PurpleSchool понял, спасибо) то есть некст все равно пока предпочтительнее для seo?)

[@AndroidsReview]

Ref можно было и раньше как пропс передавать, только имя должно быть отлично от ref

[@НайтиСебя-у6щ]

А где вы этому всему научились, и сколько лет на это ушло?

[@PurpleSchool]

Я уже 14 лет пишу код и прошёл путь от разработчика до CTO и владельца бизнеса.

[@НайтиСебя-у6щ]

@PurpleSchool заберите меня в команду. Опыта почти нет, но есть огромное желание

[@НайтиСебя-у6щ]

@PurpleSchool понимаю что без работы в реальном проекте нет возможности прогрессировать.

[@bring_you_up]

по-моему - use - какая-то шляпа. Как запрос то отменить в случае размонтирования компонента? а никак)

[@grasslawn7544]

А что насчет usecallback и useMemo ?

[@big_606]

Реакт компилятор пока в бете, именно он отвечает за "автомемоизацию", пока юзаем по-старому

[@PurpleSchool]

@@grasslawn7544 пока все так-же

[@СергейФилатов-ы5ю]

Реакт свернул не туда. Но бабло решает. Я думаю версел заливает им. Надо было работать над рендерами, скоростью, реф единственное что порадовало, и как сделать все юзЭффекты с возможностью кондишинал рендер. В 19 версии для меня полезен только реф. И тот сомнительно. Я не вижу проблем понять реф в каллбэке

[@al77ex1]

Теперь на фронте свой сервер который соединяется с настоящим бэк серверм. Дальше на фронт в некст хорошо бы завезти кафку или рэбита, чтобы уже общение шло по шине а не по ресту и компоненты под них запилить ))

[@PurpleSchool]

@@al77ex1 😀

[@Lincoln05]

05:40 немного не понял что это нам дает. Окей, юзер отправил нам данные, это мы видим на сервере, что это нам дал? В чем привилегия это делать на сервере, а не на клиенте. Можете пожалуйста объяснить? 🙂

[@PurpleSchool]

@@Lincoln05 получив в этой функции данные, Вы можете например сходить в базу данных и их сохранить.

[@gatos-su]

Ну типа раньше ты это делал на пхп и все нос ворочили, а теперь тоже самое делаешь в нексе и ты теперь топ хайп сеньер фронтенд девелопер

[@andreykrylov2767]

​@@gatos-suв точку

[@lukovkin8]

Вопрос: зачем мучиться если есть ангуляр. Проще, быстрее и надёжнее. Мнение конечно субъективное

[@PurpleSchool]

Очень субъективное. Писал на нём 3 года, перешёл на React

[@_boolive_]

Пора делать свой React без этой новой мути)

[@nickolaizein7465]

с серверными экшонами конечно странно как-то это всё

[@PurpleSchool]

Это да)

[@asifmcjr1602]

Парни, так use это не хук, вы чего)

[@bozzhik]

турбопак прошел уже 100 процентов тестов в деве, его не зря добавили при создании проекта. а вот для продакшена так около 70, пока еще сырой

[@PurpleSchool]

@@bozzhik да, я перейду на нём В разработке, только когда можно будет на нём запускать и на проде

[@СергейК-б6н]

Уважаемый Антон сколько времени у вас ушло чтобы так зашарить? В этих реактах

[@PurpleSchool]

@@СергейК-б6н тут фреймворк не особо принципиален) Разработка я уже занимаюсь более 14 лет.

[@couragic]

14:55 что за «саспенЦ» такой ? 😊

[@PurpleSchool]

@@couragic монтажёр ошибся)

[@dimovich85]

Ужа с ежом скрестили) Ну, посмотрим. Вырастет поколение программистов, которые скажут, что никаких хттп запросов не существует, есть просто юз сервер и все, а если не работает, то надо смотреть в консоль..

[@PurpleSchool]

@@dimovich85 😀

[@Евгений-м2з2ц]

я первый, уиии

[@PurpleSchool]

👍

[@headstrong1968]

Из того, что увидел, разницы для CSR почти нет, беспонтовое обновление для таких проектов. Я думал будет оптимизация завезена лучшая или чет подобное

[@PurpleSchool]

@@headstrong1968 пока react compiler не завезли

[@boycovclub]

Лучше бы оптимизировали хост среду самого JS а не Х... страдали придумывая очередной PHP фреймворка из 2000 годов с прибавлением React на клиенте. Путь в никуда или обман бизнеса

[@InverserPro]

@@boycovclub им необходимо выезжать (конкурировать за рынок) за счёт новых плюшек. Ничего лучше не придумали, как использовать сервер, и преподносить это, как нововведение 2025 года 😁

[@boycovclub]

@@InverserPro за такие слова меня на неделю заблокировали в Реакт сообществе телеги))

[@InverserPro]

@@boycovclub обиженки ламповые 🤪

[@drewnaumenko2469]

​@@InverserProну сам по себе он был не плох на своё время, а как его загребли vercel так и всё серверный хук, клиент хук, нахрен это всё нужно? next огромный кусок распиариной говнины. Даже обёртка remix более побожески выглядит, чем вот это всё верселевское.

[@iGotton]

+

[@PurpleSchool]

@@iGotton 👍

[@antoncigur2724]

ничего не понял. Что было, что стало

[@PurpleSchool]

😀

[@antoncigur2724]

@@PurpleSchool можешь объяснить кое-что? вот допустим есть страница магазина, в нем 2 компонента, один слева - компонент фильтров(выбор размера, цены и пр.), второй справа- компонент товаров. компонент товаров(серверный) при начальной загрузке берет товары с апи и выводит на страницу. допустим я нажимаю какой-нибудь фильтр и хочу чтобы отобразились соответствующие товары в компоненте товаров, как это сделать без 'use client' ? Возможно ли это?

[@PurpleSchool]

@antoncigur2724 да, через query параметры в URL. У меня есть отдельные видео: kzbin.info/www/bejne/hoPPiK2faZmqhdk

[@gva5906]

Разбор слабый