모르는 용어 정리하기
1. 빌드 (Build)
- 개발자가 작성한 소스 코드(JSX 등)를 브라우저가 실행할 수 있는 정적 파일(HTML, CSS등)로 변환하고 최적화하는 과정
2. 번들러 (Bundler)
- 자바스크립트 파일, 스타일시트, 이미지 등을 묶어주는 도구
=> 브라우저가 수백 개의 파일을 일일히 서버에 요청하면 속도가 느려지므로, 네트워크 요청 횟수를 줄이기 위해 사용
3. 프레임워크 (Framework)
- 개발자가 어플을 만들 때 따라야 하는 규칙, 폴더 구조, 기본 기능들을 미리 갖춰놓은 "전체 뼈대"
라이브러리와의 차이점 : 라이브러리는 필요할 때 가져다 쓰지만, 프레임워크는 프레임워크가 정한 규칙 안에서 개발자가 코드를 채워 넣어야 함
4. HMR (Hot Module Replacement)
- 개발 중 코드를 수정하고 저장했을 때, 브라우저 전체를 새로고침하지 않고 수정된 모듈만 실시간으로 교체해 반영하는 기술
=> 전체 새로고침이 일어나지 않아 현재 입력 중이던 화면의 상태값을 유지한 채 UI 변경 사항만 즉시 확인 가능
5. Rollup
- 자바스크립드 모듈 시스템(import/export) 기반의 번들러 도구 중 하나
쓰지 않는 코드를 솎아내는 성능이 뛰어남
6. Webpack
- 현재 가장 널리 쓰이고 있는 표준급 모듈 번들러
=> JS뿐 아니라 CSS, HTML 등 모든 웹 자원을 모듈로 취급하며, 대규모 웹 프로젝트 설정에 강함
