How to properly organize the request structure in Next.js?

Question

React

Hello!

I am writing a small cafe aggregator. In the process of migrating the project from React.js to Next.js, I re-read all the documentation several times, but did not find recommendations for solving a couple of tasks. Any help will be infinitely glad :)

1. Asynchronous initialization of the store when starting the project.
On the aggregator, almost every page uses tags to determine the type of a particular institution. Tags are initially created in the admin panel and are updated about once every half a year. It would be logical to request all the tags at the start of next.js and put them in the store on the server, and then pick up the necessary ones in getServerSideProps. But unfortunately I can’t understand how best to implement this in next.js ..

2. Getting the user’s city
We have a request to get the user's current location relative to his IP.
This request must be made the first time you visit the site and saved to the client store, as well as cached by some kind of persister. But then again, how to do it in next.js turned out to be a difficult task for me :/

Answer 1

1. when building a webpack project, get data from some URL (google async webpack operations, custom nextjs webpack plugin), put it in a file on the server, then you can use it through the usual require
2. we do this: in getInitialProps on the server the context has a req, we pick it up by the header (forwarding either cloudflare or you can do it yourself in nginx) or through the standard IP address mechanism. We put it in the store, exit getInitialProps