title: Redirect shows the sign in page partially before redirecting in next js react
body: <p>I have a simple app where if a user is signed in and if the user manually tries to go to /signin page he is redirected to the index page. I'm using nextjs and to achieve this is I run a function in useEffect where boolean is checked true if so I use Router.push is used to redirect the user to the index page. The functionality works fine I see a few milliseconds of sign-in page before redirecting to the index page. Why is that? is it because the useEffect is called every time after the component is rendered? basically I want to run that code before rendering component and useEffect runs after the component is rendered. I want basically to run the code something like componentWillMount. How do I do it in the functional component? or is there any other solution?</p>
  <pre><code>const SigninComponent = () =&gt; {
  
    
  
  
  
  useEffect(() =&gt; {
    
    isAuth() &amp;&amp; Router.push(`/`);
  }, []);
  
  return(
     // components 
  );
  }
  </code></pre>