title: localstorage not defined in Next.js
body: <p>im trying to move an application from React to Next</p>
  <p>In React I get no error on this code</p>
  <pre><code>let [authTokens, setAuthTokens] = useState(() =&gt; localStorage.getItem('authTokens') ? JSON.parse(localStorage.getItem('authTokens')) : null)
  
  let [user, setUser] = useState(()=&gt; localStorage.getItem('authTokens') ? jwt_decode(localStorage.getItem('authTokens')) : null)
  
  </code></pre>
  <p>but when I try to use it in Next, I get the error</p>
  <p><a href="https://i.stack.imgur.com/Yj20d.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Yj20d.png" alt="localStorage is not defined" /></a></p>
  <p>Which I assume is because Next is rendering on server side first and theres no local storage on server side.</p>
  <p>This is the function that's setting the local storage.</p>
  <pre><code>let loginUser = async (e) =&gt; {
          e.preventDefault();
          let response = await fetch('http://127.0.0.1:8000/api/token/', {
              method:'POST',
              headers:{
                  'Content-Type': 'application/json'
              },
              body:JSON.stringify({'email':e.target.username.value, 'password':e.target.password.value})
          })
          let data = await response.json()
          console.log(data)
          console.log(data.access)
          if(response.status == 200) {
              setAuthTokens(data)
              setUser(jwt_decode(data.access))
              localStorage.setItem('authTokens', JSON.stringify(data))
              router.push('/')
          } else {
              alert('something went wrong')
          }
      }
  </code></pre>