[React.js] 강좌 6-1편 컴포넌트 Iteration (반복) – Map

이 튜토리얼은 2018년에 새로운 강의로 재작성되었습니다 [새 튜토리얼 보기] 이번 강좌에서는 다른 데이터를 지니고있는 같은 종류의 여러 컴포넌트를 효율적으로 렌더링 하는 방법에 대하여 알아보겠습니다. 1. JavaScript – Array.prototype.map 우선, JavaScript 의 Array 객체 내장함수인 map 함수에 대하여 알아볼까요? 정의 map() …

[React.JS] 강좌 5편 컴포넌트의 State 와 Props 사용하기

이 튜토리얼은 2018년에 새로운 강의로 재작성되었습니다 [새 튜토리얼 보기] 이번 강좌에서는 Component 에서 사용 할 데이터를 다루는 State 와 Props 에 대하여 알아보겠습니다. 1. 시작하기 강좌 4편 – Component 생성 및 모듈화 에서 사용하던 프로젝트를 계속해서 사용하겠습니다. index.html <!DOCTYPE html>…

[React.JS] 강좌 4편 Component 생성 및 모듈화

이 튜토리얼은 2018년에 새로운 강의로 재작성되었습니다 [새 튜토리얼 보기] 이번 강좌에서는 React.js 에서 사용되는 Component 를 생성하고, 이를 모듈화 하는 방법을 알아보도록 하겠습니다. 이 강좌는 이전에 설정한 React.js 작업환경에서부터 진행됩니다. Component 생성 및 모듈화 다음 index.js 파일은, 이전 강좌에서 만들었지요?…

[React.JS] 강좌 3편 JSX

이 튜토리얼은 2018년에 새로운 강의로 재작성되었습니다 [새 튜토리얼 보기] 이번 강좌에서는 React.js 에서 사용되는 JSX 문법에 대하여 알아보겠습니다. React.js 는 일반 JavaScript 문법이 아닌 JSX 문법을 사용하여 UI를 템플릿화 합니다. JSX를 사용하는것이 필수는 아니지만 이를 사용하면 다음과 같은 장점이 있습니다.…

[React.JS] 강좌 2편 작업환경 설정하기

이 튜토리얼은 2018년에 새로운 강의로 재작성되었습니다 [새 튜토리얼 보기]   이번 강좌에서는 React 작업환경을 설정해보도록 하겠습니다. 저희는 NodeJS 환경에서 React를 사용 할 것이므로 NodeJS 및 npm이 설치되있어야 합니다. NodeJS 환경에서 React를 사용하는 방법은  대표적으로 webpack을 이용하는 방법이 있고, browserify를 이용하는…

[React.JS] 강좌 1편 소개 및 맛보기

이 튜토리얼은 2018년에 새로운 강의로 재작성되었습니다 [새 튜토리얼 보기] React 강좌 01: 소개 및 맛보기 이 강좌에서는 React에 대한 간략한 정보와 특징에 대하여 알아보고, 간단한 예제를 통해 React를 사용해보도록 하겠습니다. 본 강좌는 ReactJS를 처음 배우는 JavaScript 개발자들을 대상으로 작성됐으며 앞으로…