React 위주 & 디버깅 환경

컨디션

모티프

설치 프로그램의generator

# generatorをinstall(facebook製だよ)
npm install -g create-react-app

# installが終わったらreactアプリをgenerete. my-appという名前のアプリ
create-react-app my-app

my-app 디렉터리를 만들었기 때문에 이동 & 서버 시작

cd my-app

# server start
npm start

tips

{
  "name": "my-app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-scripts": "1.1.0"
  },
  "scripts": {
    "start": "react-scripts start", # ⇦これを呼び出している
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

Hello, world

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';

var element = React.createElement('h1', { className: 'greeting'}, 'Hello, world')
ReactDOM.render(element, document.getElementById('root'));
registerServiceWorker();

vs 코드 디버깅을 위한 설정 파일 만들기