question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Using the redux store without _app.js

See original GitHub issue

I have a question regarding the implementation of redux in getInitialProps in _app.js.

In order to make the new next api work (getStaticProps, getServerProps) one must get rid of getInitialProps in _app.js. Otherwise Warning: You have opted-out of Automatic Static Optimization due to getInitialProps in pages/_app.

Is there any way using the store provider outside the _app.js and at the same time using the store within the components of static pages or am I too optimistic?

As I understand the store must be provided on each SSide call. Which makes static pages basically impossible?

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:10 (4 by maintainers)

github_iconTop GitHub Comments

6reactions
jwkellyiiicommented, Mar 20, 2020

@kirill-konshin the store isn’t available when using getServerSideProps, thus just switching out getInitialProps for getServerSideProps doesn’t work

1reaction
Poky85commented, Mar 23, 2020

I found inspiration in next-with-apollo lib (which is HOC for Apollo integration). Their HOC allows usage for both app and page level.

Basically they detect app / page based on Next CTX shape and they ensure that store is created only once.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Access the Redux Store Outside a React Component
It's simple to get access to the store inside a React component – no need to pass the store as a prop or...
Read more >
Redux Fundamentals, Part 4: Store
The official Redux Fundamentals tutorial: learn how to create and use a Redux store.
Read more >
What is the best way to access redux store outside a react ...
You can use store object that is returned from createStore function (which should be already used in your code in app initialization).
Read more >
How To Manage State in React with Redux - DigitalOcean
nano src/components/App/App.js. Copy. Like with context , every child component will be able to access the store without any additional ...
Read more >
Understanding Redux: A tutorial with examples
With Redux, the state of your application is kept in a store, and each component can access any state that it needs from...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found