728x90 반응형 SMALL react12 React - 리액트 클래스 (상태가 있는 컴포넌트) 이전글: 2019/02/23 - [IT/React] - React - 리액트 요소란? 실제로 동작하는 기능을 개발하려면 리액트 요소 이상의 것, 즉 컴포넌트가 필요하다. 리액트 컴포넌트는 요소를 그룹화하는 방법이다. 컴포넌트는 기능, 마크업, 스타일 그리고 기타 UI에 필요한 다른 요소들을 하나로 묶어 그룹화한다. 컴포넌트는 독립적이면서도 재사용이 가능하기 때문에 필요한 기능을 독자적으로 구성할 수 있다. 컴포넌트는 함수기반의 컴포넌트(상태가 없는)와 자바스크립트 클래스 기반의 컴포넌트로 나눌 수 있다. 클래스 기반의 컴포넌트에 대해서 알아보자. class MyReactClassComponent extend Component { render() {} } render 메서드 - 화면에 무언가를 출력하는 컴.. 2019. 2. 23. React - 리액트 요소란? 이전글: 2019/02/22 - [IT/React] - React - 컴포넌트란? 컴포넌트를 생성하고 관리하기 위해서는 리액트의 render 메서드를 호출해서 렌더링 해야 한다. ReactDom.render( ReactElement element, DOMElement container, [function callback] ) -> ReactComponent 위에서 보듯이 컴포넌트를 개발하기 위해서는 컴포넌트를 구성하는 기본 단위인 ReactElement에 대해서 먼저 알아봐야 한다. ReactElement (리액트 요소란?) - 리액트 요소는 리액트에서 컴포넌트를 구성하기 위한 기본 단위다. - 리액트 요소는 문자열을 이용해(div, a, p 등) DOM 요소를 생성한다. - props 객체를 이용해 리.. 2019. 2. 23. React - 컴포넌트란? 이전글: 2019/02/13 - [IT/React] - React란? React 소개 컴포넌트란? - 기능을 단위별로 캡슐화하는 리액트의 기본 단위다. - 사용자가 보는 뷰는 이 컴포넌트들을 조합하여 만든다. - 자바스크립트 함수 혹은 클래스이며 속성들을 이력받아들이며 내부적으로 각자의 상태를 관리한다. 리액트 라이브러리? - 리액트 코어 라이브러리는 react-dom과 react-natvie 의 지원을 받아 구동하게 된다. - react-dom: 브라우저나 서버 환경에서 렌더링을 수행 - react-native: iOS나 안드로이드용 애플리케이션 개발 시 바인딩 제공 컴포넌트 만들기 - 디자인을 살펴보고 어떻게 컴포넌트를 나눌것인지 기획한다. - API 가 애플리케이션에 어떤 데이터를 제공해 주는지 파.. 2019. 2. 22. React란? React 소개 React는 사용자 인터페이스를 개발하기 위해 페이스북이 개발하여 오픈 소스로 공개한 것으로, 간결함과 성능 그리고 컴포넌트 단위 개발을 염두에 두고 만들어진 자바스크립트 라이브러리다. 데이터가 변경되면 이 변경 사항을 반영하기 위해 UI를 갱신해야 한다. 이 과정을 효과적이면서도 쉽게 처리하기란 쉽지 않다. React는 바로 이 문제를 해결하는 데 주안점을 두고 있다. React의 내부 매커니즘은 컴포넌트의 상태변경과 이를 UI에 반영하는 작업 등에 필요한 복잡한 과정을 처리한다. 이 과정을 처리하는 주요 기법이 바로 가상DOM 기술이다. DOM은 XML문서의 계층 구조를 반영한 트리구조다. 이 트리구조는 node로 표현되는 자식 구조들로 구성되며 보통 이 구조는 웹페이지와 어플리케이션을 구성하는 di.. 2019. 2. 13. 이전 1 2 3 다음 728x90 반응형 LIST
