title: Right way to handle error in getServerSideProps in Nextjs
body: <p>I am trying to handle any errors that come through getServerSideProps, which I check in via the if else condition, that works fine until I have any other hooks called like useEffect.
  When I use the hook useEffect it gives the following error - which is though correct as per hook rules.</p>
  <p>But it gives error  <em>Error: React Hook &quot;useEffect&quot; is called conditionally. React Hooks must be called in the exact same order in every component render</em>, when I use useEffect hook and do npm run build.</p>
  <p>Can someone please help me, how to handle this</p>
  <pre><code>
  
  function Test({ data }) {
      console.log(data)
  
      if (data?.err) {
           return (&lt;Error statusCode={data.err} /&gt;)
       }
  
   useEffect(() =&gt; {
     //fetch any data or do something
  
      return () =&gt; {
        
      };
    }, []);
    
  
  return(&lt;div&gt;Return Div&lt;/&gt;)
  
  }
  
  export default Test
  
  
  export const getServerSideProps = async (context) =&gt; {
  
  
    const { data } = await axios.get(`${baseUrl}HomePage/all`).catch(err =&gt; {
      const dataerr = { data: { err: `${JSON.stringify(err?.response?.status)}` } }
  
      return dataerr
    })
  
    console.log(data)
    return { props: { data } }
  
  }
  
  
  </code></pre>