초간단 react.js 시작하기

1. 시작하기 전에

npm이 설치되어 있어야 한다... npm은 node.js를 설치하면 같이 설치된다...

2. 따라하기

본인은 d:\dev\react 란 곳에서 작업했다.

D:\dev\react>npm install -g create-react-app
C:\Users\rmrf\AppData\Roaming\npm\create-react-app -> C:\Users\rmrf\AppData\Roaming\npm\node_modules\create-react-app\
index.js
+ create-react-app@3.0.1
added 91 packages from 45 contributors in 6.228s

D:\dev\react>create-react-app hello-world

Creating a new React app in D:\dev\react\hello-world.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...


> core-js@2.6.6 postinstall D:\dev\react\hello-world\node_modules\babel-runtime\node_modules\core-js
> node scripts/postinstall


> core-js-pure@3.1.0 postinstall D:\dev\react\hello-world\node_modules\core-js-pure
> node scripts/postinstall

+ react@16.8.6
+ react-dom@16.8.6
+ react-scripts@3.0.1
added 1404 packages from 727 contributors and audited 888971 packages in 52.228s
found 0 vulnerabilities


Initialized a git repository.

Success! Created hello-world at D:\dev\react\hello-world
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd hello-world
  npm start

Happy hacking!

D:\dev\react>cd hello-world

D:\dev\react\hello-world>npm start

> hello-world@0.1.0 start D:\dev\react\hello-world
> react-scripts start

3. 접속

http://localhost:3000

4. 기본 페이지 변경

src/App.js를 수정한다.

import React, { Component } from 'react';

class App extends Component {
  render() {
    return (
      <div>
        App
      </div>
    );
  }
}

export default App;