useCallback이란? useCallback은 리렌더링 간에 함수 정의를 캐싱해 주는 React Hook입니다. -- 리액트 공식문서 결론만 말하면 함수가 리랜더링 되는 것을 방지해주는 훅 중 하나이다.. 레퍼런스 const cachedFn = useCallback(fn, dependencies) 매개변수 fn: 캐싱할 함숫값입니다. 이 함수는 어떤 인자나 반환값도 가질 수 있습니다. React는 첫 렌더링에서 이 함수를 반환합니다. (호출하는 것이 아닙니다!) 다음 렌더링에서 dependencies 값이 이전과 같다면 React는 같은 함수를 다시 반환합니다. 반대로 dependencies 값이 변경되었다면 이번 렌더링에서 전달한 함수를 반환하고 나중에 재사용할 수 있도록 이를 저장합니다. Reac..
react.memo란? memo를 사용하면 컴포넌트의 props가 변경되지 않은 경우 리렌더링을 건너뛸 수 있습니다. - react 공식문서 일반적으로 부모 컴포넌트가 리랜더링 되면 자식 컴포넌트도 리랜더링 된다. props 받든 안받든, props가 변경이 되든 안되든... 하지만 state가 변경되지도 않았는데, 리랜더링이 되면 성능적으로 낭비이기 때문에 컴포넌트의 props가 변경 되지 않은 경우에는 리랜더링을 하지 않도록 memoize한다. 이때 사용 할 수 있는게 react.memo이다. ※ memoize란? props와 동일하다면 부모가 리렌더링될 때 새로운 props가 이전 props와 동일하면 리렌더링 되지 않는 컴포넌트를 만들 수 있습니다. 이러한 컴포넌트를 memoized 상태라고 합니..
LOOP문 내에서 프로시저를 호출하는데, 계속 에러가 발생하길래 확인을 하면서 많은 시간을 날렸다.. 간단한거였는데.. 그래서 정리해봄.. 에러내용 SQL Error [42601]: 오류: 쿼리에 결과 데이터의 대상이 없음 Hint: SELECT의 결과를 취소하려면 대신 PERFORM을 사용하십시오. Where: PL/pgSQL 함수 "dkasjmp.duplicate_sj_safe_child(text,text,text,text,text)" 의 17번째 SQL 문 프로시저 쿼리문 CREATE OR REPLACE FUNCTION public.my_procedure(target_num text) RETURNS integer LANGUAGE plpgsql AS $function$ declare rec RECOR..
useReducer 훅이란? useReducer useReducer는 컴포넌트에 reducer를 추가하는 React Hook입니다. -- react 공식문서 어렵게 생각하지 않아도 된다. 그냥 useState와 같이 컴포넌트의 상태를 관리하기 위한 react의 훅인데, useState와는 달리 컴포넌트 내부에서가 아닌 외부에서도 컴포넌트의 상태를 관리 할 수 있도록 도와주는 훅이다.. useReducer를 사용하면 컴포넌트 외부에서도 상태 관리 코드를 작성할 수 있게 되기 때문에 복잡한 상태관리 로직을 모듈로 빼서, 컴포넌트 코드의 가독성을 높일 수 있다... 컴포넌트라는게 UI랜더링을 하기 위해 사용하고 이 랜더링을 위해 필요한 게 컴포넌트의 상태관리이다. 근데, state가 점점 많아지고, 로직이 복..
전개구문이 뭔지 모르는 사람은 아래 링크 참조 [JS] ES6문법 : 전개구문 ( Spread Syntax )에 대해 알아보자 ( 배열 및 객체 복사 , ... 문법 ) [JS] ES6문법 : 전개구문 ( Spread Syntax )에 대해 알아보자 ( 배열 및 객체 복사 , ... 문법 ) 오늘은 ES6에서 추가 된 문법인 전개구문( Spread Syntax )에 대해 알아보자. 배열이나 객체를 복사하여, 새로운 배열 및 객체를 생성 할 때 사용하는 문법으로, 연결 및 복사 할 때 유용하게 쓰이는 bongra.tistory.com 글을 쓰게 된 계기 이번에 리액트를 공부하면서 인강을 듣는데, 왠걸 전개구문을 써서 그러려니 했다. (나는 평소에 전개구문 잘 안씀.. 객체나 배열을 재참조 해야 하는 경우 ..
useEffect 학습전, 리액트의 라이프사이클에 대한 이해 리액트에서의 라이프 사이클은 크게 3단계로 나뉜다. 탄생 => 변화 => 죽음 이런 느낌인데.. 그래서 제어도 크게보면 저 3단계로 이루어진다. (물론 라이프사이클 조금 더 들어가면 많다.. 그건 다음에 라이프사이클 공부하면서 정리해야지...) useEffect 훅을 이용하면 리액트의 라이프사이클 중 개발자가 원하는 시점을 잡아서 원하는 로직을 콜백함수에 담아 호출 할 수 있다. useEffect 훅이란? useEffect란 컴포넌트의 사이드 이펙트를 제어하기 위해서 16.8버전에 추가 된 훅 중 하나로, 여기서의 사이드 이펙트란 부정적인 효과가 아닌, 컴포넌트의 변화에 따라 생기는 여러 효과를 의미한다. 결국 useEffect는 컴포넌트의 동..