Ты каждый день открываешь десятки сайтов: вводишь адрес или жмёшь на ссылку — и через секунду перед тобой страница. Но что происходит за эту секунду? Давай заглянем за кулисы. Понимание этого пригодится тебе на всём пути в разработке.
Заказ в ресторане
Представь, что ты пришёл в ресторан. Ты не идёшь на кухню готовить сам — ты делаешь заказ официанту. Кухня готовит блюдо, и тебе его приносят. Ты получаешь результат, не зная всех деталей готовки.
С сайтом всё устроено похоже:
- Ты делаешь заказ — вводишь адрес сайта или жмёшь ссылку.
- Браузер — это официант, который передаёт твой запрос дальше.
- — это кухня. Компьютер в интернете, где хранятся файлы сайта.
Сервер «готовит» заказ — собирает нужные файлы — и отправляет их обратно браузеру. А браузер уже показывает тебе готовую страницу.
Что именно приходит от сервера
В ответ на запрос сервер присылает не одну вещь, а целый набор файлов:
- текст — слова, заголовки, абзацы;
- картинки — фото, иконки, логотипы;
- стили — описание того, как всё должно выглядеть.
Браузер берёт эти кусочки и собирает из них страницу, как из деталей конструктора.
Заметка
Всё это происходит за доли секунды. Поэтому кажется, будто страница появляется мгновенно — хотя на самом деле под капотом случился целый разговор браузера с сервером.
Мини-проверка
Как браузер «собирает» страницу из файлов, которые пришли с сервера?
Три слоя страницы
Любую веб-страницу можно мысленно разложить на три слоя:
- HTML — структура. Что и где находится: заголовок, абзац, кнопка.
- CSS — внешний вид. Цвета, шрифты, размеры.
- JavaScript — поведение. Как страница реагирует на твои действия.
Эти три слоя — основа всего веба. В следующих уроках мы разберём каждый по отдельности, чтобы ты понимал, из чего сделан любой сайт.