#문제발생 타입스크립트를 리액트에 처음 접목시켜보는데 에러가 발생했다. 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..

filter() Array.prototype.filter() 메서드 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환한다. map, filter, reduce는 순차적 접근 const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present']; const result = words.filter(word => word.length > 6); console.log(result); // expected output: Array ["exuberant", "destruction", "present"] 구문 arr.filter(callback(element[, index[, array]])[, thisArg]) callb..

React 시작하기 개요 목적 : 지속적으로 데이터가 변화하는 대규모 애플리케이션 구축 리액트는 Virtual DOM 방식을 사용하여 DOM 업데이트를 추상화함으로써 DOM 처리 횟수를 최소화하고 효율적으로 진행합니다. virtual DOM 사용하여 js 객체를 구성, 실제 DOM의 가벼운 사본 느낌 업데이트 처리 간결성 프레임워크 X 라이브러리 O → 뷰 이외의 기능은 다른 라이브러리 사용 ex) react-router Node.js, npm 크롬 V8 자바스크립트 엔진으로 빌드한 자바스크립트 런타임 리액트는 웹브라우저에서 실행되어 직접 연관은 없으나, 프로젝트 개발에 필요한 주요도구가 Node.js를 사용 ECMAScript 6를 호환시켜 주는 바벨(babel) 모듈화된 코드를 한 파일로 합치고(번들..

Truthy & falsy Boolean 값인 true, false 를 가지지 않음에도 불구하고 그와 비슷한 효과를 내는 값들이다. 먼저 falsy 값을 알아보자면, 다음과 같다. falsy 값의 종류 false 키워드 false 0 숫자 zero -0 음수 zero 0n BigInt. 불리언으로 사용될 경우, 숫자와 같은 규칙을 따름. 0n은 거짓 같은 값. "" 빈 string null null - 아무런 값도 없음 undefined undefined - 원시값 NaN (en-US) NaN - 숫자가 아님 falsy 값이 자바스크립트에서 불리언 값을 요구하는 부분에 들어가면, 이 값들은 false로 변환된다. 즉 조건문이나 반복문에 들어가면 false로 작동하는 것이다. if (false) if (n..