HTML, CSS vs. JavaScript: ဘာတွေကွာခြားသလဲ?
Web Development နယ်ပယ်ကို စတင်လေ့လာမယ်ဆိုရင် အခြေခံအကျဆုံး အုတ်မြစ် (၃) ခုဖြစ်တဲ့ HTML, CSS နဲ့ JavaScript တို့ရဲ့ အခန်းကဏ္ဍကို အရင်ဆုံး သိထားဖို့ လိုအပ်ပါတယ်။
ဒါဟာ Website တစ်ခု ဘယ်လို အလုပ်လုပ်သလဲဆိုတာကို နားလည်ဖို့အတွက် အရေးအကြီးဆုံး အပိုင်း ဖြစ်ပါတယ်။
1. HTML: အကြောင်းအရာနှင့် တည်ဆောက်ပုံ (Content & Layout)
HTML (Hypertext Markup Language) ဆိုတာ Website တစ်ခုရဲ့ အခြေခံအဆောက်အအုံ (Building Blocks) ကို ဖန်တီးပေးတဲ့ ဘာသာစကား ဖြစ်ပါတယ်။
Browser (Chrome/Safari) မှာ Website တစ်ခုကို ဘယ်လိုပြသမလဲဆိုတာကို HTML က သတ်မှတ်ပေးပါတယ်။
- ဘာတွေလုပ်နိုင်သလဲ: Website တစ်ခုရဲ့ အခြေခံ Structure ကို တည်ဆောက်နိုင်ပါတယ်။ ဥပမာ - စာသားတွေကို စာလုံးအမည်း (Bold) တင်တာ၊ ပုံတွေထည့်တာ၊ Link တွေ ချိတ်ဆက်တာမျိုးတွေကို HTML နဲ့ လုပ်ဆောင်ရတာပါ။
- ဘာကြောင့် အရင်လေ့လာသင့်သလဲ: HTML ဟာ ရိုးရှင်းပြီး ထိရောက်မှုရှိတဲ့ ဘာသာစကားတစ်ခု ဖြစ်ပါတယ်။ သူ့ကို CSS နဲ့ JavaScript တို့က ထပ်ဆင့် အားဖြည့်ပေးတာ ဖြစ်လို့ Web Developer တစ်ယောက် ဖြစ်ဖို့ဆိုရင် HTML ကို အရင်ဆုံး စတင်လေ့လာသင့်ပါတယ်။
2. CSS: အလှအပနှင့် အပြင်အဆင် (Styling and “Look & Feel”)
CSS (Cascading Style Sheets) ဆိုတာ HTML နဲ့ တည်ဆောက်ထားတဲ့ အခြေခံတွေကို ပိုမိုလှပလာအောင် ပြုလုပ်ပေးတဲ့ ဘာသာစကား ဖြစ်ပါတယ်။
Website ရဲ့ "Look and Feel" တစ်ခုလုံးကို CSS က တာဝန်ယူပါတယ်။
- ဘာတွေလုပ်နိုင်သလဲ: Website တစ်ခုလုံးကို မြင်ရုံနဲ့ ဆွဲဆောင်မှုရှိအောင် ဖန်တီးနိုင်ပါတယ်။ စာလုံးအရောင်၊ စာလုံးဒီဇိုင်း၊ နောက်ခံ (Backgrounds) နဲ့ နေရာချတာ (Layout) တွေကို စိတ်ကြိုက် ထိန်းချုပ်နိုင်သလို၊ ရိုးရှင်းတဲ့ Animation လေးတွေကိုပါ ဖန်တီးနိုင်ပါတယ်။
- Brand Aesthetics: ကိုယ့်ရဲ့ Brand နဲ့ ကိုက်ညီတဲ့ ခေတ်မီပြီး စတိုင်ကျတဲ့ Website တစ်ခု ဖြစ်ဖို့အတွက် CSS ကို အသုံးပြုရပါတယ်။
3. JavaScript: အပြန်အလှန် အလုပ်လုပ်နိုင်မှု (Interactive Elements)
JavaScript ကတော့ Website တစ်ခုကို ပိုမိုအသက်ဝင်လာအောင် လုပ်ဆောင်ပေးတဲ့ အဆင့်မြင့် Programming Language ဖြစ်ပါတယ်။ Website တစ်ခုလုံး Load ဖြစ်ပြီးသွားတဲ့နောက်မှာတောင် HTML နဲ့ CSS အစိတ်အပိုင်းတွေကို လိုအပ်သလို ပြောင်းလဲပစ်နိုင်တဲ့ စွမ်းအား ရှိပါတယ်။
- ဘာတွေလုပ်နိုင်သလဲ: Website ကို အသုံးပြုသူ (User) နဲ့ အပြန်အလှန် အလုပ်လုပ်နိုင်အောင် ဖန်တီးပေးပါတယ်။ ဥပမာ - မီနူးခလုတ်ကို နှိပ်လိုက်ရင် ဘေးကနေ မီနူးတန်းလေး ထွက်လာတာမျိုး၊ Calculator တစ်ခု တည်ဆောက်တာမျိုး၊ ဒါမှမဟုတ် စာမျက်နှာကို အောက်ကိုဆွဲချ (Scroll) လိုက်တဲ့အခါ Animation တွေ ပေါ်လာတာမျိုးတွေဟာ JavaScript ရဲ့ အလုပ်တွေပဲ ဖြစ်ပါတယ်။
- ** limitless possibilities:** Keyboard shortcuts တွေ ဖန်တီးတာကအစ၊ ရှုပ်ထွေးတဲ့ လုပ်ဆောင်ချက်တွေအထိ JavaScript နဲ့ လုပ်ဆောင်နိုင်ပါတယ်။
_______________________
Coding အကြောင်း အများကြီး မသိသေးရင်တောင် ဒီဘာသာစကား (၃) ခုရဲ့ ကွာခြားချက်ကို သိထားခြင်းအားဖြင့် Website တစ်ခု ဘယ်လို တည်ဆောက်ထားသလဲဆိုတာကို ပိုမိုနားလည်လာမှာပါ။