react 시작하기

React 시작하기

React Create App 설치하기

1
npm install -g create-react-app

React Create App 을 통해 프로젝트 생성하기

1
create-react-app react_boot_template --scripts-version=react-scripts-ts

개발 의존 모듈 설치하기

1
npm install --save-dev babel-core babel-loader babel-preset-es2015 babel-preset-react react-hot-loader webpack webpack-dev-server

글로벌 모듈 설치하기

1
sudo npm install -g babel-cli

필요 디렉토리 만들기

1
mkdir server server/routes && touch public/index.html server/main.js server/routes/posts.js src/App.js src/index.js webpack.dev.config.js

webpack 설정하기

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
module.exports = {
// 가장 처음 읽을 스크립트파일
// 여기서부터 import 되어있는 다른 스크립트를 불러온다.
entry: './src/index.js',

// 파일을 합치고 ./public/bundle.js 에 저장한다.
output: {
path: __dirname + '/public',
filename: 'bundle.js'
},

// ES6 문법과 JSX 문법을 사용한다
module: {
loaders: [
{
test: /\.js$/,
loader: 'babel',
exclude: /node_modules/,
query: {
cacheDirectory: true,
presets: ['es2015', 'react']
}
}
]
}
};
react의 기본 개념 javascript - Functional Programming with Javascript

Comments

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×