1. SCSS Loader - 이전글(webpack)에서는 예쁜 코드를 짜고 그걸 구린 코드로 변환해봤음 - 그 구린 코드는 브라우저에서 잘 작동할 거임 - 이 상태로 webpack을 실행시키면 에러가 발생   - 이 파일로 뭘할지 모르겠다는 뜻 - 당연하게도 scss를 위한 rules를 만들어야 함 - loader는 객체를 사용할 수도 있지만, 여러 loader들을 가져와서 한가지의 변형으로 만들 수도 있음   - 첫번째로는 이상하게 생긴 scss를 가져다가 일반적인 css로 바꾸는 것(sass-loader)   - 두번째로는 폰트같은걸 불러올 때 css에 유용한 것(css-loader)   - 세번째로는 바뀐 css를 우리 웹사이트로 불러오는 것(style-loader) - 이제 API 링크는 걸지 ..

1. Webpack - 우리는 babeljs를 사용하여 백엔드에서 자바스크립트를 최신 코드로 사용하고 있고 최신 코드를 컴파일하고 있음 - 나중에 Sassy CSS도 사용할 건데 이 파일 또한 그대로 둔다면 브라우저는 이해하지 못함   - .scss를 .css로 바꿔줄 필요가 있다는 것 - 프론트엔드에서 자바스크립트 코드를 작성하면 모든 브라우저에서 인식 가능한 자바스크립트로 바꿔주는 무언가가 필요함 - https://webpack.kr/ webpack웹팩은 모듈 번들러입니다. 주요 목적은 브라우저에서 사용할 수 있도록 JavaScript 파일을 번들로 묶는 것이지만, 리소스나 애셋을 변환하고 번들링 또는 패키징할 수도 있습니다.webpack.kr npm i webpack webpack-cli -D - ..

1. BabelNode.js는 우리가 작성한 코드를 대체로 이해하지만, 이해하지 못하는 최신 코드가 생기기도 한다.해결방법은 Node.js가 이해하는 JS만 사용하거나, Babel을 사용해야 한다.Babel은 개발자가 작성한 최신 JS를 컴파일한다.즉 개발자는 현재의 Node.js 버전이 JS를 인식하지 못하는지 걱정할 필요 없이 최신 JS를 작성할 수 있다. 2. 설치방법https://babeljs.io/ Babel · BabelThe compiler for next generation JavaScriptbabeljs.ionpm install --save-dev @babel/core - dependencies는 프로젝트를 실행하기 위한 것임 - 예로 자동차는 움직일 때 가솔린이나 전기가 필요한 것 - ..