도영스 공간

🤩 이벤트 버블링이란❓ 🌱 이벤트 버블링은 특정 화면 요소에서 이벤트가 발생했을 때 해당 이벤트가 더 상위의 화면 요소들로 전달되어 가는 특성을 의미합니다. HTML요소는 트리 형식으로 랜딩페이지에서 가 최상위 요소가 됩니다. 그 밑으로 자식 요소들이 있게 됩니다. 브라우저는 이벤트를 하위 컴포넌트에서 상위 컴포넌트로 전파시키는 방식을 뜻합니다. 이벤트 버블링이란 한 요소에 이벤트가 발생하면 이 요소에 할당된 핸들러가 동작하고, 이어서 부모 요소의 핸들러가 동작하고 최상단의 부모 요소를 만날 때까지 반복되면서 핸들러가 동작하는 현상을 말합니다. 🤩 이벤트버블링을 막는 방법❓ 🌱 event.stopPropagation() 이벤트의 전파를 원하지 않을 경우 이벤트 객체의 메서드인 event.stopPropa..

🤩 메모이제이션이란?❓ 🌱 메모이제이션은 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장함으로써 동일한 계산의 반복 수행을 제거하여 프로그램 실행 속도를 빠르게 하는 기술입니다. 동적 계획법의 핵심이 되는 기술입니다. 🍄 리액트에서 제공하는 메모이제이션 기법은 아래 메소드들을 통해서 사용할 수 있습니다. -👩‍💻 React.memo(컴포넌트), useCallback(() => { 함수 그 자체... }, []), useMemo(() => 함수의 리턴 값, []) 🍄 react의 메소드들은 어떤식으로 메모이제이션을 하고 있을까요? -👩‍💻 React.memo()는 props의 값으로 변경을 확인합니다. -👩‍💻 useCallback()과 useMemo()는 depende..

🤩 이벤트 위임이란❓ 🌱 이벤트 위임이란 하위 요소마다 이벤트를 붙이지 않고 상위 요소에서 하위 요소의 이벤트들을 제어하는 방식을 말합니다. 부모 안에 있는 자식들에게 공통적으로 무언가 처리해야 할 때 일일히 이벤트 리스너를 자식 노드에 추가하는 것은 좋지 않습니다.이벤트 버블링을 응용하여 부모 엘리먼트에 리스너를 위임하여 부착하면, 리스너의 개수를 1개로 줄여 최적화할 수 있습니다. 🍄 이벤트 위임의 동작 컨테이너에 하나의 핸들러를 할당합니다. 핸들러의 event.target 을 사용해 이벤트가 발생한 요소가 어디인지 알아냅니다. 원하는 요소에서 이벤트가 발생했다고 확인되면 이벤트를 핸들링합니다. 🍄 이벤트 위임의 장점 요소를 추가하거나 제거할 때 해당 요소에 할당된 핸들러를 추가하거나 제거할 필요가 ..

🤩 SEO란❓ 🌱 SEO(Search Engin Optimization: 검색엔진최적화) 네이버나 구글같은 검색 엔진에 뭔가를 검색했을 때, 내가 만든 사이트가 검색 결과에 더 잘 보이게 하기 위한 과정입니다. 검색을 하면, 검색 엔진이 내 사이트 내용물(메타 태그, html 내용 ...)을 한 번 훑어가고(크롤링), 내용물에 특정한 인덱스 같은 걸 만듭니다. 그리고 이 인덱스 같은걸 검색 결과에 보여줍니다. 검색 엔진 최적화는 검색 엔진이 내 사이트를 크롤링할 때 정보를 더 잘 가져갈 수 있도록 도와주는 과정이기도 합니다. SEO에서 얘기 하는 것은 구글의 검색엔진이 찾을 수 있고, 이해할 수 있는 사이트를 만들라는 것이다. 그렇게 하기 위해서는 아래의 요건들을 체크해볼 필요가 있습니다. 🍄 robot..