I'm still confused about how the state is stored across navigations. I'd think either you don't perform a full navigation or you store state in local/session storage. Which is it when using Context API on the app component?
Is the Context API somehow using local storage under the hood, abstracted from us, or does this only work when using NextJS as CSR and not when using SSG?
Edit: I understand now! The key is that even for SSG Nextjs actually performs a client-side navigation when using the Link component, instead of a full page refresh, as they mention in the docs for routing:
nextjs.org/docs/routing/introduction
"The Next.js router allows you to do client-side route transitions between pages, similar to a single-page application.
A React component called Link is provided to do this client-side route transition."
This is well written but it feels like it's half of a tutorial. The above implementation is completely unusable because the value of the context is going to be reset any time the user. I'm sorry but I'm just so frustrated. Every. Single. Tutorial about Contexts and NextJS is like this. I keep searching and searching for an example of actually using these things but all I get is articles like this one, where you're just using the context as a place to store data for a single page.
Contexts are useful because they allow components and pages to share state, right? Well then, what is the point of using one if your state is just going to be reset whenever you redirect? What is the point of having login data that disappears when you change pages? Am I missing something here? I do not understand how the above example is useful in any way if the context is just reset to the default value every time you redirect to a new page.
Edit: Yeah I was missing something. Sorry lol. I just needed to use <Link> to redirect instead of vanilla <a> tag. Maybe include that in the article for future dummies?