Hapa nimekuandalia maelezo kamili, rahisi kuelewa kuhusu HTML, CSS, na JavaScript: zinamaanisha nini, zinavyofanya kazi, zilitokea lini, na faida zake.
Ni mafunzo ya msingi ambayo mtu yeyote anaweza kuelewa.
🌐 1. HTML – (HyperText Markup Language)
✔️ HTML ni nini?
HTML ndiyo lugha ya kuunda muundo wa webpage.
Inaunda vitu kama:
- Maneno (text)
- Vichwa (headings)
- Picha (images)
- Buttons
- Links
HTML haifanya webpage iwe nzuri, bali inaunda muundo tu.
📅 HTML ilianza lini?
HTML ilitengenezwa mwaka 1991 na Tim Berners-Lee (mwenye alibuni World Wide Web).
🔧 Inafanya kazi vipi?
Browser (Chrome, Firefox, Safari) husoma HTML na kuonyesha muundo wa ukurasa.
Mfano wa HTML:
<h1>Karibu</h1>
<p>Hii ni website yangu</p>
🎨 2. CSS – (Cascading Style Sheets)
✔️ CSS ni nini?
CSS ndiyo inafanya webpage ionekane nzuri.
Inasimamia:
- Rangi
- Fonts
- Layout
- Animation
- Spacing (padding/margin)
📅 CSS ilianza lini?
CSS ilianzishwa mwaka 1996 na Håkon Wium Lie.
🔧 Inafanya kazi vipi?
CSS hukamata HTML na kuiweka style.
Mfano wa CSS:
h1 {
color: blue;
text-align: center;
}
⚙️ 3. JavaScript – (JS)
✔️ JavaScript ni nini?
JavaScript ni lugha ya kuleta uhai kwenye webpage.
Inafanya webpage iwe interactive kama:
- Buttons zinazofanya action
- Form validation
- Sliders
- Menus yanayofunguka
- Games
- Apps (kama Gmail, YouTube)
📅 JavaScript ilianza lini?
JS ilitengenezwa mwaka 1995 na Brendan Eich (kwa siku 10 tu!).
🔧 Inafanya kazi vipi?
Browser hutumia JavaScript kuendesha logic na interaction.
Mfano:
alert("Karibu kwenye website!");
🌍 4. HTML + CSS + JavaScript Hufanya Kazi Pamoja Jinsi Gani?
Fikiria:
- HTML = Mifupa ya nyumba (structure)
- CSS = Rangi & Decoration ya nyumba
- JavaScript = Umeme wa nyumba (functionality)
Mfano mdogo:
<!DOCTYPE html>
<html>
<head>
<style>
h1 { color: red; }
</style>
</head>
<body>
<h1>Karibu</h1>
<button onclick="alert('Umebonyeza!')">Bonyeza</button>
</body>
</html>
🎯 Faida za HTML, CSS, na JavaScript
✔️ Faida za HTML
- Rahisi kujifunza
- Hutengeneza skeleton ya webpage
- Inafunguliwa na browsers zote
- Inafaa kwa SEO (Google hutumia HTML)
✔️ Faida za CSS
- Websites kuwa nzuri na professional
- Kuongeza animations
- Inafanya website kuwa responsive (kukaa vizuri kwa simu & computer)
✔️ Faida za JavaScript
- Webpages kuwa smart & interactive
- Hutengeneza apps kamili (Frontend + Backend)
- Inatumika kwenye frameworks kubwa:
- React
- Vue
- Angular
- Unaweza kuunda apps za simu (React Native)
🧠 Kwa kifupi (Summary)
| Lugha | Kazi Yake | Mwaka Ulioanzishwa |
|---|---|---|
| HTML | Muundo wa website | 1991 |
| CSS | Muonekano & design | 1996 |
| JavaScript | Functionality & interactivity | 1995 |