[React] Dependency 및 플러그인 설치 버전 확인하기

[React] Dependency 및 플러그인 설치 버전 확인을 해보자


1. 아톰 에디터가 설치가 안되었으면,
   아톰 에디터를 먼저 설치를 해준다.
 
    경로 : https://atom.io/


2. 아톰 에디터가 설치가 완료되었으면,
   에디터를 열고,
   File - Open folder - 생성한 프로젝트 폴더를 선택한다


3. 프로젝트가 아톰 에디터 좌측에 보인다.


4. package.json을 클릭하면 우측에 파일내용이 보인다.

{
  "name": "react-tutorial",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "react": "^15.6.1",
    "react-dom": "^15.6.1"
  },
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "webpack": "^3.5.5",
    "webpack-dev-server": "^2.7.1"
  }
}

댓글

댓글 쓰기

이 블로그의 인기 게시물

[c#] DataTable을 dataGridView에 바인딩

이미지
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 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 using   System ; using   System .Collections.Generic; using   System .ComponentModel; using   System .Data; using   System .Drawing; using   System .Linq; using   System .Text; using   System .Threading.Tasks; using   System .Windows.Forms;   namespace  WindowsFormsApplication7 {      public  partial  class  Form1 : Form     {          private  DataTable dt;       ...
자세한 내용 보기

[React] index.html 수정하기

 index.html 수정하기 1. div id = “app”  을 React 프로젝트의 root element 로 지정한다. 2. index.js  스크립트를 로드 한다.     index.js  파일은 webpack에서 bundle된 파일이다.     react 라이브러리 및 기타 자바스크립트 파일들이 하나로 합쳐진 파일이다. <!DOCTYPE html> < html > < head > < meta charset = "UTF-8" > < title > React App </ title > </ head > < body > < div id = "root" > </ div > < script src = "bundle.js" > </ script > </ body > </ html > 참조 : https://velopert.com/814
자세한 내용 보기

[React] 프로젝트 생성

이미지
React 프로젝트를 생성해 보자 1. 원하는 경로에 react-tutorial 이라는 루트 폴더를 생성한다.    1.1> 명령프롬프트를 연다    1.2> 미리만들어 놓은 project 폴더 밑에 react 폴더를 만들어둔다    1.3> react-tutorial 프로젝트 폴더를 생성한다 --> mkdir react-tutorial    1.4> 프로젝트 폴더에 들어간다  -- > cd react-tutorial 2. 생성된 프로젝트 폴더내에서 npm init  명령어를 사용하여 NodeJs 프로젝트를 생성한다     npm init 3. Dependency 및 플러그인을 설치한다     3.1>  –save  옵션을 통하여  package.json  에 의존 패키지들을 추가 할 수있습니다. npm install --save react react-dom          3.2> babel  에서 사용 될 플러그인을 설치해야합니다.            해당 모듈들은 개발환경에서만 사용되므로  –save-dev  옵션을 설정해주세요. npm install --save-dev babel-core babel-loader babel-preset-react babel-preset-es2015 webpack webpack-dev-server 참조 : https://velopert.com/814
자세한 내용 보기