Apa kegunaan Babel pada javascript ?

Musliadi
Musliadi
Nov 3 · 2 min read

Pernah baca atau mendengar kalau javascript dikembangkan hanya dalam waktu 10 hari ? Ya javascript didesign hanya dalam waktu 10 hari oleh Brendan Eich sang creatornya. Kalau tidak salah dari berbagai informasi yang saya baca, ini disebabkan karena sang creator dikejar deadline oleh perusahaan, yaitu Netscape yang sekarang lebih dikenal Mozilla Foundation.

Banyak para praktisi dan programmer beranggapapan, bahwa terlalu buru-burunya pembuatan javascript membuat bahasa ini banyak kekurangan, bahkan ada juga yang mengatakan bahasa yang buruk.

Dari permasalahan tersebut para developer melakukan perbaikan secara berkala. Namun dari proses perbaikan tersebut juga menimbulkan masalah baru. Dimana dari segi code javascript telah banyak berubah menjadi lebih baik, namun engine atau mesin yang menjalankannya (browser seperti google chrome, mozila, opera dll) sendiri terbilang lambat dalam mengikuti perkebangan perubahan code javascript yang ada. Sampai saat ini javascript telah berada pada versi ES6 dan ES7 sedang dalam proses pengembangan. Sedangkan browser hanya bisa membaca versi ES5.

Nah dari segi kenyamanan coding, ES6 lebih baik dari ES5. ES6 juga kini memiliki gaya coding seperti OOP. Teknologi seperti VueJS,React,Angular, NodeJS juga mendukung gaya coding ES6. Intinya para developer dunia banyak pada migrasi dari ES6 ke ES6. Teman-teman bisa lihat dari tutorial yang ada, hampir semua tutorial yang berhubungan dengan javascript menggunakan gaya ES6.

Tadi dikatakan kalau nggak semua browser support dengan ES6 terus gmana dong ? Disinilah Babel datang sebagai pahlawan. Babel adalah transpiler, penerjemah bahasa javascript yang tidak atau belum support pada browser atau nodejs. Penjelesannya gini, saat ini browser hanya support terhadap ES5, sedangkan teman-teman koding projectnya menggunakan ES6, maka babel bertugas untuk mengkonversi ES6 ke ES5 agar bisa dibaca oleh browser. Contohnya gini :

Teman-teman bisa lihat, sebelah kiri adalah model bahasa terbaru dari javascript, sedangkan kanan adalah hasil dari konversi yang dilakukan oleh babel agar browser bisa membacanya.

Sebagai tambahan, saya juga merekomendasikan teman-teman membaca artikel tentang perbandingan ES5 dan ES6 pada react.

baca : React cheatsheet: ES5 vs ES6

Untuk cara penggunaan, menginstall dan sebagainya saya merekomendasikan teman-teman mengikuti tutorial ini Memahami ES6, Part 1 — Babel

demikian pembahasan kali ini, semoga bermanfaat. Jangan lupa share hehe.

    Musliadi

    Written by

    Back End Developer > JogjaCamp | Javascript Enthusiast

    Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
    Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
    Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade