JavaScript v roce 2016 není JavaScript z roku 2010. ES6 (ES2015) přinesl arrow functions, classes, modules, promises, destructuring. Problém: prohlížeče to zatím neumí. Řešení: Babel transpiler, webpack bundler, ESLint linter.
Babel: budoucí JavaScript dnes¶
Babel kompiluje ES6+ kód do ES5, který zvládne každý prohlížeč. Píšete moderní JavaScript, Babel ho přeloží do kompatibilní verze. Preset env automaticky detekuje potřebné transformace podle cílových prohlížečů.
// ES6 (zdrojový kód)
const fetchUsers = async () => {
const response = await fetch('/api/users');
const { data, total } = await response.json();
return data.map(user => ({ ...user, active: true }));
};
// ES5 (Babel output) — funguje všude
ESLint: konzistentní kód¶
ESLint kontroluje styl a kvalitu kódu. Přednastavené konfigurace (airbnb, standard) pro konzistenci v týmu. Integrace s IDE — chyby vidíte při psaní. V CI pipeline: build selže na lint chybách.
npm scripts místo Grunt/Gulp¶
Pro jednoduché projekty nepotřebujete task runner. npm scripts v package.json
stačí: "build": "webpack --mode production",
"test": "jest", "lint": "eslint src/".
Méně závislostí, méně konfigurace.
Moderní toolchain je investice¶
Babel + webpack + ESLint = základ moderního JS projektu. Setup zabere den, ale vývojářský komfort a kvalita kódu se zlepší dramaticky.