[React 따라하기 #1] React 개발에 필요한 도구 설치

Windows 로 시작 합니다. 제가 윈도우 쓸거기 때문에. ㅎㅎ;

 

일단 npm, nodejs, yarn 은 아래 링크 참고하시어 설치합니다.

[React,Node,JQuery,js] - Node js, NPM 설치하기 (윈도우10)

[React,Node,JQuery,js] - yarn 이란? yarn 설치 방법 (Windows)

[React,Node,JQuery,js] - yarn 이란? yarn 설치 방법 (Mac)

그리고 프로젝트를 생성할 때 편리하게 해주는 create-react-app 를 설치합니다.

cmd 를 실행하고 아래 명령어를 입력합니다.

npm install -g create-react-app

yarn 을 이용한 설치 방법은 yarn global add create-react-app

 

요건 설치가 곰방 됩니다.

설치가 되면 첫 react 프로젝트를 설치해 봅시다.

일단 폴더를 하나 생성합니다. 그리고 cmd 창에서 해당 폴더로 이동한 후에

아래 명령어로 프로젝트를 생성합니다. 이 작업은 5분내로 완료될겁니다. 처음이라면,

create-react-app hello-world

현재 디렉토리 아래에 hello-world 폴더가 생기고 필요한 라이브러리들리 준비됩니다.

해당 폴더로 이동 후 실행해봅니다.

cd hello-world
yarn start

이렇게 뜨고 기본웹브라우저에 웹페이지 하나가 뜹니다.

src 폴더 아래 App.js 파일을 수정하라고 나옵니다.

이제 react 걸음마를 시작해 보겠습니다. 

 

[React 따라하기 #2] React 시작하기 hello world!

React 따라하기 #3] Codepen에서 실행해보기

[React 따라하기 #4] ES6, js Class 에 대한 간단한 설명

[React 따라하기 #5] React JSX

[React 따라하기 #6] React Components(컴포넌트)

[React 따라하기 #7] React Components(컴포넌트) 참조하기

[React 따라하기 #8] React Props

[React 따라하기 #9] React State

[React 따라하기 #10] React 기본 함수 (life cycle)

[React 따라하기 #11] React Event 리액트 이벤트