본문 바로가기

전체 글148

[항해99 94일차] 2022.06.08 TIL (리액트 왜 사용하시나요 ? ) 리액트를 왜 사용하는지에 대한.. 답들을 정리해보겠다 ! 🤩 리액트 왜 사용하시나요❓ 🌱 Virtual DOM의 존재합니다. 리액트의 가장 큰 특징 중 하나이기도 합니다. 기존의 DOM은 페이지가 바뀔 때마다, 새 HTML를 로드하면서 DOM 전체를 바꾸게 됩니다. Virtual Dom은 React 컴포넌트가 리턴하는 값에 의해 만들어져서 실제 보이고 있는 DOM과 비교해서 달라진 부분만 찾아내어 바꾸게 됩니다. 이러한 Virtual DOM 때문에 React에서 컴포넌트 단위의 개발이 가능하게 됩니다. React Native의 앱 개발 가능합니다. 개발을 하다보면 막히는 부분, 오류가 있는 부분이 생깁니다. Vue에 비해 사용자가 많고, facebook에서 만들어 계속되는 업데이트와 자료가 굉장히 방대합.. 2022. 6. 8.
부모에서 자식으로 이벤트상속방법 🤩 부모에서 자식으로 이벤트상속방법❓ 🌱 이벤트 캡처링으로 부모에서 자식으로 이벤트를 상속할 수 있습니다. 이벤트 캡처링은 이벤트 버블링과 반대로 상위 요소에서 하위 요소로 탐색하며 이벤트를 전파하는 방식입니다. (부모 -> 자식) 🍄 event delegation(이벤트 위임)에 대해 설명하세요. -👩‍💻 특정 요소 하나하나를 개별적으로 이벤트를 부여하는 것이 아니라, 하나의 부모에 이벤트를 등록하여 부모가 이벤트를 위임하는 방식을 이벤트 위임이라고 합니다. 이 방법은 동적인 요소들에 대한 처리가 수월하며 이벤트 핸들러를 더 적게 등록해 주기 때문에 메모리도 절약할 수 있습니다. 하위 요소에 각각 이벤트를 붙이지 않고 상위 요소에서 하위 요소의 이벤트들을 제어하는 방식입니다. 면접을 위해 계속 무한 반.. 2022. 6. 8.
이벤트 버블링이란 / 이벤트버블링을 막는 방법 /이벤트버블링 활용 방법 🤩 이벤트 버블링이란❓ 🌱 이벤트 버블링은 특정 화면 요소에서 이벤트가 발생했을 때 해당 이벤트가 더 상위의 화면 요소들로 전달되어 가는 특성을 의미합니다. HTML요소는 트리 형식으로 랜딩페이지에서 가 최상위 요소가 됩니다. 그 밑으로 자식 요소들이 있게 됩니다. 브라우저는 이벤트를 하위 컴포넌트에서 상위 컴포넌트로 전파시키는 방식을 뜻합니다. 이벤트 버블링이란 한 요소에 이벤트가 발생하면 이 요소에 할당된 핸들러가 동작하고, 이어서 부모 요소의 핸들러가 동작하고 최상단의 부모 요소를 만날 때까지 반복되면서 핸들러가 동작하는 현상을 말합니다. 🤩 이벤트버블링을 막는 방법❓ 🌱 event.stopPropagation() 이벤트의 전파를 원하지 않을 경우 이벤트 객체의 메서드인 event.stopPropa.. 2022. 6. 8.
메모이제이션이란? 🤩 메모이제이션이란?❓ 🌱 메모이제이션은 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장함으로써 동일한 계산의 반복 수행을 제거하여 프로그램 실행 속도를 빠르게 하는 기술입니다. 동적 계획법의 핵심이 되는 기술입니다. 🍄 리액트에서 제공하는 메모이제이션 기법은 아래 메소드들을 통해서 사용할 수 있습니다. -👩‍💻 React.memo(컴포넌트), useCallback(() => { 함수 그 자체... }, []), useMemo(() => 함수의 리턴 값, []) 🍄 react의 메소드들은 어떤식으로 메모이제이션을 하고 있을까요? -👩‍💻 React.memo()는 props의 값으로 변경을 확인합니다. -👩‍💻 useCallback()과 useMemo()는 depende.. 2022. 6. 8.
이벤트 위임 🤩 이벤트 위임이란❓ 🌱 이벤트 위임이란 하위 요소마다 이벤트를 붙이지 않고 상위 요소에서 하위 요소의 이벤트들을 제어하는 방식을 말합니다. 부모 안에 있는 자식들에게 공통적으로 무언가 처리해야 할 때 일일히 이벤트 리스너를 자식 노드에 추가하는 것은 좋지 않습니다.이벤트 버블링을 응용하여 부모 엘리먼트에 리스너를 위임하여 부착하면, 리스너의 개수를 1개로 줄여 최적화할 수 있습니다. 🍄 이벤트 위임의 동작 컨테이너에 하나의 핸들러를 할당합니다. 핸들러의 event.target 을 사용해 이벤트가 발생한 요소가 어디인지 알아냅니다. 원하는 요소에서 이벤트가 발생했다고 확인되면 이벤트를 핸들링합니다. 🍄 이벤트 위임의 장점 요소를 추가하거나 제거할 때 해당 요소에 할당된 핸들러를 추가하거나 제거할 필요가 .. 2022. 6. 8.
SEO란? 🤩 SEO란❓ 🌱 SEO(Search Engin Optimization: 검색엔진최적화) 네이버나 구글같은 검색 엔진에 뭔가를 검색했을 때, 내가 만든 사이트가 검색 결과에 더 잘 보이게 하기 위한 과정입니다. 검색을 하면, 검색 엔진이 내 사이트 내용물(메타 태그, html 내용 ...)을 한 번 훑어가고(크롤링), 내용물에 특정한 인덱스 같은 걸 만듭니다. 그리고 이 인덱스 같은걸 검색 결과에 보여줍니다. 검색 엔진 최적화는 검색 엔진이 내 사이트를 크롤링할 때 정보를 더 잘 가져갈 수 있도록 도와주는 과정이기도 합니다. SEO에서 얘기 하는 것은 구글의 검색엔진이 찾을 수 있고, 이해할 수 있는 사이트를 만들라는 것이다. 그렇게 하기 위해서는 아래의 요건들을 체크해볼 필요가 있습니다. 🍄 robot.. 2022. 6. 7.

티스토리툴바