Programació web

Què és Babel i què pot aportar a JavaScript?

Si alguna cosa ha aconseguit Javascript a diferència d'altres llenguatges de programació és ser pràcticament multiplataforma, convertint-se en “un llenguatge per governar-los a tots”.

Drauta agencia digitalDrauta

Què és Babel i què pot aportar a JavaScript?

A on està Javascript avui dia?

Des de fa temps podem executar Javascript en la part client o navegador en desenvolupament web i ara també podem executar Javascript en la part del servidor gràcies a Node.

Javascript ara també es pot utilitzar per generar una aplicació d'escriptori mitjançant la biblioteca Electron i tenim diversos exemples d'això com Atom o Skype.

Encara que la cosa no es queda aquí, podem crear una aplicació mòbil nadiva gràcies a React Native o NativeScript.

Encara que Javascript sembla tan meravellós se li veu el plomall. Un dels problemes principals de Javascript és la seva sintaxi. Per tractar de fer-la més amigable als desenvolupadors es van creant estàndards com ECMAScript  6, que és un nou estàndard.

El problema que tenim és que quan s'executa de costat de client, cada navegador pot ser compatible o no amb el nou estàndard.

Què és Babel i com ho podem utilitzar?

Per solucionar la problemàtica de compatibilitat entre estàndards i navegadors s'utilitzen compiladors que converteixen el codi Javascript d'un estàndard a un altre estàndard més antic i, per tant, més compatible. 

Llavors, Babel és un compilador que converteix un estàndard nou en una versió totalment compatible de Javascript. Així, tenim l'avantatge de poder programar en un estàndard nou sense renunciar a la compatibilitat entre navegadors.

La forma més bàsica d'ús seria inicialitzar el package.json

npm init -y

Després instal·lar els paquets necessaris:

npm install --save-dev babel-core babel-cli

Ara necessitem configurar una transformació. Per a això, crearem el fitxer .babelrc en el mateix directori que el package.json i afegim:

{
  "presets": ["es2015"]
  }

Ara instal·lem el preset:

npm -install -D babel-preset-es2015

Ja podríem compilar fitxers JavaScript:

babel es5-script.js --out-file script.js

 

Vols començar un nou projecte amb nosaltres?

Necessites un servei per a la teva web? Descobreix com et podem ajudar i no dubtis en contactar amb nosaltres.