5. 모듈과 패키지 관리
모듈이란 무엇인가?
모듈은 코드의 재사용성과 유지보수성을 높이기 위해 코드를 독립적인 단위로 분리한 것입니다. 모듈 시스템을 사용하면 코드의 복잡성을 줄이고, 각 모듈을 개별적으로 개발하고 테스트할 수 있습니다.
ES6 모듈
ES6에서는 자바스크립트에서 모듈을 표준화하기 위해 import
와 export
키워드를 도입했습니다.
1. 모듈 생성
모듈 파일 math.js
를 생성합니다.
// math.js
export function add(a, b) {
return a + b;
}
export function subtract(a, b) {
return a - b;
}
2. 모듈 가져오기
다른 파일에서 math.js
모듈을 가져와 사용합니다.
// main.js
import { add, subtract } from './math.js';
console.log(add(2, 3)); // 출력: 5
console.log(subtract(5, 3)); // 출력: 2
3. 기본 내보내기
모듈에서 기본으로 내보낼 수 있습니다.
// math.js
export default function multiply(a, b) {
return a * b;
}
// main.js
import multiply from './math.js';
console.log(multiply(2, 3)); // 출력: 6
CommonJS 모듈
Node.js 환경에서는 CommonJS 모듈 시스템을 사용합니다.
1. 모듈 생성
모듈 파일 math.js
를 생성합니다.
// math.js
function add(a, b) {
return a + b;
}
function subtract(a, b) {
return a - b;
}
module.exports = { add, subtract };
2. 모듈 가져오기
다른 파일에서 math.js
모듈을 가져와 사용합니다.
// main.js
const { add, subtract } = require('./math');
console.log(add(2, 3)); // 출력: 5
console.log(subtract(5, 3)); // 출력: 2
패키지 관리
패키지 관리자는 프로젝트에서 사용하는 라이브러리와 의존성을 관리합니다. 가장 널리 사용되는 JavaScript 패키지 관리자는 npm과 Yarn입니다.
1. npm
npm(Node Package Manager)은 Node.js의 기본 패키지 관리자입니다.
npm 초기화
npm init
패키지 설치
npm install <package-name>
2. Yarn
Yarn은 페이스북에서 개발한 빠르고 안전한 패키지 관리자입니다.
Yarn 초기화
yarn init
패키지 설치
yarn add <package-name>
package.json
package.json
파일은 프로젝트의 메타데이터와 의존성을 정의합니다.
예제
{
"name": "my-project",
"version": "1.0.0",
"description": "A sample project",
"main": "index.js",
"scripts": {
"start": "node index.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
"dependencies": {
"express": "^4.17.1"
},
"devDependencies": {
"jest": "^26.6.3"
}
}
패키지 스크립트
package.json
의 scripts
섹션을 사용하여 자주 사용하는 명령어를 정의할 수 있습니다.
예제
{
"scripts": {
"start": "node index.js",
"test": "jest",
"build": "webpack --config webpack.config.js"
}
}
스크립트를 실행하려면 npm run <script-name>
또는 yarn <script-name>
명령어를 사용합니다.
npm run start
yarn start
결론
모듈과 패키지 관리는 JavaScript 개발에서 중요한 부분입니다. 모듈을 사용하면 코드의 재사용성과 유지보수성을 높일 수 있으며, 패키지 관리자는 프로젝트의 의존성을 쉽게 관리할 수 있도록 도와줍니다.
다음 글에서는 이벤트 루프와 비동기 처리에 대해 알아보겠습니다.
다음 글에서 만나요!
'JavaScript 심화 시리즈' 카테고리의 다른 글
[JavaScript 심화 시리즈] 7일차: JavaScript 메모리 관리와 성능 최적화 이해하기 (0) | 2024.08.07 |
---|---|
[JavaScript 심화 시리즈] 6일차: JavaScript의 이벤트 루프와 비동기 처리 이해하기 (0) | 2024.08.06 |
[JavaScript 심화 시리즈] 4일차: JavaScript 비동기 프로그래밍: 콜백, 프로미스, async/await 이해하기 (0) | 2024.08.04 |
[JavaScript 심화 시리즈] 3일차: JavaScript의 프로토타입과 상속 이해하기 (0) | 2024.08.03 |
[JavaScript 심화 시리즈] 2일차: JavaScript의 this 키워드 이해하기 (0) | 2024.08.02 |