백엔드 개발 블로그

React 17 버전을 기준으로 작성된 글입니다. (2022/04) TL;DR // KakaoAdfit.jsx import {useEffect, useRef} from "react"; function KakaoAdFit({unit, width, height, disabled}: any) { const scriptElementWrapper = useRef(null); useEffect(() => { if (!disabled) { const script = document.createElement("script"); script.setAttribute("src", "https://t1.daumcdn.net/kas/static/ba.min.js"); scriptElementWrapper.current.appe..

React 17 버전을 기준으로 작성된 글입니다. (2022/04) React Hook 기존 리액트에서는 간단한 형태의 컴포넌트는 함수로 표현할 수 있었지만, 상태 등을 저장하기 위해서는 클래스로 작성해야 했다. React Hook은 useState, useEffect와 같은 메커니즘을 추가하여 함수 형태로도 복잡한 컴포넌트를 작성할 수 있도록 했다. 기존 클래스 구조의 컴포넌트에 있었던 몇가지 문제들을 해결하고자 하였다. 참고: https://reactjs.org/docs/hooks-intro.html#motivation 기존의 클래스 컴포넌트와의 호환성 기존 리액트 코드를 그대로 사용할 수 있다. 기존 리액트 컨셉과 다르지 않으며, 오히려 더 직관적인 부분이 있다. 클래스 컴포넌트와 hook이 사용된..