차근차근 개발중

[React] CRA란? 본문

개발/REACT

[React] CRA란?

zaenny 2024. 4. 9. 13:05

📍. CRA란?

  • Create React App(CRA)는 리액트 애플리케이션 개발 도구입니다. CAR를 사용하면 webpack이나 babel과 같은 도구를 설치하거나 구성할 필요 없이 간편하게 리액트 애플리케이션을 시작할 수 있습니다. 

 

📍. CRA를 사용하는 이유

  • 간편한 설정
    • React 앱을 만들때, Babel이나 webpack같은 build 도구를 사용한다. 이런 다양한 라이브러리를 일일이 다운받아야하지만 CRA을 통해  복잡한 설정 없이 간단히 리액트 애플리케이션을 시작 할 수있다.
    • 프로덕션을 배포할 준비가 되었을 때, npm run build 를 실행하면 build 폴더 안에 제작한 앱의 최적화된 Build를 생성합니다.
  • 성능 최적화
    • 코드 번들링, 코드 분할, 자원 압축 등의 작업을 자동으로 수행하여 애플리케이션의 성능을 최적화하기 위한 여러 가지 도구와 기능을 제공한다.
    • 개발 서버를 포함하여 실시간 리로드를 제공하여 신속하게 코드를 테스트하고 수정할 수 있다. 
    • Hot Module Replacement(HMR)을 통해 변경 사항이 발생할 때 새로 고치지 않고도 모듈을 교체할 수 있다.
  • 커뮤니티 지원
    • CRA는 리액트 팀에 의해 유지보수되어 안정적이고 업데이트된 도구 및 기능을 지속적으로 사용할 수 있다.
  • 표준화된 프로젝 구조
    • 프로젝트의 폴더 구조와 파일 구성을 표준화하여 개발자들이 일관된 방식을 작업할 수 있도록 도와준다. 유지보수가 용이하다

 

📍. CRA를 사용하는 방법

 

1. 사용하고있는 IDE의 terminal창 my-app이란 폴더안에 CRA 설치된다.

npx create-react-app my-app

 

 

2. cd my-app 명령어를 이용해 CRA가 설치된 파일로 진입한다.

cd my-app

 

 

3. npm start 시작하면된다  

npm start

  

 

'개발 > REACT' 카테고리의 다른 글

[React] 리액트 생명주기(Life Cycle)  (0) 2024.05.04
Comments