React(2)
-
Component, props, state
1.Component 컴포넌트는 웹 사이트를 조각 낸 것으로 그 조각 하나하나가 각자 기능을 한다. 유투브의 동영상 플레이어를 예로 든다면 전체를 감싸는 App, 동영상 플레이어 그리고 동영상을 재상하는 부분, 재생목록, 재생목록에서 보여주는 동영상과 그 동영상에 대한 설명이 모두 각각의 컴포넌트이다. 컴포넌트는 잘게 쪼갤수록 좋다. 잘게 쪼갤수록 재사용성이 높아지고 하나의 컴포넌트에서는 하나의 기능만을 함으로 에러를 잡기에도 좋다. // 함수 컴포넌트 function welcome(props) { return Hello, world!; } //ES6 class 사용 컴포넌트 정의 class Welcome extends React.Component { render() { return Hello, {thi..
2019.08.08 -
JSX
JSX란 const element = Hello, world!; JSX는 자바스크립트를 확장한 문법으로 자바스크립트의 모든 기능이 포함되어 있다. JSX는 함수 호출과 객체 생성을 위한 뭄법적 편의를 제공하고 특히 React.createElement() 호출을 반복해야 하는 불편을 해소한다. jsx특징 반드시 하나의 엘리먼트로 감싸야한다. 자바스크립트 코드를 적용할 땐 { } 안에 작성한다. JSX 내부에선 if문을 사용할 수 없다. IIFE or 삼항연산자 사용 엘리먼트의 클래스 이름을 적용할 때, className을 사용한다. JSX에 표현식 포함하기 const name = "josh Perez" const element = hello, {name}; ReactDOM.render( element, d..
2019.08.05