리액트를 다루는 기술

css-loader : CSS 파일 불러오기file-loader: 웹폰트, 미디어 파일 불러오기babel-loader: JS 파일 불러오면서, 최신 자바스크립트 문법으로 작성된 코드를 babel 을 사용하여 ES5 문법으로 변환.

자바스크립트의 확장 문법으로 XML과 유사하게 생겼음.HTML 태그를 사용하듯이 작성하면 됨.JSX로 작성한 코드는 브라우저에서 실행되기 전, 코드가 번들링 되는 과정에서 바벨을 사용하여 일반 JS 형태의 코드로 변환된다.보기 쉽고 익숙하다. 가독성 이즈 굿.활용도가

리액트에서 컴포넌트를 선언 하는 방식은 두가지 이다.함수형 컴포넌트클래스형 컴포넌트state 기능 및 라이프사이클 기능을 사용할 수 있다.임의 메서드를 정의할 수 있다.JSX를 반환해 주는 render 함수가 꼭 있어야 한다.

ES6의 비구조화 할당문법을 사용해, 내부값을 바로 추출하는 방법. props 값을 조회 할 때마다, props.[변수].. 이런식으로 키워드를 앞에 붙여주는 방식보다 편리하게 값조회가 가능함. > 함수의 파라미터가 객체라면 그 값을 비구조화해서 사용. 구조 분해 문

내부 컴포넌트에서 바뀔 수 있는 값.클래스형 컴포넌트가 지니고 있는 state함수형 컴포넌트에서 useState라는 함수를 통해 사용하는 state props는 부모 컴포넌트가 설정하는 값, 컴포는트 자신은 해당 props를 읽기 전용으로만 사용할 수 있다.수정을 하려

리액트 v 16.8 이전에는 함수형 컴포넌트에서 state를 사용할 수 없었지만리액트 v 16.8 부터는 Hooks을 사용해서, 사용할 수 있게 됬다.state 값을 바꿀때는 setState나 useState를 사용해야 한다.배열이나 객체를 수정해야 한다면, 객체를 복

새 메서드를 만들때 마다 constructor를 수정해야 하는 번거러움을 덜기 위함.babel의 transform-class-properties문법을 사용해 화살표 함수로 메서드를 정의한다.p.130 - 132