Frontend/React (34) 썸네일형 리스트형 [React] props와 state(+css 적용) 리액트에서 props와 state를 활용해 숫자 10을 화면에 나타내보자. 리액트 props는 '소품'이라는 뜻으로 자바스크립트 객체. 함수의 매개변수처럼 컴포넌트에 전달된다. 예를들어 '사람'이라고해도 이름과 나이 성별등등이 모두다른데 이때 props를 사용. import React from 'react' class App extends React.Component { render() { return ( ); } } const Display = (props) => ( {props.value} ) export default App; state역시 자바스크립트 객체로 함수내 선언된 변수처럼 컴포넌트 안에서 관리되고 class내에서만 이용가능함. props는 아래처럼 생략가능 import React from.. 리액트? 리액트 프로젝트 만들기 리액트? 컴포넌트? 문서(HTML), 스타일(css) 동작(js)를 합쳐 내가만든 일종의 태그 component based development 리액트 특징 -DOM을 직접 제어하지않고 Virtual DOM(가상의 톰트리)를 사용해 이전상태와 이후상태를 비교해 바뀐 부분을 찾아내어 자동으로 변경 CSR vs SSR 리액트의 CSR(client side rendering) JS가 전부 다운로드되어 리액트가 정상 실행되기 전까지는 화면이 보이지않음 리액트의 SSR(server side rendering) JS가 전부 다운로드 되지않아도 일부 화면 보이지만 유저가 사용할 수 없음 리액트의 핵심 모듈 ReactDOM => HTMLElement 연결 React => 리액트 컴포넌트 만들기 import "React.. 이전 1 2 3 4 5 다음
