[ React.js ] 웹페이지 제목 바꾸는 방법 / How to change title of React web project

안녕하세요 상훈입니다. 

React.js 에서

웹 페이지에서 탭 부분의 텍스트. 즉, 웹사이트의 이름(title)을 바꾸는 방법을 포스팅하겠습니다.

예시) 티스토리 글쓰기 화면 title

 

아주 간단합니다.

해당 페이지에서 useEffect() hook을 하나 생성해주시고, title이라는 태그를 찾아 내부 html의 값을 변경시켜주시면 됩니다.

  useEffect(() => {
    const titleElement = document.getElementsByTagName("title")[0];
    titleElement.innerHTML = `나의 웹페이지 제목`;
  }, []);

getElementsByTagName으로 title이라는 tag의 첫번째 요소[0] 를 html에서 찾습니다. 

그리고 해당 요소의 내부 html의 값을 변경해줍니다. 

 

그러면 깔끔하게 바로 바뀌는 것을 확인할 수 있습니다.