minguri brain is busy

웹팩을 설정해서 프로젝트를 다루고 있지만 빌드할 때 새로운 문제에 직면하면 원인을 예측하기 어려워 해결하는 데에 시간이 많이 들곤 했다. 프론트엔드 빌드 시스템에 대해 처음부터 정리하고 싶어서 김정한님의 '프론트엔드 개발환경의 이해와 실습' 강의를 들으며 주요 개념을 익혀보기로 했다. 시리즈 이전글 더보기 1. 2022.07.31 - [FE/개발환경] - 프론트엔드 개발환경의 이해: NPM 프론트엔드 개발환경의 이해: NPM 웹팩을 설정해서 프로젝트를 다루고 있지만 빌드할 때 새로운 문제에 직면하면 원인을 예측하기 어려워 해결하는데에 시간이 많이 들곤했다. 프론트엔드 빌드 시스템에 대해 처음부터 정리하 minguri.tistory.com 배경 src/math.js: function sum(a, b) { ..

웹팩을 설정해서 프로젝트를 다루고 있지만 빌드할 때 새로운 문제에 직면하면 원인을 예측하기 어려워 해결하는 데에 시간이 많이 들곤 했다. 프론트엔드 빌드 시스템에 대해 처음부터 정리하고 싶어서 김정한님의 '프론트엔드 개발환경의 이해와 실습' 강의를 들으며 주요 개념을 익혀보기로 했다. Node가 필요한 이유 - 최신 스펙 사용: 자바스크립트 스펙에 비해 브라우져 지원 속도는 뒤쳐지므로 바벨 웹팩 등의 도구가 필요하다. 이것들은 Node환경에서 돌아가는 도구들이다. - 빌드 자동화: 최근엔 코딩한 것을 그대로 브라우져에 올리기보다는 파일 압축, 코드 난독화, 폴리필 추가 등 개발 이외의 작업을 거친 후 배포한다. Node는 이 빌드 과정을 이해하는 데에 도움이 된다. - 개발환경 커스터 마이징: 자동화된 ..