웹팩과 모듈 소개

1. 웹팩이란?

   웹팩이란 최신 프론트앤드 프레임워크에서 가장 많이 사용되는 모듈 번들러(Module Bundler)이다.
   모듈 번들러란 웹 애플리케이션을 구성하는 자원(html, css, javascript, images 등등)을 모두 각각의 모듈로 보고 이를 조합해서 병합된 하나의 결과물을 만드는 도구를 의미한다.
   단순하게 여러개를 하나로 합친다라고 생각하면 된다.
   의도에 따라서 나중에 배우게될, 레이지로딩, 코드 스플릿을 하면 결과물을 찢을 수도 있다.

2. 모듈이란?

   모듈이란 프로그래밍 관점에서 특정 기능을 갖는 작은 코드 단위를 의미한다.
   자바스크립트로 치면 아래와 같은 코드가 모듈이다.

   // math.js
   function sum (a, b) {
       return a + b;
   }
      
   function substract (a, b) {
       return a - b;
   }
      
   const pi = 3.14;
      
   export { sum, substract, pi }
   

3. 웹팩에서의 모듈

   웹팩에서 지칭하는 모듈이란 개념은 위와 같이 자바스크립트 모듈에만 국한되지 않고 웹 애플리케이션을 구성하는 모든 자원을 의미한다.
   웹 애플리케이션을 제작하려면 HTML, CSS, JavaScript, Images, Font 등 많은 파일들이 필요하다.
   이런 파일들 하나하나가 모두 모듈이다.