Babeljs কী এবং কেন?

সোমবার, ২২ মার্চ ২০২১, দুপুর ৩:৪০ সময়

জাভাস্ক্রিপ্ট কোড তো আমরা লিখছি কিন্তু এটা কি আমরা ভেবেছি আমাদের লিখা জাভাস্ক্রিপ্ট কোড সব ব্রাউজার এ সাপোর্ট করবে কিনা? কারণ আমরা এখন আর সেই মান্দাতার আমলের জাভাস্ক্রিপ্ট লিখছি না। ES6 থেকে শুরু করে এখন ES11 চলে এসেছে। এই নতুন ভার্সন গুলি আমাদের প্রচুর সুযোগ সুবিদা দিচ্ছে যা আমরা আগে পেতাম না।

যেমন:

  • class keyword
  • Object destructing
  • Rest and spread operator
  • Fat arrow function

ইত্যাদি আরও নতুন অনেক ফিচার। গুগল ক্রোম , ফায়ারফক্স বা সাফারি এর মত উন্নত ব্রাউজার গুলির নতুন ভার্স এ ইতিমধ্যে সাভাস্ক্রিপ্ট এর নতুন সকল ফিচার কাজ করে কিন্তু আমরা এর মানে এই না যে আমাদের লিখা নতুন ভার্সন এর কোড সকল ব্রাউজারে সমান ভাবে সঠিকভাবে কাজ করবে। তাহলে কি আমরা শুধু মাত্র তাদের জন্যেই এপ্লিকেশন বানাব যারা উন্নতমানের ব্রাউজার ব্যবহার করে? এমনও অনেক লো কনফিগারেশন এর ডিভাইস এবং ফোন আছে যেখানে উন্নতমানের ব্রাউজার সাপোর্টই করে না।

তাহলে আমরা এমন কী করতে পারি যাতে করে আমাদের লিখা সকল জাভাস্ক্রিপ্ট কোড সকল ব্রাউজারে সাপোর্ট করবে?

আমরা কী নতুন ভার্সনের কোড ছেড়ে সনাতন জাভাস্ক্রিপ্ট লিখব? সেই ক্ষেত্রে কিছু সমস্যা আছে। প্রথমত পুরাতন ভার্সনের জাভাস্ক্রিপ্ট এর syntax কিছুটা খটোমটো, দৃতীয়ত আমরা জাভাস্ক্রিপ্ট এর নতুন নতুন চমৎকার ফিচার গুলি থেকে বঞ্চিত হব।

ঠিক এই সমস্যাটি দূর করার জন্যে আমাদের হাতে এখন একটি চমৎকার টুল আছে যা হচ্ছে babeljs

Techdiary: babeljs official website
babeljs official website

Babeljs এর ওয়েবসাইট এ আপনি দেখতে পাবেন তারা বলছে

Use next generation JavaScript, today.

- Babeljs

Babeljs কে বলা হয় ট্রান্সপাইলার। এটাকে আপনি translator বা অনুবাদক এর সাথে তুলনা করতে পারেন। এটি এমনটি টুল যা আপনার নতুন ভার্সনে লিখা কোড transpile বা পরিবর্তন করে সেই পর্যাটন ভার্সনে নিয়ে যাবে যাতে করে সকল ধরনের ব্রাউজারে সাপোর্ট করে।

অর্থাৎ আমরা কোড লিখব es6/es7/es8 এ কিন্তু সেগুলি পরিবর্তন করে নিয়ে যাবে একদম পুরাতন ভার্সনের কোড এ। খুব মজা না? 😂

শুধুমাত্র তাই নয়, বেবেলজেস এ Plugin ব্যবহার করে আমরা এমন এমন ফিচার নিয়ে আসতে পারি যা এখনো কোন ভার্সনে আসেনি। মূলত জাভাস্ক্রিপ্ট এর ফিচার গুলি প্রথমে প্রপোজাল বা প্রস্তাবনা হিসেবে আসে। পরবর্তিতে এই প্রোপজার কতটা জনপ্রিয় এবং উপকারী তার উপর ভিত্তি করে নতুন ভার্সনে একটি ফিচার হিসেবে যুক্ত করা হয়। Babeljs এর Plugin এর মাধ্যমনে আপনি চাইলে এই সকল প্রপোজাল গুলি ব্যবহার করে দেখতে পারেন।

এই সিরিজ এ আমরা আসতে আসতে babeljs কীভাবে সেটআপ করতে হয়, কীভাবে কনফিগার করতে হয় ইত্যাদি সকল খুঁটিনাটি বিষয় গুলি আসতে আসতে দেখব।

পরবর্তি পর্বগুলার জন্যে অপেক্ষায় থাকুন, আপাতত বিদায় নিচ্ছি। আল্লাহ হাফেজ।