Front-End(2.React)

[1] React 개요 (1) Framework 완벽한 개발환경이 구축된 모형(MVC이 완벽) > 초보자에게 유리합니다. > 장점) > 이미 구축되어 있는 상태기 때문에, 내용을 넣어주기만하면 되기 때문에 개발이 편리합니다. > 단점) > 내 마음대로 고쳐쓰기가 쉽지

프로젝트를 시작할 폴더로 이동한 뒤,create-react-app myapp 명령어로 react 프로젝트를 만듭니다. (myapp이 프로젝트명입니다.)myapp 이란 폴더가 생성되며, 내부에 node-modules 안에 필요한 패키지들이 설치됩니다. 그리고 yarn 명

React를 사용하려면, 그 구조를 먼저 알야아합니다. 이걸 모르면 사실 진짜 사용을 못합니다. ex)myapp \- node_modules : 프로젝트와 관련된 라이브러리 다 설치되는 폴더 \- public : index.html이 존재하는 폴더

react 를 사용하기 전에 미리 알아둘 문법이 있습니다.자바스크립트에 적용되는 문법입니다.형식) 변수선언 : let 변수명 = 값 출력 : {{변수명}}형식) {this.호출할함수명()}3-1) 함수호출 시 () 를 붙이지 않는다.: 이벤트를 발생시키지 않았는

Eclipse 에서도 리액트 어플리케이션을 만들 수 있습니다.

(9) props를 알아봅시다 - 1 다시 VScode로 돌아와서 콘솔에 create-react-app myapp2 로 리액트 어플리케이션을 만들어 줍니다. > create-react-app myapp2 1) App2.js : render()해서 내보낼 클래스를 만

1) 컴포넌트에서 유동적인 데이터를 다룰 때, state 를 사용합니다.: React 어플리케이션을 만들 땐, state를 사용하는 컴포넌트의 갯수를 최소화하도록 해야합니다. 예를들어, 10 개의 컴포넌트에서 유동적인 데이터를 사용하게 될 땐, 각 데이터에 state를

내부적으로 데이터를 저장할 목적으로 사용되는 속성입니다. 변경이 가능한 데이터가 저장됩니다.constructor()를 사용해서 초기화 설정이 가능합니다.이를 위해 클래스를 사용합니다.컴포넌트에서 사용 할 데이터 중 변동되지 않는 데이터를 다룰 때 사용됩니다. paren

(1) componentWillMount() : DOM에 컴포넌트가 링크 되기 전에 실행(2) componentDidMount() : DOM에 컴포넌트가 링크 된 후에 실행\-------------------------------render()--------------

스프링에서의 controller 역할을 하신다고 보면 됩니다. 기존 리액트 어플리케이션에서는 react 와 react-dom 만을 사용했는데, 여기에 rounting과 관련된 모듈을 설치할겁니다.react-router-dom 설치 : 브라우저에서 사용되는 리액트라우터입