AJAX কী এবং কীভাবে পুরোন প্রযুক্তির নতুন ব্যবহার

ওয়েবে, ওয়েব ডেভেলপার থেকে শুরু করে সাধারণ ব্যবহারকারি পর্যন্ত, সবার কাছে গত কয়েক বছর ধরে যে শব্দটি গুঞ্জনে পরিণত হয়েছে তা হচ্ছে AJAX . হাজারো ওয়েব application তৈরি হয়েছে ও হচ্ছে এই প্রযুক্তির উপর ভিত্তি করে। কিন্তু কী এই AJAX ?

Ajax = পুরোন প্রযুক্তির নতুন ব্যবহার

Ajax এর পুরো অর্থ হচ্ছে Asynchronous JavaScript and XML. Ajax কোন প্রোগামিং ল্যাংগুয়েজ নয় বরং এটি একটি প্রযুক্তি। একটি প্রযুক্তি বলা ভুল হবে বরং ওয়েব ডেডেলপমেন্টে ব্যবহৃত হয় এমন কতগুলো প্রযুক্তির সমষ্টি মাত্র। XHTML, CSS, DOM , XML, JavaScript এই প্রযুক্তি গুলো ওয়েব ডেভেলপমেন্টের ক্ষেত্রে এমনিতেই ব্যবহৃত হয়। আর Ajax হচ্ছে এই প্রযুক্তি গুলো মিলিয়ে তৈরি একটি নতুন প্রযুক্তি।

AJAX এর নাম করণ

জেসি জেমস গ্যারেট, ২০০৫ সালের ১৮ অক্টোবরে তার প্রকাশিত লেখা Ajax: A New Approach to Web Applications মাধ্যমে সর্বপ্রথম Ajax এর নামকরণ করেন। অর্থাৎ এজাক্স শুধু নামেই নতুন, এজাক্স -এই শব্দটি ওয়েবে আসার আগেই গুগল ম্যাপ, গুগল সাজেস্ট অ্যাপলিকেশন গুলো তৈরি হয়। গ্যারেটের নাম করণের মাধ্যমে AJAX তার একটি নিজেস্ব নাম পায়। যে সব টেকনোলজি নিয়ে এজাক্স গঠিত সেগুলো ওয়েবে আগেই ব্যবহৃত হত এবং এখনও ব্যবহৃত হয়।

সিলিকনভেলির ওয়েব ডেভেলপমেন্ট ফার্মের ডাইরেক্টর গ্যারেট তার লেখায় বলেন যে, এজাক্স মূলত পাঁচটি প্রযুক্তির সমন্বয়ে গঠিত। আসুন দেখি গ্যারেট তার লেখায় Ajax কে কী ভাবে বর্ণনা করেছেন।

তার আগে বুঝে নিন

ওয়েব পেইজে আমার যখন কোন লিংককে ক্লিক বা কোন ফরম সাবমিট করি তখন আপনার browser টি server কে বলে আমাকে অমুক পেইজটি দাও বা অমুক কাজটি কর এই প্রক্রিয়াটিকে বলে request পাঠানো। আর ওয়েব সার্ভার আপনার browser এই request গ্রহন করে উত্তর সরূপ আপনাকে পাঠায় আপনার কাঙ্ক্ষিত পেইজ। একে বলে response দেওয়া। অর্থাৎ browser, server কে request পাঠায় আর সার্ভার তা process করে তার response আবার Browser কে পাঠায়। তবে উল্টোও ঘটতে পারে। শুধু এতটুকু বুঝে নিন যে browser request পাঠায় আর server পাঠায় response।

Ajax -এ যে যে প্রযুক্তি যে জন্য ব্যবহৃত হয়

XHTML ও CSS:

এজেক্স এ XHTML ও CSS দিয়ে অ্যাপলিকেশনের Interface তৈরি করা হয়। XHTML হচ্ছে HTML এর Latest ভাসর্ন এতে কিছু নতুন Specification ( HTML কোড লেখার নিয়মনীতির ) পরিবর্তন ও সুনির্দিষ্ট করা হয়েছে মূল HTML এর আমূল কোন পরিবর্তন নয়। আর CSS হচ্ছে Style Sheet যার মাধ্যমে HTML এর বিভিন্ন উপাদানকে নিয়ন্ত্রন করা হয় এবং Style প্রদান করা হয়।

DOM বা Document Object Model:

User Interface -এর যে কোন স্থান বা অংশ যখন পরিবর্তন করা হয় বা পরিবর্তন করার প্রয়োজন হয় যেমন নতুন কোন Block যুক্ত করা বা নির্দিষ্ট কোন অংশে ( DIV -এ ) নতুন কোন information বা element যুক্ত করা, গ্যারেট এর লেখা অনুযায়ী এর পরিবর্তন করার জন্য Ajax এ ব্যবহৃত হয় DOM বা Document Object Model. DOM বা Document Object Model হচ্ছে এমন একটি Application Interface যা বেশির ভাগ ব্রাউজার সাপোর্ট করে এবং যার মাধ্যমে ব্রাউজারে - এ visible এমন উপাদান গুলোকে পরিবর্তনের মাধ্যমে User Interface পরিবর্তন করা যায়।

XML বা Extensible Markup Language:

গ্যারেটের মতে Ajax প্রযুক্তিতে সার্ভার ও ব্রাউজারের মধ্যে সকল ডেটা আদান প্রদান করে XML format -এ। XML হচ্ছে HTML এর মত একটি Markup Language. HTML -এ এর Markup গুলো নির্দিষ্ট করা যেমন <p>, <a>, <span> ইত্যাদি। HTML লেখতে হলে আপনাকে এই নির্দিষ্ট tag গুলোই ব্যবহার করতে হবে। আর XML -এর আপনি আপনার নিজের ইচ্ছা মতো tag তৈরি ও ব্যবহার করতে পারবেন যেমন <product>, <id>, <item> তবে HTMLও XML কিন্তু একে অন্যের replacement নয়। HTML এর কাজ Information Display করা আর XML এর কাজ হচ্ছে data বা information carry করা। দুটোর উদ্দেশ্য আলাদা আলাদা।

XMLHttp:

উপরে যা বুঝেছিলেন তা এখন কাজে লাগান। সাধারণ ভাবে ওয়েব সার্ভারে কোন Request পাঠানো হলে সেই response এর result দেখাতে পুরো ওয়েব পেইজটি refresh হওয়ার প্রয়োজন হয়। অর্থাৎ পুরো interface টি hypered হয় বা বলতে পারেন লাফ দেয়। Ajax প্রযুক্তি মূল উদ্দেশ্যই হচ্ছে hyped Interface থেকে মুক্তি দেওয়া, অর্থাৎ পুরো UI ( User Interface ) এর কোন রকম পরিবর্তন না ঘটিয়ে সম্পূর্ণ background -এ বা asynchronously browser থেকে server এ request পাঠানো এবং ব্রাউজের পাঠানো request process করে response পাঠানো। Asynchronous মানে হচ্ছে ব্রাউজার কর্তৃক পাঠানো কোন request এর respond এর জন্য অপেক্ষা না করে তা background -এ সম্পন্ন করা। আর এ কাজের জন্য ব্যবহা করা হয় XMLHttp.XMLHttp হচ্ছে বেশিরভাগ ব্রাউজার সাপোর্ট করে এমন একটি object (যদিও IE6 করে না)। যার মাধ্যমে browser, server -এর process জন্য যে কোন request পাঠিয়ে তার responce পেতে পারে।

Javascripts:

Javascript এই সব কিছুকে এক সাথে বেঁধে ফেলে। ছবিটি দেখে মিলিয়ে মিলিয়ে পড়ুন তাহলে বুঝতে সুবিধাহবে।

(১) Javascript user এর interaction ( click, submit, keypress ) monitor করে। যেমন কোন ক্লিক হল কিনা, কোন ফর্ম সাবমিট বা keypress হল কিনা।(২) হলে, Javascript, serverএর সাথে communicate করার জন্য XMLHttp request তৈরি ও সক্রিয় করে। (৩) এরপর Javascript, ব্রাউজার কতৃক পাঠানো প্রয়োজনীয় information, XML format এ পাঠানোর জন্য এক সাথে package করে সার্ভারে পাঠায় । (৪) Javascript XHTML ও CSS দিয়ে তৈরি করা ইন্টারফেসের প্রয়োজনীয় অংশ DOM Access এর মাধ্যমে পরিবর্তন করে (৫) user কে জানান দেয় যে request সফল হয়েছে কি হয় নি।

কিন্তু

AJAX এর এই ধারণা বা মডেলটি গ্যারেট তার Article-এ পেশ করেন। গ্যারেটের এই AJAX মডেলটি Ajax এর একদম মৌলিক মডেল। যদিও গ্যারেটেই প্রথম Ajax এর মৌলিক মডেল প্রদান করেন এবং এর নাম করণ করেন কিন্তু তা পরিপূর্ণ নয়। গ্যারেট AJAX এর যে মডেল ও নাম করণ করেন তার মধ্যে বেশ কিছু সীমাবদ্ধতা আছে যার মাধ্যমে Ajax -এ ক্ষমতা পরিপূর্ণ ভাবে প্রকাশ পায় না।

কীভাবে? তা জানতে AJAX নিয়ে আপনাকে আরও একটু পড়াশোনা করতে হবে।

One of the things I am not a manifestation of the post, the post is to be copied from the source below

http://www.techtunes.com.bd