এই ব্লগটি সন্ধান করুন

বৃহস্পতিবার, ২৭ মার্চ, ২০১৪

About Tutorial


Lecture-7


ওয়েব ডেভেলপার হবার সিক্রেট
হুশিয়ার, হুশিয়ার
হুশিয়ার, সাবধান
 বাংলার আকাশে আজ দুর্যোগের ঘনঘটা, চাল্লু মীর জাফর, পান্খু রাজ ভল্লব, সুন্দরী ঘসেটি বেগমের ধুম্র জালে আটকা, আজকালকার পোলাপান
১- প্ল্যান বা পরিকল্পনা বানানোর নাম ভাঙ্গীয়ে ঘন্টার পর ঘন্টা টাইম নষ্ট করে।
২-আজকে গা ম্যাজম্যাজ করে, এই সপ্তাহ থাক পরের সপ্তাহে, এই সেমিস্টারটা যাক পরের সেমিস্টার দুনিয়া উল্টায়ে দিবো এইসব ভগিজগি দেখায়।
৩-আমি তো কম্পিউটার সায়েন্সে না, আমি ম্যাথ ভালো বুঝি না, এইসব ফালতু কথা বলে ফেবুতে চ্যাট করে।
৪-পেট ব্যথা টাইপের চুদুরবুদুর অজুহাত দিয়ে খালি পিছলায়, আর পিছলায়
স্বাধীন বাংলার লক্ষ লক্ষ তরুনকে ওয়েব ডেভেলপার হবার পথ থেকে ভ্রষ্ট করে ফেলবে ইস্ট ইন্ডিয়া কোম্পানি।
না না, এ হতে পারে না, এ হতে দেয়া যাবে না।
তারাতো জানে না, বাংলা বিহার উরিষ্যার মহান অধিপতি নবাব সিরাজউদ্দৌলার আছে
১- ইচ্ছা: ফকিরা মার্কা ইচ্ছা না, করেই ছাড়বে, শেষ দেখেই ছাড়বে এমন সলিড ইচ্ছা।
২- চেষ্টা: চেষ্টা মানে সেরাম চেষ্টা। জীবন বাজি রেখে উদ্দেশ্য হাছিল করার চেষ্টা।
৩- এনজয়: কঠিন কাজগুলোর মাঝেও আনন্দ খুঁজে বের করে, সহজেই করে ফেলে।
৪- চ্যালেঞ্জ:আটকে গেলে বা লজ্জাজনক পরিস্থিতিতে পরে গেলে, সেটাকে চ্যালেঞ্জ দিয়ে সমস্যা অতিক্রম করে 
 নবাবের সিক্রেট হচ্ছে
১- গুগল সার্চ দিয়ে দিয়ে, দিয়ে দিয়ে, আবারো দিয়ে, তারপরেও দিয়ে, তারপেরর পরেও দিয়ে
২- পছন্দের সাইটেগুলো বুকমার্ক করে রাখে
৩- আসল সিক্রেট টা হচ্ছে
         a- শিখার বা বুঝার চেষ্টা করে না
         b- যা পায় সেটা দেখে দেখে টাইপ করেন (খবরদার !!! ভুলেও কপি পেস্ট করে না)
         c-যতটুক করে তার সাথে সামান্য একটু একটু করে নতুন নতুন জিনিস যোগ করে
        d-অন্য জায়গায় একই জিনিস দেখলেও, সেটাই আবার দেখে দেখে টাইপ করে
৪-একই জিনিস বার বার করতে থাকে, করতে করতে একদিন নিজের অজান্তেই শিখে ফেলে, ওই বিষয়ে ওস্তাদ বনে যায়
 নবাব খুব ভালো করেই জানে, তার দুইজন শত্রু আছে
১- অল্প একপাতা ওয়েবসাইট বানাইয়া খুশিতে আসমানে উঠে গেলে সে শেষ
২-দাম্ভিকতা দেখায় না, অন্য কেউ কিছু না পারলে উপহাস করে না, বরং
      a- সে কোনো জায়গায় আটকে গেলে তাকে সহযোগিতা করেন
     b- তার প্রশ্ন থাকলে উত্তর দেয়ার চেষ্টা করেন
     c- উত্তর জানা না থাকলে, গুগল সার্চ মেরে উত্তর খুঁজে বের করে উত্তর দেন
     d- এই সার্চ মারাই নবাবের আসল নবাবি
  দুই চারখান ওয়েবসাইট নিজের হাতে বানায় ফেল্লে আপনি নবাব হয়ে যাবেন আর বুঝবেন, ওয়েবসাইট তৈরী করা জাস্ট হাতের মোয়া। 
যদি লক্ষ্য থাকে অটুট, বিশ্বাস হৃদয়ে, হবেই দেখা বন্ধু, দেখা হবে বিজয়ে
কিছু লিংক
বিশ্বজোড়া রাসেলের কাজ
R R Founcation
Tutorial BD

Lecture-7


অসাধারণ ওয়েবসাইট
হাড্ডাহাড্ডি লড়াইয়ে খেলা জমে উঠেছে, আমি চৌধুরী জাফর উল্লাহ সারাফত (সারাফত কে শরবত ভেবে ভুল করবেন না)।
আমার বাম পাশে আছে (!)
কে আছে? কে আছে ??
তা জানতে হবে তার কাছ থেকে ইনপুট নিতে হবে
ইনপুট নেবার উপায় হচ্ছে <input></input>
ও হা জেনে গেছি উনি উত্ফল শুভ্র, ভাই আপনার পাসওয়ার্ড কি?
আরে, জনসমক্ষে কি পাসওয়ার্ড বলা যায়?
পাসওয়ার্ড বলতে হবে সঙ্গোপনে, আড়ালে, অন্তরালে কিংবা মগডালে
তার মানে এইটা আলাদা টাইপের জিনিস, তাই টাইপ তা বলে দিতে হবে।
চিন্তার কুনো নাই কুল, মাঠে নামছে বাংলার ফুল, আশরাফুল
জাস্ট একটা টাইপ লাগাই দিবেন
<input type=”password”></input>
 
গ্যালারীতে সেরাম কাউরে দেখে, চোখ টিপ বা টিক মারার দরকার গেলো  পরে
বাংলার ফুল, আশরাফুল কি পারবে টিক দিতে?
টিক দিতে হলে, চেকবক্স করতে হবে
কিন্তু চেক কই পাবে, খেলার টাইমে?
চট করে মুন্নি সাহা বলে উঠলো
<input type=”checkbox”></input>

 মুন্নি চোখ কচলাতে কচলাতে, জানুয়ারী মাসের প্রথম দিন কয় তারিখে??
প্রথম আলোর মতি ভাই, পুলকিত হয়ে বললো, টাইপ টা শুধু ডেইট করে দে।
ডেইট মতি ভাইয়ের লগে না, html এর লগে
<input type=”date”></input>

 একটু পর ঝিমাইতে ঝিমাইতে মতি ভাই বললো আচ্ছা রেডিও বাজে কই।
কমেন্ট্রি বক্সের কাচ ভেঙ্গে ঢুকে পড়লো, বাংলার টম ক্রুজ, জলিল ভাই।
ম্যান সিস্টারে MBA করার সময় ঘানায় দেখেছেন
টাইপ টা শুধু রেডিও করে দিলেন
<input type=”radio”></input>

 এতক্ষণ সবার হাঙ্কি পাঙ্কি দেখে মুচকি হাসছিলেন বাবু, রুবেল সহ এনাম মেডিকেলের সোনার সন্তানেরা।
তুমরা শুধু বুলি আওড়াইতে পারো, ভবনের স্তম্ব নাড়াতে পারো
কিন্তু আসল কাজটা করতে চাও না।
ঝুকি নিতে চাও না, ক্ষমতা চাও, ভালবাসতে চাও না
ভালবাসা সাবমিট করতে হয়, বাটন দিয়ে
<button>Submit</button>
এইবার পুরস্কার ঘোষণা করবেন, প্রতিবেশিনী চিনা চৌহান
(চিনা বামুনের (চৌহানের) পৈতা লাগে না)
এন্ড দা অ্যাওয়ার্ড গোজ টু, নান আদার দেন, দি গ্রেট পদার্থবিদ
ফর হিজ স্তম্ব নাড়ানি থিওরী।

Lecture-5


 স্মার্ট ওয়েবসাইট (Javascript ও JQuery)
আমি মি. জাভাস্ক্রীপ্ট। দুনিয়ার সব ওয়েবসাইটের অলি গলি আমার আখড়া। তুমি স্মার্ট হইতে চাইলে আমার কোনো বিকল্প নাই। আচ্ছা তোমার নাম কি? (ইংরেজিতে লিখো)
visit http://jhankarmahbub.com/presentations/JS1.html
তোমার তো দেখি হেব্বি সাহস, এই খানেও চইল্যা আইছো?
চইল্যা যখন আইছোই, তাহলে শুনো "আমি খুব সহজ সরল। জিনিসে জিনিসে ভেদাভেদ করি না"
সে কোনো সংখা (number) হোক, টেক্সট (string) হোক, সত্য মিথ্যা (boolean) যাই হোক।
সব কিছুই আমার কাছে variable
এইটা আমি আবার সংক্ষেপ করে বলি var (মানে variable এর প্রথম তিনটা লেটার )"

একদম পানির মতো সহজ।
কোনো সংখ্যা লাগলে লিখবা var x =5; আবার var y =10;
আবার দুইটা যোগ ও করে ফেলতে পারো var z=x+y;
আর চাইলে বিয়োগ (var z=x-y;),
গুন (var z= x*y;),
ভাগ (var z=x/y;) ও করে ফেলতে পর
আর রেজাল্ট দেখতে চাইলে লিখো alert() যেমন , alert(z);
একইভাবে আমি কোনো টেক্সট বা স্ট্রিং ও ব্যবহার করতে পারি।
এই যেমন,
var str ="my awesome string";
var str2 ="another string";
চাইলে স্ট্রিং দুইটারেও জোড়া দিতে পারো
var newStr = str +str2;
আর রেজাল্ট দেখতে চাইলে লিখো alert() যেমন , alert(newStr);
আবার একই জায়গায় সত্য মিথ্যাও রাখতে পারো। যেমন,
var amiValo =true;
var tumiKharap = false;
আর রেজাল্ট দেখতে চাইলে লিখো alert() যেমন , alert(amiValo);
কোনো দুইটা জিনিস তুলনা করার জন্য অনেক উপায় আছে
এই যেমন,
var x =3;
var y =5;
== দুইটা সমান চিহ্ন দিয়ে তুলনা করি সমান কিনা
!= একটা আশ্চর্য ও একটা সমান চিহ্ন দিয়ে তুলনা করি অসমান কিনা
x>y মানে, চেক করবে y এর চাইতে x বড় কিনা
X < y মানে, চেক করবে y এর চাইতে x ছোট কিনা
আর রেজাল্ট দেখতে চাইলে লিখো alert() যেমন , alert(x==y);
আমি কিন্তু যে যেরকম তাকে সেরকম ভাবে দেখি।
তাই x আর X আমার কাছে এক নয়
X বড় হাতের, x ছোট হাতের
তাই এই দুইটা সমান নয়
মোদ্দাকথা আমি কেইস সেনসিটিভ (উল্টা পাল্টা কেইস নিয়ে আমার কাছে আসবেন না )
var first = "x";
var second = "X";
আর রেজাল্ট দেখতে চাইলে লিখো alert() যেমন , alert(first==second);
তোমার যদি এক টাইপের জিনিস অনেকগুলা থাকে।
এই যেমন ধরো তোমার অনেকগুলা সংখ্যা আছে।
তাইলে তুমি পন্ডিত অনেকগুলা var লিখতে পারো। যেমন,
var a=3; var b=5; var c=6; var d=9----
আমি গাধায় সেটা না করে array লিখি
array লিখতে হয় [ ] থার্ড ব্রেকেটের মধ্যে। যেমন,
var myArray = [3,5,6,9];
আর array এর প্রথম সংখ্যা পড়ার উপায় myArray[0];
আর রেজাল্ট দেখতে চাইলে লিখো alert() যেমন , alert(myArray[1]);

HTML_Course

১ম সাময়িক পরীক্ষা, ২০১৩
বিষয়: পরিবেশ পরিচিতি সমাজ
প্রশ্ন: পরিবেশ বলতে কি বুঝায়? সামাজ বিজ্ঞানীদের মতে পরিবেশের সংজ্ঞা কি? পরিবেশ কয় প্রকার ও কি কি? উদাহরণসহ  বিস্তারিত আলোচনা করো?
উত্তর: আমাদের চারপাশে যা কিছু আছে, তাই নিয়ে আমাদের পরিবেশ। মাটি, পানি, গাছপালা, রাস্তাঘাট, ঘরবাড়ি, ল্যাপটপ, স্মার্টফোন, ফেইসবুক ইত্যাদি পরিবেশের উপাদান।
আধুনিক সমাজ বিজ্ঞানী মার্ক জুকারবার্গ বলেন, “মিউচুয়াল ফ্রেন্ড, লাইক আর কমেন্ট দিয়ে ছোট্টু করে ফেলি আপনার পরিবেশ। পরবর্তীতে বুদ্ধিতে ঘাটতি অনুভূত হলে বকা দিবেন না, প্লিজ।”
পরিবেশ দুই প্রকার
১-সত্যি সত্যি সামাজিক পরিবেশ
২- ঝুটা পরিবেশ

সত্যি সত্যি সামাজিক পরিবেশ:
সত্যি সত্যি সামাজিক পরিবেশে আপনি বেসিক ওয়েবসাইট ডেভেলপমেন্টের সার্টিফিকেট অর্জন করতে পারেন। এই সার্টিফিকেট দেয়া হবে শিক্ষক ডট কম ও ঝংকার মাহবুবের পক্ষ থেকে। “আমরাই পারি” প্রতিযোগিতায় অংশগ্রহণ করে সার্টিফিকেটের পাশাপাশি আপনি আকর্ষনীয় পুরস্কারও জিতে নিতে পারেন। তার জন্য, আপনাকে-
১-৩ পাতার একটা ওয়েবসাইট বানাতে হবে, একা বা সর্বোচ্চ ৫ বন্ধুদের মিলে
ওয়েবসাইট বানাতে হবে সাধারণ মানুষের কোনো ছোটখাটো সমস্যা ও তার সমাধানের উপর
প্রতিযোগীতায় নিবন্ধন করার শেষ সময়: ১৫ এপ্রিল, 2014 বাংলাদেশ সময় ভোর ৪.৫৯ মিনিট
নিবন্ধনের লিংক: sizansoft@gmail.com
চূড়ান্ত ওয়েবসাইট জমা দেওয়ার শেষ সময়: ১২ মে, বাংলাদেশ সময় ভোর ৪.৫৯ মিনিট

পুরস্কার:
১ম পুরস্কার:৩ বছরের ডোমেইন ও ৩ বছরের হোস্টিং
২য় পুরস্কার: ১ বছরের ডোমেইন ও ১ বছরের হোস্টিং
৩য় পুরস্কার: ১ বছরের ডোমেইন ও ১ বছরের হোস্টিং
সিলেক্টেড প্রজেক্ট: ডোমেইন ও হোস্টিং স্পেশাল ডিসকাউন্ট
সব প্রতিযোগী: ডিক্লারেশন অফ একমপ্লিশমেন্ট (সার্টিফিকেট)
বিস্তারিত দেখুন উপরের ভিডিওটিতে অথবা এই লিংকে
আপনার কোনো জিজ্ঞাসা থাকলে নিচে কমেন্ট করুন
“আমরাই পারি” প্রতিযোগীতার পুরস্কার স্পন্সর করছেন: Xeon Software Limited . উনাদের এগিয়ে আসার জন্য বিশেষ ধন্যবাদ

ঝুটা পরিবেশ:
কম্পিউটার বা ইন্টারনেট হচ্ছে ঝুটা পরিবেশ (এইবার লেখককে বকা দিবেন না, প্লিজ), সারাদিন তাতে মজে থাকলে আপনি নিজেও সেই পরিবেশের উপাদান। আর আপনার বেশিরভাগ সময় কাটে ইন্টারনেট ব্রাউজারে। ব্রাউজারের যে জায়গাটাতে আপনি কোনো ওয়েবসাইটের নাম/ ঠিকানা লিখেন ( “www.google.com”), তাকে বলে “Address bar”. সেখানে ওয়েবসাইটের নামের আগে “https” যোগ করা হয়। https মানে (hypertext transfer protocol secure) যা নিশ্চিত করে আপনাকে পাঠানো ওয়েবসাইট অন্য কেউ দেখতে পারে না। আর পুরো জিনিসটাকে বলে URL (Uniform/Universal Resource Locator). ওয়েবসাইটের এড্রেস/ ঠিকানা স্বতন্ত্র হতে হয় (অর্থাৎ www.google.com নামে সারা দুনিয়াতে একাধিক ওয়েবসাইট থাকতে পারবে না)।
 পরিবেশের গন্ডি ছাড়িয়ে সারা দুনিয়ার মানুষকে আপনার ওয়েবসাইট দেখাইতে হলে। আপনাকে একটা ওয়েবসাইটের এড্রেস (ডোমেইন) কিনতে হবে এবং ওয়েবসাইটটি কোনো একটা সার্ভারে (হোস্টিং) রাখতে হবে। কোনো সার্ভারে ওয়েবসাইট না রাখলে কেউ তা খুজলেও দেখতে পাবে না। সাধারনত ১ বা ৩ বছরের জন্য ডোমেইন ও হোস্টিং সার্ভিস কেনা হয়।
 প্রথমে দেখতে হবে আপনি যে নামের ওয়েবসাইট তৈরী করতে চান তা আছে কিনা। যদি অন্য কেউ সেই নামটা কিনে নেয় তাহলে আপনি সেই নামটা পাবেন না। অনেকটা মোবাইলে সিমের মত। যেমন, আপনার বন্ধুর ফোন নম্বরটি কিন্তু আপনি কিনতে পারবেন না। আপনাকে অন্য আরেকটি নম্বর কিনতে হবে। আপনি চাইলে বন্ধুর কাছ থেকে ঐ সিমটি এনে ব্যবহার করতে পারেন।
 দেশে ও বিদেশে ডোমেইন ও হোস্টিং সেবা প্রদানকারী প্রচুর প্রতিষ্ঠান রয়েছে। তারা ওয়েবসাইট সার্ভারে আপলোড করার একটা উপায়ও বলে দিবে (সাধারনত: cpanel). বাংলাদেশে Xeon Software Limited
এই রকম সেবা প্রদান করে থাকেন।
 পরিশেষে, পরিবেশের অন্যতম উপাদান মনুষ্য প্রজাতিকে শুধু পরিবেশের ভারসাম্য রক্ষা করলেই চলবে না, তাকে উন্নত করার পাশাপাশি নিশ্চিন্ত নিরাপদও করতে হবে।
শেষ কথা
নিজে প্রতিযোগিতায় অংশগ্রহণ করুন এবং বন্ধুদের উতসাহিত করুন
আপনার কোনো জিজ্ঞাসা থাকলে নিচে কমেন্ট করুন

Lecture-3



দুই একে দুই
ওয়েবসাইট মেকআপের সবকিছু <style> </style > এর ভিতর থুই


দুই দুই গুনে চার
কোলন(:) দিয়ে বুঝাবো কে কাহার
কোলনের বামপাশ জায়গাটা বৈশিষ্ট বা প্রপার্টি রাখার
আর ডানপাশটা value বা মানের আধার
সেমিকোলন(;) দিয়ে শেষ করি যুগলের বাহার
{ } এর ভিতরে রাখি সব যুগলের সমাহার
{ } এর আগে লিখি স্টাইলগুলা কার জন্যে উপহার


তিন দুই গুনে ছয়
রং কে ইংরেজিতে color কয়
হায় হায়, এই জিনিস শিখতে কইলে লাগে ভয়
h1 হেডারকে সবুজ করতে h1{ color: green; } লিখতে হয়


চার দুই গুনে আট
শিখে গেলাম html element এর সাথে কেমনে স্টাইল করব ফিটফাট
নতুন element যোগ করলে আগের স্টাইল করে ফেলবে কুপোকাত


পাচ দুই গুনে দশ
কোনো একটা element কে id দিয়ে স্টাইল দিলে, অন্যদের হবে লস
<h3 id=”laltu”></h3 >লিখেই ভাব ধরে তুই রেস্ট নিতে চাস
#laltu { color : red; } টা বুঝলে সত্যিই হয়ে যাবি বস


ছয় দুই গুনে বারো
class দিয়ে অনেক element কে একসাথে স্টাইল দিতে পারো
<p class=”putu”></p >লিখে element এ class যোগ করো
.putu { color:navy;} দিয়ে <style></style > এর ভিতর ধাক্কা মারো


সাত দুই গুনে চৌদ্দ
কোনো element কে background-color:pink; দিয়ে হই মনোমুগ্ধ
একইভাবে id বা class এর পিছনে রং দিতে জানে সব আবালবৃদ্ধ


আট দুই গুনে ষোল
কোনোদিনও ভুলোনা, কত্তো আদ্দর ছিলো বাবা মায়ের কোলো
border:1px solid red; দিয়ে সীমানা দেখায়, তা আগেই জানা ছিলো
margin দিয়ে একটা element অন্য element থেকে দূরে সরানো হলো
padding দিয়ে border থেকে লেখাগুলোকে দূরে ঠেলে দেয়া গেলো
border-radius:10px দিলে চোখা কোনোকানিগুলো রাউন্ড হয় কিনা বলো


নয় দুই গুনে আঠারো
width:500px; দিলে নিদৃষ্ট প্রস্থ দিতে পা পা পা পা পারো


দশ দুই গুনে বিশ
background-image:url(‘feb.jpg’); একটা কঠিন জিনিস
feb.jpg একটা ছবির নাম সেটাতো বুঝতে পারিস
না হলে ভিডিও দেখে বুঝে নিস
অথবা কচিকাচাদের স্কুলে (http://www.w3schools.com/css/css_background.asp) ঘুরে আছিস
শেষকথা
স্টাইল সম্পর্কে আরো জানতে কচিকাচাদের স্কুল (http://www.w3schools.com/css/css_intro.asp)
সব কালারের নাম পাবেন এইখানে (http://www.w3schools.com/cssref/css_colornames.asp)
ইচ্ছে মতো কালার করতে কালার পিকার (http://www.colorpicker.com/) থেকে কালার নাম্বার নিন
তার পরে {color:#163035;} লিখুন
অথবা R,G,B, ভ্যালু জেনে লিখুন {color:rgb(255,5,0);}
সলিড বর্ডার না দিয়ে dashed বা dotted স্টাইলও দিতে পারেন
কিচ্ছু করার নাই, তাইলে গুগলের তেলেসমাতি দেখুন ইউটুবে (http://youtu.be/EG95SVwxJnE) বা ফেইসবুকে (https://www.facebook.com/photo.php?v=10151209448421891)
প্রশ্ন থাকলে কমেন্ট করুন, শিখতে পারলে শেয়ার করুন

Lecture-2


কোর্স কনটেন্ট
পূর্ণাঙ্গ ওয়েবসাইট লেকচার ভিডিওটি দেখলে পারবেন ওয়েবসাইটের টেবিল বা লিস্ট বানাতে, এক পেইজ থেকে অন্য পেইজে যাইতে।
ওয়েবসাইটের লিস্ট দুই প্রকারের হয় তাদের unordered ও ordered লিস্ট কয়।ডট পয়েন্ট ওয়ালা লিস্টকে unordered লিস্ট বলে।সেরকম একটা লিস্ট বানাতে হলে Unordered থেকে “U” আর List থেকে “L”  পেলে <ul> </ul> ট্যাগ নিজেই বানিয়ে দেখলে এর ভিতরে একটা একটা করে লিস্ট আইটেম রাখবে, লিস্ট আইটেম কিভাবে বানাতে হয় তা এখনি জানবে।List থেকে “L” আর item  থেকে “I” নিবে, আইটেমের মধ্যে যা চাই তা <li> </li> ভিতরে লিখবে।
আর যদি নাম্বারওয়ালা লিস্ট বানাইতে চাই Ordered থেকে “O” আর list থেকে “L”  পাই, এই দুইটা দিয়ে <ol> </ol> ট্যাগ বানাই আর বাকিটা <ul> </ul> এর মত সেটা বলে যাই।

সবাই জানে ১টা টেবিলের ৪টা পা থাকে, সেই রকম  টেবিল ওয়েবসাইটে খুঁজে পাবে না রে।ওয়েবসাইটের টেবিলে পা থাকে না, উপর থেকে নিচে row ছাড়া অন্য কিছু পাবে না, row এর মধ্যে যে cell থাকে, html তাকে বলে data সেটা যদি না বোঝ, তোমার কপাল ফাটা।টেবিলের মধ্যে হাবিজাবি  যতকিছু থাকে সবকিছুই <table> </table> মাঝখানে রাখে।
টেবিলের উপর থেকে নিচে গেলে এক একটা row পাবা, table থেকে “T” নিবা, row থেকে “R” নিবা মহা আরামসে, ধীরে সুস্থে tr নামে ট্যাগ বানাবা, প্রতেক row এর সব ডাটা <tr> </tr> এর মাঝে রাখবা।
টেবিলের সব খোপগুলোকে table data নামে মান্‌ table থেকে “T”, data  থেকে “D”  নিতে হবে জানি, হাউ ফানি খোপের মধ্যে যা দেখতে চাইবো <td> </td> এর মধ্যে তাই রাখবো, টেবিল নিয়ে এত্ত পেচাপেচি ক্যান? ভাই আপনি দয়া করে ভিডিওটি দেখেন।
div টাগের উত্পত্তি division আর nav এরটা navigation div দিয়ে এরিয়া বা লেআউট হবে। nav দিয়ে এক পেইজ থেকে অন্য পেইজে যাবে যে যে পেইজে যেতে চাও <nav > </nav >এর ভিতর <a > </a > দিয়ে বানিয়ে নাও।

Lecture-1


উদ্দেশ্য :
শুধুমাত্র যারা কম্পিউটার অন অফ করতে জানেন, তাদের জন্য ৫ মিনিটে ওয়েবসাইট তৈরী করা।

প্রয়োজনীয় যন্ত্রপাতি:
একটি কম্পিউটার যেখানে নোটপ্যাড (notepad ) এবং একটা ব্রাউজার আছে। নোটপ্যাড-এ ওয়েবসাইট লেখা হয় আর ব্রাউজার দিয়ে তা দেখা হয়।

কাজের বিবরণ:
১- নোটপ্যাড খুলে তাতে কিছু একটা (“amar sonar bangla”) লিখে সেটাকে “bd.html” নামে  save করুন। তাতেই bd নামে একটা ওয়েবসাইট হয়ে যাবে।  (ভাই, .html হিসেবে save করে কেমনে? উত্তর: ভিডিও দেখেন)।

২- “bd.html” ফাইলটা  ডাবল ক্লিক করলে তা কোনো একটা ব্রাউজারে ওপেন হবে। আপনি যদি আরো কিছু লিখতে চান তাহলে লিখা শেষ করে ফাইলটি save করুন। তারপর ব্রাউজার রিফ্রেশ করলে আপনার নতুন লেখাগুলো দেখা যাবে।

৩- html মানে  hypertext markup language. তার মানে এইটা একটা language(ভাষা). এই ভাষায় দুনিয়ার সব ওয়েবসাইট কথা বলে এবং রূপধারণ করে । এই ভাষার বাক্যগুলোতে দুটো অংশ থাকে, এদেরকে ওপেনিং ট্যাগ এবং ক্লোজিং ট্যাগ বলে। উভয় ট্যাগ দেখতে একই রকম শুধু ক্লোজিং ট্যাগে একটা “/”বেশি থাকে। যেমন, <head> </head >

৪- আমরা যদি <h1>Bangladesh</h1> লেখি তাহলে তা সবচেয়ে বড় হেডার হয়ে যাবে। তার চেয়ে ছোট <h2> </h2> একইভাবে <h3> </h3> থেকে  <h6> </h6> পর্যন্ত।

৫- কোনো প্যারাগ্রাফ লিখতে চাইলে তা <p> </p> মাঝখানে লিখতে হবে।

৬- কোনো লেখাকে বোল্ড (মোটা) করতে চাইলে তা <b> </b> মাঝে লিখতে হবে।

৭- আপনি অন্য কোনো ওয়েবসাইট বা পেইজের সাথে সাথে লিংক করতে চান তা হলে <a href=”www.sulekha.com“>jan pakhi</a> লিখতে হবে। jan pakhi তে ক্লিক করলে www.sulekha.com ওপেন হবে। href=”" এর মধ্যে বলে দিতে হবে ক্লিক করলে কোথায় যাবে।

৮- কোনো ছবি দেখাতে চাইলে তা <img src=”chobi.jpg”></img> এর মত করে লিখতে হবে। তাতে website এ ঐ ছবি দেখা যাবে।

ফলাফল: আপনি ৫মিনিটে ওয়েবসাইট তৈরী করতে পারেন। যদি ৫ মিনিটে না পারেন তাহলে পুনরায় ভিডিও দেখে আবার চেষ্টা করুন। এভাবে চালাতে থাকুন যতক্ষণ পর্যন্ত ৫ মিনিটের কম সময়ের মধ্যে  ওয়েবসাইট তৈরী করতে না পারছেন।
 
পরবর্তি আকর্ষণ:
ওয়েবসাইটে কিভাবে এক পাতা থেকে অন্য পাতা যাওয়া আসা করা যায়। তার সাথে তালিকা, টেবিল ও আরো অনেক কিছু পাবেন সম্পূর্ণ ফ্রি।