Как отдать на клиент страницу с данными из бд [2020 React SSR with Hook]?
Доброго времени суток. Делаю первые шаги ( ну не совсем первые около месяца подсел на эту тему) С редером реакт приложения на стороне сервера. Для своего проекта я не стал использовать NEXT.js ( там бы я смог решить свою проблему с получением данных и выдаче клиенту страницы уже с данными , прям из коробки с помощью встроенного в next способа.) Но я не пошел по этому пути. Для рендера реакт приложения на стороне сервера, я использую библиотеку RAZZLE. Мне она очень понравилась , можно использовать с CRA вообще без проблем . Кастомизируй как хочешь.
Благополучно прикрутил react-router, Helmet , Redux. Методом renderTostring получаю готовый html передаю на клиент все здорово.
Застрял я с данными. Не знаю правильно ли я понял. Но ,логика возможно должна быть такая. Сначала Сервер отдает разметку без данных . Потом на стороне клиента идет запрос на получение данных. После чего сервер используя метод renderToNodeStream, должен выполнить 2 рендер на стороне сервера и выдать уже html страницу с данными. И моя проблема в том, что я не понимаю, как инициировать 2 рендер на стороне сервера. Видел пару примеров как это делают используя классовые компоненты react — объявляют компоненту статичный метод, который затем вызывается на сервере. Но вот беда я использую хуки а useEffect не работает на сервер(. Вообщем засел с этим. И не могу нигде найти статью или пример. Работающего приложения с использованием хуков
ssr должен отдавать законченную разметку содержащую всю необходимую информацию. Иначе в нем попросту нет смысла. Запросы к БД это асинхронные операции, а рендер реакта нет. Вызов рендера сравним с вызовом обычной функции, которая вернет результат по выполнению. Она конечно запустит асинхронные обращения к БД, но дожидатся их окончания не будет. Поэтому хуки, которые не являются сервисами, а предназначены для иметации тела класса, не способны разрешить вашу проблему. Хуки созданы для разделения логики работы непосредственно с шаблоном между компонентами. Вы должны строить приложение таким образом чтобы рендер был выполнен со всеми необходимыми данными. Простыми словами работа с данными должа быть вынесена на сервисный слой, который по завершению инициализации используется реактом для получения необходимых данных.
Простой
