Подкапотка React Server Components | Как работают и где документация?
Если ты пришел посмотреть только техническую часть этого видео, то тогда можешь перематывать сразу на таймкод, который я оставлю здесь около пальца. Да. Но а тем кому интересно, оставайтесь. Ребят, всем привет! Вы на канале Vadik. The Architect.
Да, этот канал поменял название, потому что предыдущая концепция мне не особо нравилась. Так вот, какие ключевые изменения тут будут и в какой концепции существует дальше канал. Мы здесь будем с вами разговаривать о технических вещах в ламповой атмосфере, а не в такой, которая была полгода назад, когда ролики выглядели так, как будто их сделал Чат GPT, Аватар сделал для этого ролика какая-нибудь другая нейронка, и было очень много катов.
Да, много было полезной информации, все было ужато, вы экономили время, но я подумал, что если вы сегодня хотите экономить время, вы просто пропускаете YouTube и идете вот как раз таки в тот самый Чат GPT для того, чтобы узнать интересующую вас информацию. А я хочу преследовать немного другую идею, а именно покайфовать, посмотреть видосик, потихонечку вникнуть в то, что тут происходит. Ну и вообще в целом в дальнейшем сформировать какое-то сообщество, где мы с вами люди в первую очередь объединены какой -то идеологией, идеями, движением, пониманием индустрии и всего этого вместе взятого, так сказать. Сегодня мы с вами будем говорить про серверные компоненты React в контексте Next .js приложения, как оно сегодня там стартует, запускается и так далее. Этот ролик я решил записать по той причине, что на сегодняшний день практически никто в полной мере не понимает, как же там все работает.
Я сделал небольшую демку, сегодня все посмотрим и я думаю, что многим станет понятно. Недавно релизнулся React 19 и Next версии 15. Разработчики официально заявляют, что серверные компоненты полностью поддерживаются и готовы к продакшену и на них можно делать крутые быстрые приложения.
Наконец-то они стали стабильные, сейчас на календаре у меня 21 декабря, вышли они порядка 2-3 недель назад, числа 5, что ли, но не суть. Для тех людей, которые ни разу в жизни не трогали фреймворки с сервер-сайт генерацией, вкратце расскажу, что это такое. Есть у нас React, вот это наша библиотечка клиентская, которая загружается пользователю на клиент, когда он заходит на сайт к вам, она подгружает из JavaScript все содержимое, которое должно быть в HTML и в пустой HTML файлик рисует все ваше приложение. С этим жили нормально, но теперь приложение у нас некоторые, весят по 3-10 мегабайт, для кого-то это бороться за позиции в поисковой выдаче, оптимизация доставки кода для пользователя, это очень важный вопрос. И для многих, как раз-таки если вы просто реактор-разработчик, может быть открытие, что есть специальные механизмы на сервере, которые берут, рендерят в виртуальный дом, как бы типа HTML, кусками, и эти куски доставляются пользователю отдельными запросами. Частично серверные компоненты как раз-таки нацелены нам упростить эту задачу, так сказать из коробки, предоставить еще более грамотный сплитинг кода.
Этот функционал из коробки на сегодняшний день реализует несколько фреймворков. Один из ключевых это Next.js, самый расхайпленный и самый поддерживаемый сообществом. Да и вообще, если вы откроете официальную документацию React, то сами разработчики рекомендуют использовать сторонние фреймворки. Next.js,
Next.js, вот это я выдал. Next.js в частности.
И сразу хочу предупредить всех сторонников самописных велосипедов, если вы хотите запускать серверные компоненты без использования фреймворков, которые сейчас уже есть на рынке, во-первых, зачем это вам нужно, а во-вторых, наверное, если вы ответили на первый вопрос, то вы действительно очень крутой и знаете, зачем вы это делаете. Вот есть статья, которую можно прочитать, там очень толковый разработчик описывает все в подробностях, как запускать React компоненты с использованием кастомного сервера. Надеюсь, что вы ее прочитаете и поймете, что скорее всего в это лучше не надо вписываться сегодняшний день.
Почему я вас отговариваю? Потому что даже в официальной документации React нет никакого упоминания о том, как самостоятельно их запускать. Единственное, что там есть, как я уже сказал, они говорят, вот вам фреймворки, пожалуйста, используйте, а если вы разработчик фреймворка, напишите нам на почту, мы с вами заколабимся и внедрим рендеринг серверный вам в проект Для меня такая политика кажется достаточно сомнительной. Это первые звоночки от переделия рынка, и Open Source в этот момент стратегически становится такой шаткий, поэтому если вы выбираете Next для новых проектов, дважды подумайте, брать ли его как основной инструмент. Но кажется, что пора уже Давайте расскажу, что у нас здесь есть. Естественно мы используем с вами новое API Next.js,
это ап роутер и давайте глянем, что у нас здесь по коду. Собственно, сервер уже работает в продакшн режиме. Это наша корневая страничка, где мы с вами можем переходить на конкретные примеры. Итак, давайте посмотрим, как ведет себя приложение, когда рендерит серверный компонент. На текущий момент мы с вами предзагрузили приложение. А еще один очень важный момент, по коду здесь можно пронаблюдать, что все prefetch запросы на линках выключены.
Prefetch работает следующим образом. Когда вы запускаете страницу, то если у вас есть какой-то линк в разметке и prefetch по умолчанию включенный в состояние true, вам сразу же будет догружать модули с тех страниц, куда вы можете навигироваться по нажатию на этот линк. Это сделано опять же для того, чтобы сэкономить вам время при переходах между страницами.
Но для чистоты эксперимента и прозрачности, точнее для того, чтобы было проще понять, prefetch я отключил, потому что он много за собой чего тянет. Это, кстати, тоже учитывайте, если вы там какую-то прям серьезную оптимизацию пытаетесь сделать. Но чаще всего лучше оставлять его включенным по умолчанию, так будет лучший пользовательский опыт.
Ну, сугубо мое мнение. Итак, давайте перейдем с вами на страницу, где у нас рисуется только серверный компонент. Как вы можете заметить, мы загрузили приложение, у нас здесь пришел документ localhost, response, здесь какая-то разметка.
То есть нас это пока что не интересует. Модули вебпака у нас есть. Итак, значит, при переходе на страницу, где у нас с вами отображается только серверный компонент, мы делаем загрузку этой страницы. Причем, что тип ответа нам приходит не документ, а также какой-то jazz chunk. Давайте откроем содержимое этой страницы. У нас сервер only component.
Что же здесь у нас рисуется? Здесь у нас рисуется div, заголовок, серверный компонент и линк, чтобы вернуться обратно. По сути, на всех страницах будет выглядеть примерно таким образом структура документа, структура страницы, если быть точным. При переходе в сервер component мы видим, что у нас здесь просто асинхронный компонент, который помечен директивой use server. use server это директива, которая говорит сборщику о том, что этот компонент будет исполняться исключительно только на сервере. По умолчанию сейчас в 15 версии next для удобства использования все серверные компоненты должны иметь директиву async.
Давайте же глянем, что у нас здесь пришло в ответ, когда мы перешли на эту страницу. Вы понимаете, у нас сейчас уже есть каркас приложения, у нас загружен layout, у нас есть какие-то стили, какие-то ресурсы приложения. Для того, чтобы next подменить страничку нужно просто до загрузить вот эту вот составляющую пейджи, которой у него еще нет, потому что опять же у нас отключен prefetch. Итак, давайте посмотрим payload.
Здесь у нас есть кстати query параметр rsc, это react server component, это внутренний cache next. Это сделано для оптимизации запросов к серверу, потому что если у вас там есть механизм каширования встроенный, если вы отправляете запрос на серверный компонент с одними и теми же props, то он рендерится там всего лишь один раз, и потом просто присылается клиенту и не пробегает отдельный цикл рендера. Вот, нас интересует вот это вот preview здесь запроса, как вы можете заметить, что-то очень похоже на JSON, но это не JSON. Это сейчас я как записывал, название у этой структуры на сегодняшний день нет, но я покопал старые доклады в React сообществе.
Эта штука называется react flight pilot, типа название, но на самом деле посмысловано подходит, но в новой документации я нигде этого названия, к сожалению, не видел, хотя было бы очень интересно ознакомиться, как же в действительности все здесь устроено, а не заниматься реверс инжинирингом. Давайте по этапу наглянем, что же здесь у нас находится. Значит, первую очередь первой строкой всегда приходит react fragment, это указание о том, что это какой-то кусок страницы, который будет встраиваться у вас в ваше приложение. Дальше здесь у нас с вами идут модули, вот это индексы модулей, они нужны турбопаку, сборщику вашему для того, чтобы понимать, чего да загружать асинхронно. Значит, здесь нам пришел вот этот статик chunk 173, если мы посмотрим его содержимое в папке static chunks 128, вот он здесь, то мы увидим, давайте попробуем здесь его форматировать, сейчас код, формат, реформат код получится, да, получилось форматировать исходник, если здесь его пролистать, то в принципе, здесь мы наверное ничего особо и не разберем, поэтому давайте только по поиску будем ходить. Да, здесь можно прям глянуть, что есть какие-то страницы ошибок, встроенные в next, которые приходят, если со страниц что-то случится, ну классический, классический манифестированный файл, в общем с модулем, который подгружается в ваше приложение, давайте попробуем найти вот что-то по поиску здесь в этом коде и как вы видите, поиск нам дает положительный результат, я скопировал серверное время и здесь мы видим по разметке, можно понять, что next пытается встроить вот этот пейлот с чилдернами, здесь то есть есть див, чилдерный сервер компонент, это непосредственно то, что у нас здесь написано, встроить в свою разметку, дальше здесь еще есть также дополнительно вьюпорты, чарсеты, очень много информации, которая как раз -таки показывает next при парсинге, куда вставлять те или иные данные, также здесь указаны классы, которые нужно применять к элементам в компонентах и так далее, то есть вернусь обратно на большое лицо сейчас, значит суть серверных компонентов такая, точнее вот это разметки react flight протокола, так сказать, сервер у себя рисует разметку какую-то и к ней прикладывает файлик, в котором указано как эта разметка должна выглядеть, соответственно вам доставляется при загрузке страницы HTML размеченная, но в случае, когда мы грузили уже сейчас обычный документ, при переходе точнее по линку, мы получили только разметку, а точнее не разметку, а сам документ с директивами как что размечать и в будущем react использует этот файл для того, чтобы синхронизировать данные гидрации в том числе и так сказать серверное состояние синхронизировать с тем, что у вас фактически есть на клиенте, чтобы приложение как бы изоморфно выглядело и там и там, надеюсь понятно сказал, давайте вернемся в код, короче, когда вы запросили серверный компонент, вы получили данные, эти данные react встроил в HTML, подытожим по серверному компоненту, значит когда вы загружаете страницу с серверным компонентом, то вы для него получаете разметку, которая потом внедряется непосредственно, которая гидрируется в ваш код на клиенте и вы получаете валидный HTML в дальнейшем, в который можно работать, давайте теперь переходить к примеру с клиентским компонентом, боже на моих часах уже два ночи, меня немножечко плавит, поэтому надеюсь, что я не ошибусь в своих изречениях, итак давайте нажимать client component, обратите пожалуйста внимание, что сейчас будет происходить, мы с вами перешли на client only component страницу, я сейчас ее открою у нас в коде для того, чтобы наблюдать, соответственно, обвязка страницы ничем не отличается от предыдущей, единственное, что у нас здесь импортом подключается уже клиентский компонент, про импорт я скажу чуть позже, почему это важно, значит клиентский компонент у нас помечается директивой use client, это говорит сборщику о том, что этот компонент будет использоваться непосредственно на клиенте, итак этот компонент делает в принципе тоже самое, он отображает время, только уже делает это в браузере клиента, давайте посмотрим здесь разницу в том, что к нам пришло, клиентский компонент также мы видим здесь содержимое наименование модулей, пути к статике, которую нужно забрать сервера, когда вы грузите приложение, а также здесь нам доставляется page .js дополнительно, давайте посмотрим, что же здесь вообще происходит, как вы видите здесь у нас код нашего компонента с чилдерными размеченными, и вы можете задать справедливый вопрос, а как же так получается, в серверном компоненте контент был у нас в разметке, а клиентский компонент получает свою разметку непосредственно уже в коде модуля, зачем это сделано, ответа как такового очевидного у меня нет, но я думаю, что так проще делать, учитывая, что механизм гидрации уже у Nxt давно-давно есть для классического такого подхода с клиентскими компонентами, я думаю, что они просто его поддерживают, ну не то чтобы для обратной совместимости, скорее всего это сделано просто потому что так удобнее работать по старым рельсам, ну и как вы можете заметить, вот контент мы для серверного компонента искали в разметке, здесь мы если мы попытаемся найти, то в этой разметке его здесь не будет, он есть только в модуле, давайте смотреть пример с client component with hydrate error, этот примерчик нужно показывать в dev режиме, собственно чем что это такое, давайте глянем, run dev, пока запускается сервер, собственно у нас есть давняя история, это когда у вас имеются ошибки при клиентской гидрации, что это значит, давайте посмотрим в код этой странички, перейдем сюда, увидим, что у нас здесь есть большой error, боже мой английский, конечно, плох, тоже здесь у нас имеется клиентский компонент, который помещен как use client, он использует вызов date now, чем это плохо, давайте ответ в комментарии 3 2 1, клиентский компонент, кто бы что-нибудь там не думал, он тоже рендерится на сервере в определенный момент, это нужно для того чтобы вы при запросе при отключенном JavaScript в вашем браузере могли получить актуальный размеченный контент, давайте попробуем запросить эту страницу повторно при перезагрузке, как будто мы первый раз сейчас заходим на это приложение, ой это мы в dev режиме, давайте вернемся, если мы с вами сюда перейдем, то как таковых ошибок в проде мы не видим, потому что они перестали делать ворнинги, так как у них сейчас есть механизм, который позволяет в версии Nxt перегенерировать дерево и выдать пользователю все-таки клиентский контент, то есть повторно произвести рендеринг всего дерева, после того как произошел мисмач серверного состояния с клиентским и все равно как бы стабильно продолжать показывать пользователю приложение, раньше падала ошибка, давайте глянем что у нас приходит в документе, так как будто мы первый раз заходим на страницу где есть ошибка гидрации, давайте сейчас обновляемся и в ответе с client -component-gidrate-error страничкой мы видим следующее, у нас есть превью нашей страницы и обратите внимание на значение времени, на хвостик посмотрим 16.33
.01.67, это связано с тем как раз таки с ошибкой гидрации, то есть то что мы видим в превью это результат работы вызова date now на сервере, а фактически в браузере я вижу другое число которое было запущено этой функцией date now в браузере, именно оно отражается у вас в приложении, чем это плохо тем что у вас есть несоответствие контента между клиентом и сервером, это влечет за собой на сегодняшний момент полную перерисовку дерева реакто при загрузке вашего приложения, за счет этого вы можете уронить производительность и это негативно скажется на ваших метриках например, поэтому не игнорируйте пожалуйста ошибки которые сигнализируют вам о том что случилась ошибка гидрации, давайте посмотрим как у нас работает эта же страница без ошибки гидрации client only component давайте мы давайте на нее мы так вот оп так же перезагрузимся и посмотрим, а ну конечно у нас здесь в этом примере не будет вообще никаких данных гидрации, потому что если мы вернемся по коду в client only component то обратим внимание что у нас здесь нет никаких входящих пропсов, а next гидрирует в разметку клиентских компонентов только то что им было передано извне, то есть какие-то сериализованные данные в частности пропсы, то есть если мы здесь добавим какой -то initial value, то соответственно оно у вас там появится, потому что при первом цикле рендера у вас конечно же здесь undefined, undefined у нас не отображается, мы можем с вами прямо сейчас добавить здесь initial value, это initial value пробросьте вот в hook use state и тогда нам нужно на пейдже которая рендерит этот компонент сделать ему естественно initial value и здесь мы уже можем вызвать date now напрямую, давайте мы это делать client only page, мы ее должны сделать наверное ассинхронной также, потому что это у нас исключительно серверный компонент и тогда если мы с вами перебилдимся и сейчас если мы перейдем с вами на эту страничку, то по идее мы должны получить с вами валидный размеченный ssr контент, так все верно, вот у нас было значение, то есть мы его получили, но естественно конечно же на клиенте мы видим другое значение, потому что в компоненте у нас есть use effect, который как раз после того как произошел этап гидрации, запускается этап с вызовами use effects клиентских и он уже у вас сетит повторно новое состояние, не забывайте что use effect работает только на клиенте, будем переходить к следующим примерам, которые связаны с вложенностью серверных компонентов в клиентские и клиентские в серверные, что нам говорит официальная документация next.js, next.js заявляют, что вы можете вкладывать серверные компоненты в клиентские и наоборот и все это будет работать супер круто, но они опускают одну очень важную деталь, вы должны вкладывать их children, да не импортами как многие думают, то есть что произойдет если вы будете использовать импорт, давайте, вот он у меня последний, посмотрим как это выглядит client import server component, вот эту page что у нас здесь есть, у нас здесь есть страница page, который импортирует в себя верхнеуровнево клиентский компонент, давайте мы туда провалимся, увидим что у него также здесь есть какой-то initial value, но не суть, у него есть директива use client и самая важная ошибка, которая здесь есть, ну не то чтобы ошибка, этот подход вполне себе может использоваться, потому что ну если вы полностью будете делать все через children, то вряд ли у вас получится сделать приложение production ready, значит, но для mindset очень важный момент, то есть вы импортируете здесь серверный компонент в клиентский напрямую, это говорит сборщику о том, что теперь это дерево с компонентами вложенными, как бы вот тут оно становится полностью клиентским, import server, нам здесь приходит некая разметка, now score это как раз таки содержимое серверного компонента и как вы можете заметить оно не пришло, а если бы now score вот это вот равно 0, вот он как раз таки, я здесь перешел в его содержимое, то если бы это был прям серверный, ну серверный компонент как есть, то он бы был бы в этой как react fly payload, но если мы посмотрим клиентскую разметку, то увидим, что now score является как раз таки просто частью нашей страницы, нашего модуля и фактически является клиентским компонентом, да, вы сейчас можете меня подловить и сказать, что Вадик, ну ты же не объявил здесь, что этот компонент use client, я с вами согласен, но если вы здесь его сейчас напишете, что используя его, ой извините, не use client, а use server и если я сейчас напишу эту директиву прямо здесь, то таким образом вы получите ошибку, вам next напрямую намекнет, что дружище, нельзя напрямую в код клиентского компонента импортировать серверный, убери эту директиву и мы автоматически поймем, что это часть клиентского компонента, к сожалению, поэтому механизм не совсем тривиальный, не совсем простой, ооо, как правильно выразится, короче документация не соответствует действительности, если быть точным, теперь давайте перейдем к последнему нашему примеру, это где клиентский компонент принимает в себя children, это снова склейка, потому что уже при записи ролика я обнаружил, что допустил серьезную ошибку при подготовке последнего примера, я ее поправил, поэтому давайте посмотрим, что же у нас здесь изменилось, если вы очень внимательный зритель, вы заметили, что у нас появилась папочка API, последний пример очень сильно отражает концепцию ту, которую нам навязывает next, навязывают разработчики, продают ее как истинно верную и это та самая концепция, которая нужна тем предложениям, у которых должно быть по идее много статики какой-то, но статики интерактивной, в смысле интерактивной с точки зрения сетевого взаимодействия, как например какие-то старые сайты, которые многостраничные были, где вы получаете кучу HTML, у вас есть активные ссылки, какие -то там экшены, заполнение форм и тд и тп, где по какому-то взаимодействию с интерфейсом вы отсылаете запрос на сервер и эти данные на сервере обновляются либо же создаются, ну то есть в таком ключе, итак это тот же самый пример с добавлением скоро плюс один каждый раз, только уже это значение, которое здесь отображается, это значение, которое лежит в данных, то есть что я имею ввиду, давайте обратно сейчас глянем как было здесь, мы здесь используем чисто клиентское состояние и при перезагрузке соответственно мы его полностью теряем, оно у нас нигде не сохраняется, никакого коннекта к базе данных нет, почему я делаю акцент здесь, потому что вы можете подумать, что в противном случае у этих двух примеров должна быть по разному, а то и не получается, она различается именно потому что это серверное состояние скоро, а то было клиентское, сейчас я быстро опишу что здесь происходит, здесь есть кнопка по нажатию которой вызывается server action, которая отправляет запрос на изменение базы данных, в моем случае это обычный объект в опишку, опишка сетит плюс один в server state и возвращает обратно это значение, также серверный компонент это асинхронный компонент, который при загрузке при инициализации получает методом get интересующее его значение, а именно server count, этот count отражает у себя в интерфейсе, это что кратко там происходит, давайте же в деталях посмотрим, когда я нажимаю плюс один, у меня уходит два запроса, первый это метод пост, это непосредственно вызов server action осуществляется в первую очередь, который мне по payload тут ничего не возвращает, потому что он ничего и не должен возвращать, он возвращает мне вот только как раз таки снова здесь магическую разметку, также мне здесь методом get приходит обновленная страница, причем что почему страница обновленная, давайте глянем, next по умолчанию как я говорил уже кэширует страницы, тем более статические, у вас есть статическая страница, которая полностью размечена под HTML, на серверный компонент это такая динамическая штучка, которая как бы вот на этапе гидрации вот в эту прям статический каркас туда внедряется и на сервере загружают в себя какие-то данные асинхронно, поэтому next помнит всегда какой компонент загружается, ему нужно напоминать, что типа дружище, я там сходил обновил данные, у меня есть определенный компонент, который от этих данных зависит, поэтому ты пожалуйста свой кэш внутренний в свой рендер цикл, ты его там новый подтяни, то есть у тебя как была статическая страница, ее каркас, он такой и остался, просто мы сказали next сейчас, что нам нужно перевалидировать определенный кусок, как это можно сделать, есть вот специальный метод revalidate pass, который экспортируется из директории next кэш, что мы делаем, мы говорим ему, что сервер action сходил обновил состояние базы данных, соответственно вот этот вот зависящий кусок нам нужно перегенерировать, как я уже сказал страница как была статической, она так и осталась статической, но данные на этой статической странице теперь, ну они динамические, как бы это странно не звучало, в этом очень легко запутаться, поэтому я рекомендую вам самостоятельно тоже посидеть и поразбираться с этими примерами, как это все работает, поэтому если вы используете и хотите использовать сервер action, вам обязательно нужно следить за revalidation вашего контента, потому что если мы берем с вами react обычный по умолчанию, создаем под него какой-то свой ssr, то там этого кэша не будет, а next его предоставляет, его надо контролировать, причем что у next за последние версии стало ну прям очень много различных кэшей, поэтому друзья обязательно следите за потреблением памяти ваших приложений, потому что на текущий момент есть проблемы с утечкой картинок, но это другая история, здесь мы не будем это упоминать, вернемся к примеру, сделал я большое отступление, что я хочу сказать, как вы можете заметить, основное отличие здесь вот этих двух компонентов, это то, что клиентский компонент имеет какое-то свое внутреннее состояние, и это внутреннее состояние передает вложенному компоненту в качестве пропсов, и этот компонент на самом деле здесь без метки, он может использоваться как серверный, но в случае с когда мы импортируем его в клиентский компонент, как я уже говорил, он становится клиентским, вот, то есть тут это значение по сути оно сбрасывается, у меня есть дубль этого серверного компонента, который как раз таки уже ходит сам на сервер, он асинхронный, он самостоятельный, в примере вложенности здесь у нас никаких пробросов пропсов нет, он сам умеет извлекать данные откуда им надо, будь то это там сервер, либо же какое -нибудь хранилище, ну по сути серверный компонент на сервере, что тут еще говорить, в принципе на этом наверное все, давайте будем закругляться. По моим ощущениям видео получилось достаточно сложным, я хотел сделать его легким, в моей голове это выглядело достаточно просто, но в ходе записи я понял, что без дополнительных пояснений и вот этого прямого разжевывания, где мы с вами просматриваем полностью вкладку network, не получилось сделать, поэтому хотел бы наверное извиниться, да камон, в смысле извиниться, у меня на часах 4 утра, я уже сухожу с ума мне кажется, тем кто досмотрел это до конца, большое вам спасибо, я надеюсь что это видео было для вас полезным, все ссылки на GitHub репозиторий я оставлю в описании, вы можете зайти самостоятельно прокликать, посмотреть эти примеры, потому что ну зачем второй раз писать их и в заключение хотелось бы сказать, что серверные компоненты это все -таки достаточно комплексная механика, которая которую нужно во-первых осознать, во-вторых попытаться с помощью нее что-то сделать, посмотреть вообще нужна она вам или нет, можно очень удобно организовывать запросы к базе данных, распределять какие-то участки приложения по модулям и вас же никто прям не склоняет полноценно разбивать компоненты так, чтобы динамика у вас была исключительно только в клиентских компонентах, а какое-то взаимодействие с сервером или статик только в серверных, в идеале конечно так писать приложение, но это требует большого изменения майнцета, как я уже говорил, в это нужно в общем проинвестировать время, поэтому если вы готовы вписываться в эту авантюру и вам по какой-то причине не нравится писать на классическом реакте, на старом, где вы просто пропсами все бросаете куда угодно, имеете повсюду глобальный контекст и можете ходить хоть напрямую в Windows, это можно делать, для большинства приложений это старый подход, он как был удобным так по -прежнему им и остается, серверные компоненты это наверное ближайшее уже будущее и ребят надо быть на волне, кажется что начинаю повторяться, поэтому давайте закругляться, всем еще раз спасибо, значит вот тут для тех кто пришел с YouTube сейчас появляется QR кодик на мой канал, ссылки на GitHub репозиторий в описании, всем спасибо, всех обнял, всем пока, господи, я пошел спать, это какая-то жесть, я записал это видео.
2024-12-28 01:15
