Бид өдөр бүр Google, YouTube, Instagram, Moodle, онлайн дэлгүүр гээд олон сайтаар ордог. Гэхдээ “би вэб сайт ашиглаж чадна” гэдэг нь “вэб сайт яаж ажилладгийг ойлгодог” гэсэн үг биш.
Вебийн суурийг ойлгочихвол:
Код бичих чадвар (HTML/CSS/JS) хурдан ахина.
Алдаа гарахад “таамаглаад” биш логикоор нь хөөнө.
Ирээдүйд full-stack, cybersecurity, data analyst гэх мэт аль ч чиглэлд орсон хэрэгтэй “суурь ойлголт” болно.
Өнөөдөр бид 3 зүйлийг авч үзнэ:
Веб сайт гэж юу вэ?
Веб хуудас (website) ба Веб апп (web app) ялгаа юу вэ?
Browser, URL хоёр яг юу хийдэг вэ?
Веб сайт гэж юу вэ?
Веб сайт гэдэг нь интернетээр дамжуулан үзүүлдэг вэб хуудсуудын цуглуулга (эсвэл нэг веб апп) бөгөөд хэрэглэгчийн browser дээр ажиллаж харагддаг контент юм.
Browser (клиент): Chrome, Safari, Edge гэх мэт
Server (үйлчилгээ): Сайтын файлууд, өгөгдлийг өгдөг компьютер/үйлчилгээ
Network (интернэт): Browser ↔ Server хооронд мэдээлэл зөөдөг зам
Browser нь “үзүүлэх” тал, server нь “өгөх” тал.
Энэ ялгааг ойлговол дараа нь React, Next.js, API, database гэх мэт зүйлсийг сурахад маш амар болно.
Ихэвчлэн:
Мэдээлэл уншина (content)
Харьцангуй “статик” (өөрчлөгдөх нь бага)
Жишээ: байгууллагын танилцуулга сайт, блог, мэдээллийн нүүр хуудас
Гэхдээ “website = статик” гэж 100% ойлгож болохгүй. Орчин үеийн сайтууд бага зэрэг интерактив байдаг.
Веб апп нь browser дотор ажилладаг “програм” гэсэн үг.
Хэрэглэгч үйлдэл их хийдэг (login, upload, comment, edit, save)
Data-тэй ажиллана (database/төрөл бүрийн storage)
Жишээ: Gmail, Notion, Trello, онлайн банк, e-commerce admin panel
Энгийн дүрэм:
Хэрвээ “энэ зүйл дээр би ажил хийж байна” (хийх/засах/хадгалах/логин хийх) гэвэл ихэнхдээ web app.
Browser-ийг “интернэт үздэг програм” гэж хэлээд өнгөрөх амархан. Гэхдээ техникал талаас нь ойлгох хэрэгтэй.
Browser-ийн гол үүргүүд:
URL-ийг уншаад сервер рүү хүсэлт явуулах
Серверээс ирсэн хариуг (HTML/CSS/JS, зураг, өгөгдөл) татаж авах
HTML-ийг уншаад DOM (вэбийн мод хэлбэрийн бүтэц) үүсгэх
CSS-ийг тооцоолж layout + style хийх
JavaScript-ийг ажиллуулж интерактив болгох
Эцэст нь дэлгэц дээр “render” хийнэ
Вебийн дүрэм бол ийм:
HTML = бүтэц
CSS = харагдах байдал
JS = зан үйл (interaction, logic)
Эдгээрийг browser өөрөө нийлүүлээд л “сайт” болгож харагдуулж байгаа юм.
.webp)
URL бол “веб дээрх хаяг”. Гэхдээ зөвхөн хаяг биш — серверт ямар зүйл хүсэж байгаагаа хэлж өгч байгаа форматтай команд ч гэж ойлгож болно.
Жишээ URL авч задлая:
Үүнийг хэсэг хэсгээр нь тайлбарлавал:
https:// → Protocol
Browser сервертэй ямар дүрмээр ярьж байгааг заана.
https бол хамгаалалттай (encrypted) гэсэн үг.
tee.education → Domain
Хүмүүсийн ойлгодог нэр (энэ нь дараа нь DNS-ээр IP болж хувирна)
/blog/web-basics → Path
Сервер дээрх аль “нөөц”-ийг хүсэж байгааг заана (page, resource гэх мэт)
?level=1 → Query string / parameters
Нэмэлт тохиргоо, шүүлт, утга дамжуулахад ашиглагдана
Жишээ: ?page=2, ?sort=latest
#intro → Fragment
Энэ нь ихэнхдээ сервер рүү очихгүй.
Browser тухайн хуудсан доторх “intro” хэсэг рүү автоматаар очиход хэрэглэнэ.
5) “Нэг товшилт” хийхэд цаана нь яг юу болдог вэ?
Жишээ нь та tee.education гэж орууллаа гэж бодъё.
Browser URL-ийг уншина
DNS-ээр domain → IP олно (DNS-г дараагийн ангид дэлгэрүүлнэ)
Сервер рүү хүсэлт явуулна (request)
Сервер хариу өгнө (response)
Browser HTML/CSS/JS, зураг зэрэг файлуудыг татна
Render хийгээд дэлгэц дээр харуулна
Эндээс нэг чухал зүйл:
Веб дээр бүх зүйл “хүсэлт–хариу” (request–response) гэдэг зарчмаар явдаг.
Дараагийн нийтлэлүүдэд HTTP, статус код, API гэх мэт нь энэ үндсэн зарчмаас урган гарна.
Веб сайт гэдэг нь browser дээр харагдах контент + серверээс ирдэг нөөцүүдийн нийлбэр.
Website ба web app ялгаа нь хэрэглэгчийн үйлдэл + өгөгдөлтэй харьцах түвшин дээр илүү тод харагдана.
Browser нь URL уншаад сервер рүү хүсэлт явуулж, HTML/CSS/JS-г нийлүүлж “render” хийдэг.
Дараагийн дугаараар
#2 — Domain, Hosting, Server гэж юу вэ?
Бид “domain = хаяг, hosting = байр, server = үйлчилгээ” гэдэг зүйрлэлээр эхлээд, дараа нь техникал талаас нь (IP, request, hosting types) ярилцах болно.
