AXV

Internet qanday ishlaydi?

DNS, domain, hosting, front-end va back-end: sayt manzilini yozganda ekran ortida nima bo'ladi

8-sinfWeb Full-stack1-hafta · 1-dars

Bugun nimani o'rganamiz?

Internet, IP, DNS

Qurilmalar bir-birini qanday topadi

Domain va hosting

Saytning nomi va uning «binosi»

Front-end / Back-end

Ko'rinadigan va ko'rinmaydigan qism

Bugun ertalab internetdan nima uchun foydalandingiz?

YouTubeTelegramO'yinDars uchun qidiruvInstagram
Internet sizga tanish. Bugun uning ichida nima borligini ochamiz.
01

Internet va IP manzil

Millionlab qurilma bir tarmoqda

Internet: ulkan tarmoq

Internet tarmoq Telefon Noutbuk Server Server

Raqamlarda internet

0
internet foydalanuvchisi
~2 mlrd
veb-sayt
24/7
serverlar to'xtamay ishlaydi

Taxminiy, so'nggi yillardagi umumiy ko'rsatkichlar.

Ikki rol: klient va server

Klient (mijoz)

bosing

So'rov yuboradi. Sizning telefoningiz yoki kompyuteringiz, aniqrog'i brauzer: Chrome, Safari, Firefox.

Server

bosing

Doim yoqilgan, internetga ulangan kompyuter. Saytning fayllarini saqlaydi va so'rov kelganda jo'natadi.

IP manzil: qurilmaning «uy manzili»

Uy manzili Toshkent sh., Navoiy ko'chasi, 12-uy Qurilmaning manzili: IP 142 250 185 78 . . .
02

DNS: internetning «telefon kitobi»

Nom bor, ammo kompyuter raqam bilan ishlaydi

DNS nomni raqamga aylantiradi

Brauzer youtube.com DNS telefon kitobi youtube.com IP si nima? 142.250.185.78 Endi brauzer manzilni biladi

DNS bo'lmasa-chi?

DNS — internetning «telefon kitobi»: nomni raqamga aylantiradi.
  1. Siz youtube.com deb yozasiz
  2. DNS raqamli IP manzilni topadi
  3. Brauzer shu manzilga boradi

Qiziqqanlar uchun pastga ↓ (nslookup)

DNS'ni o'zimiz ko'ramiz


nslookup google.com
# Natija (taxminan):
# Name:    google.com
# Address: 142.250.185.78
# (IP har joyda har xil bo'lishi mumkin)
          
Terminal ixtiyoriy: mentor ekranda ko'rsatadi.
03

Domain va hosting

Saytning nomi va saytning «binosi»

Domen anatomiyasi

www subdomen sayt bo'limi . mysite asosiy nom siz tanlaysiz va sotib olasiz . uz yuqori daraja mamlakat yoki tur: uz, com Domen: saytning internetdagi nomi

Domen va hosting: ikkalasi ham kerak

Domen

Do'konning manzili va nomi. Odamlar sizni shu nom bilan topadi.
+

Hosting

Do'konning o'zi, binosi. Kod, rasm va ma'lumot saqlanadigan server.
Nomi bor, binosi yo'q do'kon — bo'sh manzil. Binosi bor, nomi yo'q do'konni hech kim topmaydi.

Hosting turlari uchun pastga ↓

Hosting turlari

Shared hostingVPSCloudStatic hosting: Netlify, Vercel
Hozircha nomini bilish yetarli. Keyinroq chuqur o'tamiz.
04

Sahifa brauzerga qanday keladi?

Enter bosilgandan sahifa chizilgunga qadar

So'rov yo'li

Brauzer mysite.uz 5. Sahifani chizadi DNS Server 1. mysite.uz IP si? 2. IP manzil 3. So'rov: sahifani ber 4. Javob: HTML, CSS, JS, rasm

Beshta qadam

1. So'rov: IP kerak

Brauzer DNS'dan mysite.uz ning IP manzilini so'raydi.

2. DNS javob beradi

DNS IP manzilni qaytaradi.

3. So'rov (request)

Brauzer shu IP dagi serverga so'rov (request) yuboradi.

4. Javob (response)

Server fayllarni javob (response) sifatida qaytaradi.

5. Sahifa chiziladi

Brauzer fayllarni o'qib, sahifani ekranda chizadi.

Natija ekranda

https://mysite.uz

Yuklanmoqda...

Natija ekranda

https://mysite.uz

Salom, internet!

Brauzer olingan fayllardan sahifani shunday yig'adi.

HTTP va HTTPS

HTTP

Brauzer va server o'rtasidagi «muloqot qoidalari».
VS

HTTPS

Himoyalangan variant: ma'lumot shifrlanadi. Manzil yonida qulf belgisi turadi.
Parol yoki karta kiritiladigan joyda faqat HTTPS bo'lishi kerak.
05

Front-end va Back-end

Ko'rinadigan va ko'rinmaydigan qism

Restoran o'xshatishi

Zal: front-end menyu, stol, ofitsiant mijoz hammasini ko'radi Oshxona: back-end oshpaz, ombor, hisob-kitob mijoz ko'rmaydi Buyurtma kirdi, ovqat chiqdi

Front-end va back-end

Front-endBack-end
Qayerda ishlaydiFoydalanuvchi brauzeridaServerda
VazifasiInterfeys, dizayn, interaktivlikMa'lumot saqlash, hisoblash, foydalanuvchini tekshirish
TexnologiyaHTML, CSS, JavaScriptPython (Django), ma'lumotlar bazasi

Full-stack nima? Pastga ↓

Full-stack: ikkalasini biladi

Front-end
HTML, CSS, JS
Back-end
Python, baza
Full-stack
to'liq ilova
Kursda avval front-end (HTML, CSS, JS), keyin back-end o'rganiladi.

Savol: front-end yoki back-end?

Tugma rangini kim belgilaydi?

To'g'ri: front-end, u ko'rinadigan qism.

Savol: front-end yoki back-end?

Parolni kim tekshiradi?

To'g'ri: back-end, serverda, ko'rinmaydi.

Birinchi sahifa: salom.html


<!DOCTYPE html>
<html>
  <body>
    <h1>Salom, internet!</h1>
    <p>Bu mening birinchi sahifam.</p>
  </body>
</html>
        
Struktura 2-darsda batafsil o'tiladi. Bugun faqat «ko'rish uchun».

Amaliyot 25 daqiqa

OsonDaftarga chizing: Brauzer, DNS, Server, Brauzer. Har bir o'qqa nima yuborilishini yozing.
O'rtaRolli o'yin (Brauzer, DNS, Server), so'ng F12 → Network: nechta fayl yuklandi?
QiyinSevimli saytingiz: domeni, 3 ta front-end va 3 ta back-end funksiyasi.

Tezkor nazorat

DNS nima qiladi?

To'g'ri: DNS nomni IP manzilga aylantiradi.

Tezkor nazorat

Domen va hosting farqi nima?

To'g'ri: domen manzil, hosting esa saytning «binosi».

Tezkor nazorat

HTTPS HTTP dan nimasi bilan farq qiladi?

To'g'ri: HTTPS shifrlaydi va himoya qiladi.

Xulosa

Bugun o'rgandik

Internet, IP, DNS, domain, hosting, HTTP/HTTPS, front-end va back-end

Uyga vazifa

Sevimli saytning «so'rov yo'li»ni chizib keling (20–30 daqiqa)