আমাদের কথা খুঁজে নিন

   

ওয়েব ডেভলপমেন্ট BY জাভাস্ক্রিপ্ট [পর্ব-০১] :: চায়ের কাপে চুমুক দিতে দিতে হালকা পাতলা কথা

প্রিয় টেকটিউনস এর বন্ধুগণ , আশা করি সবাই ভাল আছেন । আজ দূর্গা পূজার শুভ মহা ষষ্ঠি । সবাইকে শারদীয় দূর্গাপূজার শুভেচ্ছা জানিয়ে আমি আজ শুরু করছি আপনাদের জন্য একটা সুন্দর টিউটোরিয়াল যেটি আপনাদের অনেক কাজে লাগবে । আশা করি সবাই আমার সাথেই থাকবেন । আমার এবারের বিয়য় হল জাভাস্ক্রিপ্ট ।

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

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

না হলে টেকটিউনস এর ওয়েবসাইট ডিজাইনের পোষ্টগুলো দেখে আসতে পারেন । এখন আমরা জাভাস্ক্রিপ্টের মাধ্যেমে এই টিউটোরিয়ালে যে বিষয়গুলো শিখব তা হল :
১ . জাভাস্ক্রিপ্টের সকল বেসিক বিষয়
২. জাভাস্ক্রিপ্ট ডাউনলোড ও এডিট করা
৩. নিজস্ব জাভাস্ক্রিপ্ট তৈরী করা
৪. ওয়েবসাইটের জন্য ঘড়ি তৈরী করা
৫. ওয়েবসাইটের ড্রপ ডাউন মেনু তৈরী করা
৬.ওয়েবসাইটে এলার্ট মেসেজ সো করানো
৭.ওয়েবসাইটে পপ আপ উইন্ডো তৈরী করা
৮. এইচ টি এম এল ফর্ম ভ্যালিডেশন
৯. ওয়েবসাইটে রিডাইরেক্টন
১০. ওয়েবসাইটে কনফার্ম মেসেজ সো করানো
ও আরও অনেক কিছু ।
জাভা স্ক্রিপ্ট আবার দুইভাবে লেখা যায় । ১. এইচ টি এম এল এর মধ্যে
২. আলাদা ফাইল হিসেবে
আপনাদের আস্তে আস্তে সব পদ্ধতিই আমি দেখাব । তবে আজ শুধু মাত্র প্রাথমিক একটা বিষয় নিয়ে আলোচনা করব ।

সেটা হল জাভাস্ক্রিপ্ট লেখার প্রাথমিক নিয়মাবলী । সবাই নোটপ্যাড বা এডোবি ড্রিমওয়েবার এ নিচের কোডগুলি লিখুন :
এবার সবাই বিষয়গুলি ভালভাবে খেয়াল করুন । আমরা কোড লেখার আগে দ্বারা কোন কোড ইনপুট করতে চাই তা ঘোষনা করেছি । এরপর আমরা কোড লেখা শুরু করেছি দ্বারা । সব জাভাস্ক্রিপ্ট এর কোড লেখার সময়ই এই একই ভাবে শুরু ও শেষ করবেন ।

এরপর আমরা লিখেছি document.write("Hello World!") । এটাতে অংশ মূলত ২ টা । একটা হল document.write , যার দ্ব্রা আমরা ওয়েবপেজে কিছু লেখার নির্দেশ দিচ্ছি । আর আমরা কী লেখার নির্দেশ দিচ্ছে তা লেখা আছে ("") এর মধ্যে । অর্থাৎ এর মধ্যে যে টেক্সট থাকবে তাই ওয়েবসাইটে প্রদর্শিত হবে ।

অর্থাৎ Welcome To Techtunes! লেখাটি ওয়েবপেজে দেখা যাবে । এখন এই পেজ টি সেভ এইচ টি এম এল ফরম্যাটে সেভ করে দেখুন ওয়েব পেজে আমাদের লেখাটি প্রিন্ট হয়েছে । সাধারণ ভাবে জাভা স্ক্রিপ্ট দুইভাবে লেখা যায় ।
১. head.............................head এর মধ্যে । ২.body .............................body এর মধ্যে ।


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


এবার বলি এক্স্টারনাল জাভাস্ক্রিপ্ট সম্পর্কে । এটা লেখা খুবই সহজ । কোন শুরু বা শেষ করা লাগবে না । শুধু কোড লিখবেন ও তারপর সেটাকে ইউজ করার সময় একবার ডাকবেন ও বলে দেবেন কী ভাবে কাজ করবে । যেমন নিচের উদাহরণ টা দেখুন :
}
লেখার স্টাইলটা দেখুন ।

কোডটা আপনাদের কাছে কঠিন লাগতে পারে । আমি এ সম্পর্কে পরে বিস্তারিত আলোচনা করব । ভয় পাওয়ার কোন কারণ নেই । প্রথমে আমরা পপ আপ নামে একটা ফাংশন ডিক্লেয়ার করেছি function popup() দ্বারা । তারপর {} এর মধ্যে এটার কাজ বলে দিয়েছি ।

এটার কাজ হবে stay with techtunes নামক একটা এলার্ট দেখানে । এবার এটিকে .js ফরম্যাটে সেভ করুন । এরপর নিচের কোডগুলো দেখুন :
এখানে আমরা প্রথমে হেড ট্যাগের মধ্যে কোড দ্বারা আগের লেখা ফাইলটিকে ইমপোর্ট করে নিয়েছি । তারপর বডি ট্যাগের মধ্যে কোড দ্বারা এর উপস্থাপনা করেছি । এই কোডটি বলতে চাইছে যে , ওয়েবসাইটে একটি বাটন তৈরী কর , বাটনটি কেউ ক্লিক করলে আমাদের আগে তৈরী করা পপ আপ উইন্ডোটি popup() সো কর, এবং বাটনের উপরে Click Me! লেখাটি থাকবে ।

এখন যদি কেউ এই বাটনে ক্লিক করে তবে সে একটি পপ আপ উইন্ডো দেখতে পাবে যেটা তাকে সতর্ক করবে stay with techtunes কথাটা লিখে । এবার এই ওয়েবপেজটি আপনি সেভ করলে এটা একটা পপ আপ উইন্ডো দেখাবে যেটিতে ক্লিক করলে stay with techtunes নামে একটা এলার্ট দেখাবে । এটাকে . html ফরম্যাটি সেভ করুন ও আপনার কাজটি দেখুন ।
সবাইকে ধন্যবাদ । আজ অনেক কথা বলে ফেললাম ।

তার জন্য দুখখিত । আশা করি সবাই সাথেই থাকবেন । সবাইকে আবারও শূভ দূর্গা পূজার শুভেচ্ছা । ভাল থাকবেন ও কিছু না বুঝলে বলবেন ।


সোর্স: http://www.techtunes.com.bd/

এর পর.....

অনলাইনে ছড়িয়ে ছিটিয়ে থাকা কথা গুলোকেই সহজে জানবার সুবিধার জন্য একত্রিত করে আমাদের কথা । এখানে সংগৃহিত কথা গুলোর সত্ব (copyright) সম্পূর্ণভাবে সোর্স সাইটের লেখকের এবং আমাদের কথাতে প্রতিটা কথাতেই সোর্স সাইটের রেফারেন্স লিংক উধৃত আছে ।

প্রাসঙ্গিক আরো কথা
Related contents feature is in beta version.