리액트
React State and Life Cycle (리액트 state와 생명주기)
1. State 리액트는 뷰의 단위가 컴포넌트로 구성되고, 이 컴포넌트를 통해 UI 를 재사용이 가능한 여러 조각으로 나눈다. 리액트로 프로젝트를 만들 때 우리가 주목해야 하는 부분은 props와 state다. 각 컴포넌트는 상위에서 하위 컴포넌트로 값을 전달하여 사용할 수 있는데, 이 때 이 전달되는 값을 props라고 한다. state는 각 컴포넌트가 가지고 있는 개별적인 상태값이다. props와 state는 일반 JS객체로, 두객체 모두 랜더링 결과물에 영향을 주는 정보를 갖고 있다. 그러나 한가지 중요한 방식에서 차이가 있는데, 변경 가능한 점에 대한 부분이다. props는 부모 구성요소에서 설정한 정보를 포함하며 변경할 수 없는 불변성의 특징이 있다. state는 구성요소가 자체적으로 초기화, ..
React Component
1. 리액트가 하는 일 리액트는 핵심 모듈 2개로 일을 한다. 1. 리액트 컴포넌트 => HTMLElement 연결하기 (페이지 전체라고 볼수 있다. ) 2. 리액트 컴포넌트 만들기 1. import ReactDOM from 'react-dom'; 2. import React from 'react'; 사용예시 ReactDOM.render ( , document.getElementById('hello-example') ); // React 컴포넌트 class HelloMessage extends React.Component { render() { return ( Hello {this.props.name} ); } } // HTMLElement ReactDOM.render ( , document.getEle..
React 입문_2
1. Angular vs React vs Vue 비교 npm trend를 보면 가장 사용이 많이 되는 모던 라이브러리는 React다. 1.1 Angular Angular는 React 전에 있던 프레임 워크로, 하나의 프레임워크로 프로젝트를 진행할 수 있게 한다는것을 추구한다. 이미 프레임이 정해져 있기 때문에 자유도가 거의 없다. Angular는 버전 1에서 버전 2로 되면서 완전히 다른 것으로 바뀌었다. 버전 2에서 typescript로 바뀌면서 기존 버전에서 완전히 단절되면서 Angular의 사용자가 많이 유출되었다. 1.2 React React는 라이브러리로, 유저 인터페이스(view)를 다루고 관리하기 위해서 만들어진 라이브러리다. 오직 Rendering과 Update에 중점을 둔 tool로써, ..