useIsClient

Returns true if the code is running in the browser and false if it is running on the server.

Note

This hook is essential for preventing hydration mismatch errors in SSR frameworks like Next.js or Remix. Use it to conditionally render components that rely on browser-only APIs.

Installation

bash

Description

The useIsClient is essential for SSR (Server-Side Rendering) environments like Next.js or Remix. It ensures that components requiring browser-only APIs (like window or document) only execute logic or render specific UI elements after the component has hydrated on the client, preventing hydration mismatch errors.

Return values

NameTypeDescription
isClientbooleantrue if the component is mounted in the browser, false otherwise.

Demo

Is Client?

Current environmentServer-side

Source code

tsx