[JavaScript] React - CRA

손종일·2020년 9월 4일
0

React

목록 보기
6/22
post-thumbnail

React

React 선택 이유?

프로젝트를 진행하면서 JS에서 직접 DOM으로만 개발했을때 너무 복잡했었지만, 특정 부분을 컴포넌트로 만들어 사용할 수 있다는 점과 오로지 view를 위한 라이브러리로서 많은 매력을 느끼게 되어 리엑트를 선택했다.

React란?

사용자 인터페이스(UI)를 만들기 위한 JavaScript 라이브러리 입니다.

  • 리엑트와 같은 프론트엔드 라이브러리 혹은 프레임워크를 사용하는 이유 중 하나는 UI를 자동으로 업데이트합니다. --> (CRA를 사용하여 프로젝트를 생성하면 master branch인것을 확인할 수 있는데 자동으로 UI를 관리해준다고 생각하면 됩니다.)
  • 가상돔을 사용하여 UI를 쉽게 업데이트
  • 가상돔은 이전 UI 상태를 메모리에 유지해서, 변경될 UI의 최소 집합을 말한다.
    (U 업데이트는 최소화되고 성능은 좋아진다.)

CRA

CRA 란 create-react-app node module 의 약자로 리액트 프로젝트를 쉽게 만들 수 있게 필요한 모듈 혹은 설정 할 수 있도록 도와주는 도구이다.

1 . node.modules

  • CRA를 구성하는 모든 패키지 소스 코드가 존재하는 폴더
  1. package.json
  • CRA 기본 패키지 외 추가로 설치된 라이브러리/패키지 정보(추가 패키지, 버전)이 기록되는 파일
  1. gitignore
  • github에 올리고 싶지 않은 폴더와 파일을 생성한다.

협업을 하게되면 개발자 전부가 프로젝트를 생성하지 않습니다.
예를 들어, 개발자A, 개발자B, 개발자C가 있다고 하면 모두 프로젝트를 생성하는게 아닙니다.
1. 개발자A가 프로젝트를 생성하고 초기세팅을 합니다. (node.modules, package.json 등)
2.초기세팅을 한 후 개발자A는 github에 올리게 되는데 이 때, gitignore에 있는 파일을 제외하고 올라가게 됩니다. (gitignore 파일에 node.modules이 기본적으로 있습니다.)
3. 나머지 개발자 B, C는 해당 프로젝트를 clone합니다. (node.modules 포함되지 않음)
4. 개발자B, C는 clone 후 npm intall을 하게되면 package.json에 있는 버전과 동일한 파일을 다운받게 됩니다.

profile
Allday

0개의 댓글