annyhpk.log

React

[원티드] 프리온보딩 프론트엔드 챌린지 7월 - 사전과제

1. CSR(Client-side Rendering)이란 무엇이며, 그것의 장단점에 대하여 설명해주세요. CSR은 영어 그대로 클라이언트 측 자원을 이용하여 브라우저에서 자바스크립트로 페이지를 직접 렌더링하는 것을 의미합니다. 모든 작업이 서버가 아니고 클라이언트에서 처리됩니다. - CSR 렌더링 순서 HTML load -> DOM -> JS load -> AJAX or Fetch API -> data load -> Update -> 추가 리소스 -> DOM 반영(layout - paint - composite) - CSR의 장점 서버의 부하를 줄일 수 있다. 사용자의 입력에 빠르게 반응한다. - CSR의 단점 SEO(검색엔진최적화)가 제대로 이루어지지 않을 수 있다. 구글 검색엔진은 처리가 가능하다. ..

React

React - LifeCycle 간단히 알아보기

크게 3가지 단계로는 Mount -> Update -> Unmount 로 나눠진다. 1. Mounting - 화면을 그린다. constructor - React Component 를 생성한다. : 지역 state를 초기화, 이벤트 처리 메서드 바인딩 ※ this.state나 this.setState()를 사용해야하며, props를 복사하면 안됩니다.( super(props)--X ) (New) getDerivedStateFromProps - props 로 받아온 것을 state 에 넣어주고 싶을 때 사용. render - 컴포넌트를 렌더링합니다. virtualDOM에 해당 컴포넌트를 생성. ※ 실제 DOM노트에 표시를 하는 메소드는 ReactDOM.render 메소드를 통해 표시하게 됩니다. compon..