Best way to handle maintenance mode in a nextjs app ?
Unanswered
Sun bear posted this in #help-forum
Sun bearOP
i heard some people reccomend middleware, edge config others said redirects in the next config looking for some advice on whats best here. ideally for it to be instant instead of having envs and redeploying. thanks in advance.
62 Replies
feature flags
you turn it on from backend
Sun bearOP
do you mind elaborating more on it please
https://flags-sdk.dev/ this should be helpful although I've never used it
you create a feature flag which toggles the maintenance mode
you create a feature flag which toggles the maintenance mode
when that feature flag returns true, you show your maintenance screen
Sun bearOP
right
would you place this in the middelware
i dont think the root layout is a good place as that would make my whole app shell dynamic
i was thinking root layout so i can donitlaly render children or the miantanace screen
have a dynamic server component in root layout. It gets the value of this flag and then redirect user to /under-maintenance?callback=currentUrl and you render that page there
Sun bearOP
and the currentUrl is for them to retry ?
but would that not make the app shell dynamic like all the children would be dynamic
since we used it in the layout ssr?
Sun bearOP
i see
the page would be blocked for a little sec
since its not suspended
@Sun bear and the currentUrl is for them to retry ?
yea you can redirect user to currentUrl if they press retry(or any other logic)
not too sure about that but a loading.tsx should take care of it
you can just return null from that component
so it won't render any UI
in next16 you can put that in async component in <Suspense> and still have static shell (and the rest of the children)
hell if you have a static site, why would you need "under maintenance" ? just use client component ?
hell if you have a static site, why would you need "under maintenance" ? just use client component ?
Sun bearOP
its not a static site
its a webapp
has marketing page
and dashboard
using external backend api
for data source
and you only want to put under maintenance in the dashboard/dynamic part right?
Sun bearOP
i might consider the @Yi Lon Ma approach or even the edge middleware
not really since the marketing page also renders dynamic data
from the api
like recent payouts etc
so i would just like to block the users from going anywhere
just a redirec to maintance
untill its back
usually those data are cached so it uses SWR
which is ideal since you dont have to display unknown data if its under maintenance
Sun bearOP
i would just render a new route /maintantace
okay if uhh your users are fine with that
Sun bearOP
yeah
that would be the preffered
so maybe just middleware + feature flag cehck
let us know if it works so we can mark yi's answer
Sun bearOP
so i use the flag packg from nextjs
would i be able to see it on my vercel dashboard
and enable it on and off
or how would i toggle it
what if i was to use edge config @alfonsüs ardani @Yi Lon Ma
dk what that is, sorry
ditto 😭 sorry
i know how to cache marketing page 
but idk anything about maintenance mode
but idk anything about maintenance modeMagnolia Warbler
I shutdown the app service in systemd and my Nginx config has a fallback page
American Sable
im also interested in this, can someone ping me when there is a solution?
Sun bearOP
yeah so i tought the edge config could be a could idea
but shit is expesinve
5$ for 500 writes and 3$ 1M Reads
so if i place that in the middleware the 1M requests are gonna fly i have 10+ routes which this runs on.
still looking for something else
might have to look into feature flags