본문 바로가기
Programming/React

[React] Webpack, Babel이란?

by mingule 2020. 7. 6.

 Webpack 

코드들을 의존하는 순서대로 잘 합쳐서 하나 또는 여러 개의 파일로 결과물을 만들어냄

파일을 하나 하나 만든 것들을 HTML에서 매번 불러오는게 아니라, js에서 import한 것들을 bundling작업을 하게될 때 특정 확장자마다 어떠한 처리 작업을 하도록 준비를 해줌.

이미지들을 압축하고, 그 결과물로는 특정 경로에 특정 이름으로 저장하게끔 만들 수 있음.

js파일을 여러 개 만들었을 때, 나중에 합쳐서 하나의 파일로 만들어줌. (나중에 원하면 규칙에 따라 분리시켜줄 수도 있음)

 

추가 : 우리가 나중에 ES6를 사용할건데, 구형 브라우저에서 지원이 안되는 경우가 있음. 그래서 새로운 문법을 사용할 수 있게끔 나중에 Babel을 사용함. js파일이 여러 종류의 브라우저에서 사용될 수 있게!

요 중간에서 도와주는게 Webpack

결론 : 웹팩은 웹 프로젝트를 만들 때, 파일들을 관리해주는 도구라고 알면 됨

 Babel 

자바스크립트 변환 도구

js는 점점 발전하고 있기 때문에 문법을 만들면 이전 js로 변환하는 플러그인을 작성하는 것. . . 

직접 홈페이지 가서 확인해봐도 좋음!

https://babeljs.io/

 

Babel · The compiler for next generation JavaScript

The compiler for next generation JavaScript

babeljs.io

 

직접 건드릴 일은 없고, 지금 단계에서는 이런 도구가 사용되고 있다~ 정도만 알면 됩니당!

아직 잘은 모르겠지만 하다 보면 익숙해지겠찌. . . 

'Programming > React' 카테고리의 다른 글

[2] JSX 기본 문법  (0) 2020.07.06
[1] JSX 기본 문법  (0) 2020.07.06
리액트 기초  (0) 2018.06.16
로컬에서 리액트 개발환경 세팅하기  (0) 2018.06.16
react 시작하기  (0) 2018.06.16

댓글