웹페이지를 만들다 보면 여러 JavaScript, css, 이미지 등 수많은 파일들이 생긴다.웹사이트를 실행하면 그 수많은 파일들이 다운로드 된다.서버와의 접속이 많을수록 애플리케이션은 느리게 로딩 된다.또, 많은 JS 패키지들을 사용하다보면 각각의 서로 다른 패키지들
https://youtu.be/1V6XiP16D28예를 들어 변수명 등이 중복되면 충돌로 인해 제대로 동작 되지 않는다. 웹은 이런 심각한 충돌이 굉장히 많이 일어났고 이를 해결하기 위해 나온 개념이 모듈이다. 이 모듈 기능은 최신 웹 브라우저들에 탑재 되어
https://youtu.be/t1efxfi_nu8 웹팩을 도입함으로써 얻을 수 있는 것은 리팩토링이다. 웹팩을 설치하기 위해서는 흩어진 파일들을 node.js의 패키지 파일로 만들어줄 필요가 있다. Node.js는 Node.js 홈페이지에서 설치 가능하고 설치하
https://youtu.be/gj9RKSXW_vc코딩으로 만들어지는 js 부터 sass, png 등 수많은 다양한 파일(자원)들을 웹팩으로 처리하면 단순한 형태의 몇몇 파일로 만들어진다.다양한 형태의 자원들을 어떻게 웹팩한테 보낼 것인가?그 자원들을 어떤 방
https://youtu.be/yO_nc7A2qpo웹팩을 실행하면 WARNING in configration~ 경고문구가 터미널에 출력된다.웹팩은 굉장히 많은 설정을 갖고 있고 다 기억하기 쉽지 않기 때문에 기본 설정값을 갖고 있다.기본 설정값에는 개발자 모드
https://youtu.be/5ym8ozubCTA 로더는 웹팩의 핵심이라고 할 수 있는 중요한 개념이다. index.html에 css파일을 추가하고 싶으면 번들링 파일이 저장 되는 최종 위치(현재 연습 프로젝트에서는 public 폴더)에 css파일을 만들어준다.