React 33

[React] React Component, Atomic Design

React Component Component 속성(Props)을 받고 상태(state)/메소드를 가진다. 반복되는 UI 단위 가능한 순수함수로 실행되도록 작성하고 데이터 영역과 UI를 분리 MyComponent.defaultProps = {…} Class Component extends React.Component 또는 createClass constuctor, this.state, render(), … LifeCycle 관리가 쉽다 Functional Component react 16.8부터 사용, 직관적이고 가볍다. render 필요 없고 JSX return; React Component Props Props props, children (React.Node) 속성(변수, 함수 등) 전달 MyCom..

Front-end/React 2024.02.18

[React] React 시작하기

React Concept virtual-dom from Fibers Tree & Scheduler Alogirithm renderer 랜더링 담당 reconciler DOM의 변경 관리 (비동기) ReactDOM render the REactElements createElement(tag, attr, …children); render(reactElement, reactRoot); React.Component render / ReactDOM / life-cycle 컴포넌트 생성 const Sample = React.createClass({…}); class Sample extends React.Component {…} const Sample = props ⇒ (…); React Concept HTMLEle..

Front-end/React 2024.02.18

[Hanaro] 23일차 / React 시작하기

React 시작하기 React Concept virtual-dom from Fibers Tree & Scheduler Alogirithm renderer 랜더링 담당 reconciler DOM의 변경 관리 (비동기) ReactDOM render the REactElements createElement(tag, attr, …children); render(reactElement, reactRoot); React.Component render / ReactDOM / life-cycle 컴포넌트 생성 const Sample = React.createClass({…}); class Sample extends React.Component {…} const Sample = props ⇒ (…); React Conc..

728x90