TIL no.23 - React - CRA 기본 세팅

codeamor·2020년 8월 4일
0

React

목록 보기
3/5

✔ node.modules, package.json, .gitignore

package.json

  • 라이브러리/패키지 세팅 리스트 정보(종류, 버전)가 들어있습니다.
  • 모든 프로젝트마다 pakage.json 이 있습니다.

dependencies

  • 리액트를 사용하기 위한 모든 패키지 리스트이며 버전 확인이 가능합니다.
  • 실제 코드는 node.modules 폴더에 존재합니다.

.gitignore

  • github에 올리고 싶지 않는 정보를 관리합니다.

위 세 가지는 왜 짝지어 지는 걸까요?

  • 실제 내가 작성한 코드 및 설치한 패키지는 내 로컬에만 존재합니다.
  • 이것을 깃허브에 공유할 때는 코드 + pakage.json를 넘기게 됩니다.
  • 다른 사람이 그것을 받아서 npm install만 입력하면 package.json에 정보가 있는 모듈을 전부 다운받게 됩니다.
  • 따라서 .gitignore 파일에 올리고 싶지 않은 것들을 써야 합니다.
  • 라이브러리 새로 설치 시 node.modules 에 자동으로 설치되지만 dependencies에 자동으로 추가되는 것은 아닙니다.
    • npm install slider --save 를 입력해야 dependencies에 추가됩니다.

✔ index.html - index.js - App.js

public - index.html

  • <div id="root"></div>

src - index.js

  • React의 시작 (Entry Point)
  • React, ReactDOM
  • 이름을 함부로 수정하면 안됩니다.

src - App.js

위 세 가지는 왜 짝지어 지는 걸까요?

  • App.js(컴포넌트 파일)의 App 컴포넌트를 index.js에서 App이라는 컴포넌트 이름과 위치를 인자로 받아tj index.html을 구축해나가게 됩니다.

0개의 댓글