Window not defined

#javascript #beginners #nextjs #webdev

Server Error
ReferenceError: window is not defined

Can't surpass this error...

code:https://gist.github.com/Jishnu-02/b90cab1c887ac8b64122ffbb29844313

Top comments (6)

Sylvie Fiquet • Nov 12 '21

I don't get what your point is, are you asking for help?

It's normal to get an error, window is not defined on the server. Remember that Next runs your code on the server when building the HTML file.

Initialise your state to 0 and update it to window.innerWidth in useEffect.

Jishnu-02 • Nov 12 '21

can u show me how to do it?

Sylvie Fiquet • Nov 12 '21

Something like that:

const [windowWidth, setWindowWidth] = useState(0)

// runs only once, on mount
useEffect(() => {
  if (window !== undefined){
    setWindowWidth(window.innerWidth)
    window.addEventListener('resize', handleWindowWidth)
  }
}, [])

Jishnu-02 • Nov 15 '21

Thank You.

majkl zumberi • Nov 12 '21

You are using next.js so you can use Window only client side, which means you can use It only on useEffect hook.

Window Is not defined on serverside

Jishnu-02 • Nov 12 '21

can u show me how to do it?

DEV Community

Window not defined

Top comments (6)

Read next

How to Build a Dark Mode Admin Dashboard with Tailwind CSS

Exploring Java's Role in Cloud Computing and AI for 2024

How To Use Housing App Full Tutorial

Créer une Radio en Ligne avec l'API Radio Browser