해당 글은 2022/10/24 React Docs BETA 버전을 기반으로 작성되었습니다. 링크 React에서 props(properites)와 state는 일반 JavaScript 객체라고 한다. 두 객체는 모두 렌더링 결과물에 영향을 주는 정보는 갖고 있다. props는 (함수의 매개변수처럼) 컴포넌트에 전달되는 반면에 state는 (함수 내에 선언된 변수처럼) 컴포넌트 안에서 관리된다. state와 prop을 정리하면 아래와 같다. 둘 다 일반 자바스크립트 객체다 state는 컴포넌트 안에서 사용된다 props는 컴포넌트에 매개변수처럼 전달하는 것이다 State Props 유스케이스 뷰에 렌더링돼야 하는 컴포넌트의 데이터를 저장하는 데 사용한다. 데이터, 이벤트 핸들러를 자식 컴포넌트에 전달하는 데..
🤔Routing이란? 어떤 네트워크 내에서 통신 데이터를 보낸 경로를 선택하는 일련의 과정 - 위키백과 Router: 데이터의 경로를 실시간으로 지정해주는 역할을 하는 무언가 즉, 길잡이의 역할을 한다. Routing: 경로를 정해주는 행위와 그런 과정들을 다 포함하여 일컫는 말이다. 🤔Page Routing이란? 사용자가 요청한 URL에 따라 해당 URL에 맞는 페이지를 보여주는 것이라고 할 수 있다. 요청(Request)에 명시된 경로에 따라 알맞은 페이지를 선택하고 그 페이지를 반환해서 사용자가 해당 페이지에 접속하는 과정 자체를 Page Routing이라 한다. 👉 MPA와 SPA, SSR과 CSR 리액트와 같은 경우 단일 페이지로 구성되는 SPA 방식을 따르며 CSR으로 페이지를 렌더링 한다. ..
Memoization: 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장함으로써 동일한 계산의 반복 수행을 제거하여 프로그램 실행 속도를 빠르게 하는 기술이다. 연산의 결과값을 메모리에 저장해 두고 동일한 연산을 시키면, 다시 연산하지 않고 기억 해 두었던 데이터를 반환 즉, 재사용하는 기법 UseMemo 성능 최적화를 위하여 연산된 값(연산 결과)을 useMemo라는 Hook 을 사용하여 재사용한다. // CommentItem const [clickCount, setClickCount] = useState(0); const handleClick = () => { onClick(); setClickCount((prev) => prev + 1); // 클릭 시 숫자 증가...
