Grunt হল একটি টাস্ক রানার এই ডায়াগল শুনতে শুনতে মনেহয় আপনাদের মাথা ব্যাথা হয়ে গিয়েছে, তো টাস্ক রানারটাই বা আসলে কি? ধরুন আপনি ভাবছেন যে একটা সিএসএস ফাইলে কাজ করার থেকে অনেকগুলো সিএসএস ফাইল নিয়ে কাজ করবেন এবং তারপর কোন সিস্টেম ব্যবহার করে সেগুলো মার্জ করে একটা style.css ফাইল বানিয়ে নিবেন ইয়েস এই কাজটাই আপনাকে Grunt করে দিবে। মুলত Grunt হল ডেভলপমেন্টে যে কাজগুলো বারবার করতে হয় সেগুলোকে একটা সহজে করার একটা সিস্টেম যেমন minification, concat compilation, unit testing, linting ইত্যাদি। Grunt এর অনেক প্লাগিন রয়েছে যেগুলো আপনি ব্যবহার করতে পারেন আবার চাইলে আপনার কাজের প্রয়োজন অনুযায়ী একটা টাস্ক রেজিস্টারও করে নিতে পারেন।
Grunt বহুল আলোচিত Node JS দিয়ে চলে। যেহেতু কমবেশি সবাই JS পারেন বা ডেভলপারদের JS না জানাটা এখন সকালে সূর্য না ওঠার মত অস্বাভাবিক হয়ে যাচ্ছে তাই দেরী না করে মাঠে নেমে যান। আপাতত ভয়ের কিছু নেই সাধারন ফাংশনাল কোড বুঝতে পারলে আপনি Grunt দিয়ে কাজ করতে পারবেন।
দেখুন টার্মিনালে এটাকে কেমন দেখা যায়
কিভাবে ইনষ্টল করবেন?
এটা সহজ কয়েটি স্টেপে ইনষ্টল করা যায় প্রথমে আপনাকে আপনার সিস্টেমে Grunt কে গ্লোবালি ইনষ্টল করতে হবে, যেন যেকোন প্রজেক্টে এটা ব্যবহার করা যায়, এটা একবারই করতে হবে। উল্লেখ্য আপনার সিস্টেমে কিন্তু Node JS ইনষ্টল করা থাকতে হবে তা না হলে এই কমান্ড কাজ করবে না, চলুন নিচের কমান্ডটি চালিয়ে দেখি।
npm install -g grunt-cli
কমান্ডটিতে আপনি Grunt Cli ইনষ্টল করতে বলেছেন আর -g ফ্ল্যাগটি গ্লোবাল মিন করে, সবক্ষেত্রে ব্যবহার নিশ্চিত করার জন্যই এটা দেয়া হয়েছে।
Grunt Init
npm হল একটি প্যাকেজ ম্যানেজার, Grunt সহ এরকম অনেক জিনিস npm দিয়ে ম্যানেজ করা হয়, আপনি হয়তো php এর কম্পোজারের কথা শুনে থাকবেন, npm এরকমই একটি প্যাজেক্ট ম্যনেজার। যেহেতু Grunt আমরা npm দিয়ে ম্যানেজ করবো তাই প্রথমে প্রজেক্ট ফোল্ডারে নিচের কমান্ডটি দিতে হবে। এই কমান্ডটি package.json নামে একটি ফাইল তৈরি করবে
npm init
কিছু ইনফো দিতে বলবে চাইলে দিতে পারেন নাহলে এন্টার প্রেস করে করে ডিফল্ট ভেলু সেট করতে পারেন, যেহেতু এটি টেস্ট প্রজেক্ট তাই সিরিয়াস প্রজেক্ট হলে ইনফোগুলো সঠিকভাবে দেয়া উচিত।
এটা ছিল প্রথম স্টেপ এবার আপনাকে কোন একটা প্রজেক্টে Grunt ইনিশিয়ালাইজ করতে হবে এজন্য কমান্ডটি দিন।
npm install -S grunt
ফোল্ডারটিতে দেখতে পাবেন node_module নামে নতুন একটা ফোল্ডার এসেছে তার মধ্যে কিছু ফাইলপত্রসহ Grunt নামে একটি ফোল্ডারে আছে।
এখান আমাদের Gruntfile.js নামে একটা নতুন ফাইল বানাতে হবে যেখানে Grunt এর টাস্কগুলো ডিফাইন করা থাকবে, মুলত এটাই হল কি কি কাজ Grunt করবে এবং কিভাবে করবে, কোন প্লাগিন কখন রান করবে সব বিস্তারিতভাবে লেখা থাকবে। ফাইলটি কোন ফাইল ম্যানেজার ব্যবহার করে করতে পারেন অথবা touch Gruntfile.js কমান্ড দিয়ে করে ফেলতে পারেন।
ব্যাস ইনষ্টল শেষ এবার চলুন একটি হেলো ওয়ার্ল্ড লিখে ফেলি 😀
ভাই থামেন! হেলো ওয়ার্ল্ড লিখার আগে কিছু জিনিসপত্র ক্লিয়ার হয়ে নেই নাহলে পরে কপিপেষ্টার উপাধি পাবেন!
module.exports = function(grunt) {
// Do grunt-related things in here
};
এটাকে বলা হয় Wrapper Function এটা আপনার Gruntfile.js এ লিখে ফেলেন এটার ভেতরেই আপনার সমস্ত Grunt রিলেটেড কাজকর্মের লিস্ট থাকবে। উল্লেখ্য ফাইলটির নাম কিন্তু অবশ্যই Capital ‘G’ দিয়ে শুরু হবে।
প্রশ্ন হল ভেতরে কি লিখবো? ওয়েল আমরা আপাতত যেহেতু হেলো ওয়ার্ল্ড লিখার প্লান করেছি সো একটা হেলো নামে টাস্ক রেজিস্টার করবো, এটা রেজিস্টার হলে টার্মিনাল থেকে সহজেই কমান্ডটি ব্যবহার করতে পারবো। এজন্য আপনাকে registerTask() নামে একটি ফাংশন ব্যবহার করতে হবে। আপনারা জেকুয়েরী ব্যবহার করে থাকলে এটা কোন ব্যপারই না।
grunt.registerTask('hello', function(){
console.log('hello world');
});
এই কোডটুকুতে আমরা hello নামে একটা টাস্ক রেজিস্টার করেছি যেটা রান করলে কনসোলে “hello world” কথাটা প্রিন্ট হবে, চলুন এবার চালিয়ে দেখি।
টার্মিনালে নিজের কমান্ডটি দিন,
grunt hello
দেখবেন নীচের মত hello world লিখাটি প্রিন্ট হয়েছে এবং এর মাধ্যমে Grunt ব্যবহার করে আপনি প্রথম টাস্ক রেজিস্টার করলেন।
আজকের মত এখানেই শেষ, সামনের পর্বগুলোতে Grunt এর বেশকিছু প্লাগিনের ব্যবহার, এবং সেগুলো বিভিন্নভাবে ব্যবহার করে দেখবো আমরা।