프론트엔드 개발환경의 이해와 실습

프론트엔드 개발 환경을 구성하면서 알아야 할 것들

• npm with node js
• webpack 핵심 개념 (loader, plugin 만들기)
• babel 핵심 개념, 웹팩과 통합하는 방법
• eslint with prettier
• webpack 심화 (api server 연결, 번들 최적화)

node.js의 필요성

• 패키지들을 최신 스펙으로 개발 (버전을 개발자가 일일이 업데이트 해주지 않아도 알아서 관리)
• 빌드 자동화
• 개발 환경 커스터마이징

외부 패키지를 관리하는 방법

외부 패키지들의 버전을 어떻게 관리해야하는가?

• 엄격하게 vs 느슨하게 => 통일된 버전 관리 체계 필요성
• 유의적 버전 (npm에서 사용하는 체계)

[major.minor.patch] // 버전 표기 방법

• major : 기존 버전과 충돌하는 새 기능 업데이트
• minor : 기존 버전과 호환되는 새 기능 업데이트
• patch : 기존 버전과 호환되는 버그 픽스
• 틸드와 캐럿
  - 틸드(~) : 마이너 버전이 명시되어 있으면 패치 버전을 변경. ~1.2.3 => 1.2.3 이상 1.3.0 미만
  - 캐럿(^) : 정식버전에서 마이너와 패치 버전을 변경. ^1.2.3 => 1.2.3 이상 2.0.0 미만
  => 캐럿으로 표기하면 하위 호환성을 유지할 수 있음 npm view react versions // react의 모든 버전 출력