Hi! how can i handle state in .astro files? As per the doc, Using nanostores for .astro files isnt recommended, Should i use the localstorage api? Its a navbar state (open/closed)
#Handling state in .astro files
jaunty skiff
umbral charm
You can use nanostores within an Astro file as long as you're within a <script> tag. If you're behind the code fence (between the --- and ---), you shouldn't, because that's server-side code.
fleet hamlet
this a classic, when moving from SPA to an MPA. First are you ssg or ssr ? and if ssr do you target serverless, cause that's the only reason why states can't be persisted in mem, but on node you're fine, but not req specific though.
more on states and Astro here https://stackoverflow.com/questions/74784560/how-to-share-state-among-components-in-astro/74840400#74840400
a cookie with a blocking script could do, to avoid flash of wrong nav state, handling that on server side would need session management.
jaunty skiff
alright i want it to be serverless ill go with the nanostores one thanks!
umbral charm
Why do you need any knowledge of the navbar state on the server side? 🤔 I would just default to closed and store a boolean in a client-side <script> tag. If you need that state from multiple components, I'd use a nanostore, also in a client-side <script> tag.
Server-side state is a whole different beast than client-side state and should be avoided until you absolutely need it.
fleet hamlet
Why do you need any knowledge of the navbar state on the server side? 🤔 I would...
then you either get a flash of wrong state until client js reacts, or need to block any rendering until js executes.