Управление глобальным состоянием пользователя в приложении next.js

Я пришел из мира SPA и REST / GraphQl API. Сейчас я создаю личный проект с библиотекой Next.js для приложения SSR (Server Side Rendered) React App.

Поскольку я использовал Redux во всех своих одностраничных приложениях, теперь мне интересно, как мне управлять состоянием пользователя, когда каждый пользователь маршрута посещает, загружается новая ссылка и страница обновляется.

Я нашел некоторую информацию о сеансах и файлах cookie, но ни один из них мне не знаком. Я просмотрел несколько статей в Интернете об использовании Redux с Next.js, но это кажется сложным.


node.js next.js server-side-rendering react-state-management global-state
person Pavle    schedule 12.07.2019    source источник

Ответы (2)


arrow_upward
10
arrow_downward

Давайте упростим работу Next: браузер отправляет запрос на сервер, Next отображает на стороне сервера, возвращает html, затем Next обновляет страницу, и теперь она ведет себя как SPA.

Далее есть папка с примерами в основном для каждой технологии, включая redux.

Ознакомьтесь с примером сокращения.

person felixmosh    schedule 26.10.2019

arrow_upward
2
arrow_downward

Если вы привыкли делать это на основе маршрутов, это может помочь понять:

  1. все приложение (_app.js) заключено в Provider для redux, поэтому все pages и компоненты в приложении могут получить доступ к store.
  2. согласно документам: 
    otherwise different user data can be mixed up. On the client side the
same store is used, even between page changes.```
  3. Таким образом, ваше приложение будет воссоздавать хранилище при каждом запросе, но передаст request, url и, возможно, даже results (запроса) в начальное состояние store, чтобы каждая страница и компонент могли использовать store перед рендерингом.
  4. также checkout getInitialProps, который выполнит некоторый побочный эффект перед рендерингом компонентов на странице и предоставит данные реквизитам страницы.

некоторые ресурсы:

person K.H. B    schedule 28.10.2019