Mengenal Webpack, Dependensi Manajer Untuk React

Untuk membangun real-project dengan React kita wajib menggunakan NodeJS dan NPM. NodeJS adalah server-side environment yang memungkinkan kita membuat aplikasi server dengan Javascript, sedangkan NPM adalah package manajer dari NodeJS yang memudahkan kita untuk mencari dan menginstal package-package yang dibutuhkan dalam membangun aplikasi.

Seperti yang kita tahu bahwa React hanya sebuah library kecil, yang tidak mampu untuk membuat aplikasi besar tanpa package pendukung, seperti Babel, Gulp, Browserify, jQuery dan lain-lain.

Salah satu package yang paling penting dan banyak digunakan adalah Webpack.

Apa itu Webpack?

Webpack adalah sebuah dependensi manajer yang memudahkan kita dalam mengatur apa saja yang dibutuhkan oleh aplikasi. Seperti membaca file Sass, membuat Server dan lain-lain.

Cara kerja Webpack

Webpack bekerja dengan cara menerjemahkan bahasa-bahasa transpile seperti TypeScript, SASS, CoffeScript, ES6 menjadi bahasa asli yakni JavsScript (ES5) dan CSS. Kenapa ini perlu? karena browser hanya dapat menjalankan perintah dari bahasa asli/murni. Proses tersebut dikenal dengan istilah (Transpiling/Bundler).

Hasil dari transpiling akan menciptakan sebuah file JavaScript (biasanya bernama bundle.js). Isi dari file bundle tersebut adalah memuat semua module-module yang telah kita buat.

Pada artikel selanjutnya kita akan belajar menginstal Webpack.