댓글기능 만들기 2 (useEffect) Hydration failed 에러 관련

Comment.js 에서 아래와 같은 에러가 발생합니다.

Error: Hydration failed because the initial UI does not match what was rendered on the server.

랜더링 되는 순서때문에 발생하는 문제 같은데, 구글링해서 

아래와 같이, useEffect와 domLoaded를 써서 해결을 했는데,

선생님 코드에서는 에러가 안나오는게 궁금합니다.

미리 답변 감사드립니다.

'use client'
import { useState, useEffect } from "react";
export default function Comment(props) {
    const [domLoaded, setDomLoaded] = useState(false);
    let [comment, setComment] = useState('')

    useEffect(() => {
        setDomLoaded(true);
      }, []);

    return(
        <>
            {domLoaded && (
                <div>
                    <div>comment</div>
                    <input onChange={(e)=>{setComment(e.target.value)}}/>
                    <button onClick={()=>{
                        console.log(comment)
                        fetch('/api/comment/new', {
                            method : 'POST', 
                            body : JSON.stringify({comment : comment, _id : props._id}),
                            })
                    }}>Submit</button>
                </div>
            )}
           

        </>
    )
}