4. Gulp의 핵심 개념 - 1

Task와 Task Runner

소개

Gulp.js에서 가장 핵심적인 개념 중 하나는 "Task"와 "Task Runner"입니다. 이들은 Gulp의 핵심 역할을 담당하며, 프로젝트의 자동화된 작업 흐름을 제어합니다.

Task란 무엇인가?

Gulp에서의 Task는 어떤 종류의 작업이라면 그것을 의미합니다. 예를 들어, JavaScript 파일을 병합하거나, 이미지를 최적화하거나, CSS를 압축하는 것 등 여러가지가 Task로 정의될 수 있습니다. Task는 개별적인 작업 단위로 이해할 수 있습니다.

Task Runner란?

Task Runner는 이러한 Task들을 실행하고, 관리하는 주체입니다. Gulp.js가 여기에 해당하며, 프로젝트에서 필요한 다양한 Task들을 정의하고, 그것들을 실행시키는 주체로 동작합니다.

Gulp에서의 Task 정의

Gulp에서 Task는 JavaScript 함수로 정의됩니다. Gulp는 이러한 JavaScript 함수를 찾아서 실행하며, 이 함수 안에는 수행하고자 하는 작업이 기술되어 있습니다. 간단한 예를 들면 다음과 같습니다.

const gulp = require('gulp');

// 'hello'라는 이름의 Task 정의
gulp.task('hello', () => {
    console.log('안녕하세요!');
});

 

이렇게 정의된 hello Task는 Gulp에서 실행 가능한 하나의 작업 단위가 됩니다.

의존성과 Task 실행 순서

Task들 간에는 종종 의존성이 존재합니다. 예를 들어, JavaScript 파일을 압축하기 전에 병합해야 하는 경우가 있습니다. Gulp에서는 이러한 의존성을 명시하여 Task 실행 순서를 조절할 수 있습니다.

const gulp = require('gulp');

// 'merge' Task 정의
gulp.task('merge', () => {
    console.log('병합 수행');
});

// 'compress' Task 정의, 이 Task는 'merge' Task가 끝난 후에 실행
gulp.task('compress', ['merge'], () => {
    console.log('압축 수행');
});

 

이렇게 함으로써 'compress' Task는 'merge' Task가 끝난 후에 실행됩니다.

결론

Task와 Task Runner는 Gulp에서 자동화 작업을 정의하고 실행하는 핵심적인 요소입니다. 각 Task는 프로젝트의 특정 작업을 수행하며, Task Runner는 이러한 Task들을 효과적으로 관리하여 프로젝트를 자동화합니다. Gulp를 사용하면 이러한 Task와 Task Runner의 개념을 통해 프로젝트의 빌드 및 개발 과정을 효율적으로 제어할 수 있습니다.