react 시작하기 + webpack + babel + sass 설정 리액트를 정리하기 위한 블로그입니다. 잘못된 개념의 경우는 피드백 주시면 감사하겠습니다. 리액트 왜 쓸까요? 사용자 인터페이스를 만들기 위한 Javascript 라이브러리 프레임워크라고 생각하고 있습니다. 사용자 인터페이스가 영어로 줄이면 UI죠. 버튼, 메뉴, 링크 이런걸 ...
프론트에서 js모듈화를 진행하기 위해 babel과 webpack을 적용하였다. ES6 최신문법을 브라우저에서도 사용하기 위해서 babel을 적용하고, 그걸 하나로 뭉쳐주기 위해(?) webpack을 적용하였다. 그렇게 한 결과 html 뷰에서 webpack으로 뭉친 bundle.js하나만 로드해주면 모든 것이 한방에 해결되는 신세계와 편리함을 맛볼...
webpack.config.js 파일을 생성하여 config 객체를 이용해서 module.exports를 통해 외부로 노출시킬 수 있다. config 파일은 mode, entry, output, module, plugins를 제공한다. 모드 (mode) devoplement면 개발용, production이면 배포용이다. webpack.config...
webpack은 여러 개의 assets (js, css, png, jpg)을 웹 브라우저가 이해할 수 있는 번들로 묶고 패킹할 수 있는 자바스크립트 모듈 번들러이다. Node.js 환경에서 실행되며, npm으로 설치할 수 있다. 웹팩을 사용하는 이유 각기 다른 자바스크립트를 로딩할 때, 스크립트 로딩 순서와 해당 HTML에서 필요하지 않은 js 파일...
