Unfortunately, unlike Heroku, Netlify & Vercel don’t have a simple switch for maintenance mode.
Netlify
Utilize split testing
- Create a separate branch with the maintenance view. Could be a simple HTML.
- Route 100% of the traffic to this branch
Vercel
Split testing is not available, but we can utilize env variables.
- Set up a
MAINTENANCE
flag in env variables - Trigger a re-deploy.
pages/_app.tsx
const MyApp: React.FC<AppProps> = ({Component, pageProps}) => {
if (process.env.MAINTENANCE) {
return <Maintenance />;
}
return <Component {...pageProps} />;
};
export default MyApp;