babel(바벨)이 뭐예요?

최신 자바스크립트 언어를 아주 무난한 구 자바스크립트 언어로 치환해 준다. 최신 자바스크립트 언어에 아직 익숙하지 않은 환경들의 심신을 달래 주는(??) 좋은 트랜스파일러이다.

자바스크립트 언어의 문법이 빠르게 진화하지만, 정작 이를 실행해 주는 환경은 살짝 못미치는 경우가 많다. 브라우저의 종류도 많고, 일일이 파악할 수도 없는 노릇이기 때문에 바벨이라는 트랜스파일러를 사용하여 일관적으로 구 코드를 사용할 수 있게 해 준다.
여러 버전이 있고, 물론, node에서 사용할 수 있는 babel도 있다. npm으로 설치 가능하다.

const foo = (a, b) => a * b
//위의 ES6 코드를 아래의 old한 표준 자바스크립트 언어로 바꿔 줌
var foo = function foo (a, b) {
  return a * b;
}

//그렇게 되면
function handleHome(req,res) {
  res.send('안녕');
}
//이것도
const handleHome = (req,res) => res.send('안녕');
//이렇게 바뀔 수 있다는 것. 최고.

babel도 설치하고, babel의 최신..보다는 약간 안정적인 버전인 preset-env 버전도 따로 깔아 줘야 한다. 실험적인 게 좋다면 stage0이나 여타 다른 버전도 있으니 기호에 맞춰서 깔아 주면 좋다. 에러가 난다면 때에 맞춰 babel core도 설치해 줘야 되지만, 지금은 하는 법이 아닌 무엇인가에 대한 초점이기 때문에, 정확한 설치 정보는 babel 홈페이지에서 보길 바란다. (https://babeljs.io/)

.babelrc 라는 파일을 하나 설정해 줘야 됨. 그래야 바벨이 실행될 때, .bablerc라는 파일을 찾을 거고, 그 파일에 설정해 둔 프리셋을 읽고 이해하게 될 것이기 때문에. 만약 package.js에 스크립트를 저장해 놓았다면, node index.js대신 babel-node index.js라고 변경해 줘야 된다.

babel이 먼저 읽고, node.js를 구 버전 언어로 바꿔 줘야 하기 때문이다. 아주 편하다. 아주 좋다. 아주 행복하다. 바벨 만든 사람 천재다.

const express = require("express");
//이렇게 사용한 것도 이제는 import로 사용할 수 있다.
import express from "express";