리덕스 어플리케이션의 state를 관리하기 위한 JavaScript 오픈소스 라이브러리. 리덕스 이전에는 양방향 데이터 흐름으로 프로젝트가 커질수록 불편과 혼란을 야기 트렌드나 관리가 복잡해짐에 따라 단방향 데이터 흐름이란 특징을 갖는 flux를 개발 React + flux 구조에 reducer를 추가하여 리덕스 탄생. 리덕스가 필요한 이유 리덕스가 없을 때의 코드는 컴포넌트끼리 강하게 커플링(의존)되어있다. 그래서 있다고 기대하며 작동했는데 해당 내용이 없는 경우에 에러가 발생한다. 리덕스는 중개자 역할로 상태를 중앙집중적으로 관리할 수 있다. 리덕스 구성요소 store : 정보가 저장되는 곳. 전역적으로 호출 가능 ex)은행 state : 실제 정보. readonly 이어야함. ex) 돈/장부 red..

Re-rendering in React observing virtual DOM and change the real DOM from virtual DOM to real DOM 출처: https://aboveimagine.tistory.com/101 [비전공자의 IT 취업이야기:티스토리] 리액트에서 컴포넌트가 리렌더링이 되는 조건 본인이 가진 state에 변화가 생겼을 때 부모 컴포넌트가 리렌더링되었을 때 내려받은 props가 변경되었을 때 컴포넌트 최적화 useMemo React Hooks, 컴포넌트 내부에서만 사용 가능 함수가 아닌 값을 반환 값을 메모이제이션 React.memo HOC,고차 컴포넌트 강화된 컴포넌트를 반환함 컴포넌트를 메모이제이션 useCallback 메모이제이션된 콜백을 반환

#문제발생 타입스크립트를 리액트에 처음 접목시켜보는데 에러가 발생했다. Type '{ diaryList: ListType[]; }' is not assignable to type 'IntrinsicAttributes & ListType[]'. Property 'diaryList' does not exist on type 'IntrinsicAttributes & ListType[]'. ts(2322) What are IntrinsicAttributes in TypeScript? IntrinsicAttributes interface can be used to specify extra properties used by the JSX framework which are not generally used by t..

Props Definition 컴포넌트 속성을 설정할 때 사용하는 요소 Properties의 줄임말로, 부모 컴포넌트의 데이터를 자식 컴포넌트에게 전달할 때 사용하는 단일 객체 전달된 후에는 변수를 통해 접근이 가능함 HTML요소는 속성을 가지고 있고, React 컴포넌트는 props를 가지고 있다. prop="value" (HTML 속성과 동일한 구문) 특징 단방향unidirectional (부모→자식) readonly defaultProps : 기본값 설정 Hello.defaultProps = { name: '이름없음' } props.children : 태그 사이의 내용을 보여줌 리액트 // '리액트' 부분 비구조화할당(구조분해할당) 참고 : 구조 분해 할당 var a, b, rest; [a, b] ..

* 본 포스팅의 내용은 캡틴판교님의 강의 "인프런 타입스크립트 입문 - 기초부터 실전까지"를 수강하며 정리한 내용입니다. Definition 자바스크립트에 타입을 부여한 언어, 자바스크립트의 확장된 언어 브라우저에서 실행하려면 컴파일이 필요함 Why 에러의 사전 방지 타입을 지정함으로써 의도치 않은 코드의 동작을 예방 개발 생산성 향상 코드 가이드 및 자동완성 Fundamentals Basic type Boolean Number String Object {key: type, key: type}{name: string, age: number} Array : number[] : Array Tuple 배열의 길이가 고정되고 각 요소의 타입이 지정되어 있는 배열 형식 배열의 각 인덱스에 타입을 정의함 : [st..

# 문제점 타입스크립트를 공부하던 중 위와 같은 오류가 발생했다. 실제로 실행은 문제가 없는 오류. 바로 EOL sequence (line break, EOL(end-of-line)) 때문이다. EOL sequence CR, LF 그리고 CRLF의 방식이 있는데, 운영체제에 따라 기본 방식이 다르다. Microsoft 사의 Windows 는 CRLF (\r\n) 을 기본으로 사용하는 반면 Unix/Linux 에서는 LF (\n) 만으로 줄바꿈을 하고 있다. (Mac 의 초기 버전, 9 버전 이하는 CR (\r) 을 줄바꿈으로 사용) 출처: https://technote.kr/300 [TechNote.kr:티스토리] 즉, 나는 윈도우를 사용하고 있고 윈도우의 엔드라인 시퀀스를 eslint 인식하지 못 해 ..