Пора перейти и к более конкретным знаниям, хватит воды. Правда начнем мы издалека...
Чтобы понимать как водить машину не обязательно досконально знать устройство ДВС, но знать, что он есть и принципы его работы - очень желательно. Вот и мы в этом уроке вкратце поговорим о том, как работает веб. Тот самый веб, под который мы будем разрабатывать свое мега крутое ПО.
Что такое и как работает WWW?
Пока ваш компьютер не подключен к сети (кабелем, по вай-фаю или любым другим способом) - он вещь в себе(с). Ну компьютер и компьютер, работает, косынку раскладывать можно, документы в ворде набирать.
Магия начинается, как только вы подключились к сети. Даже если это всего-лишь сеть из 2х устройств в пределах вашей квартиры. Или офисная сеть или... интернет - глобальная сеть. Ваш ПК начинает играть одну из двух ролей: сервер или клиент.
сразу оговорюсь, что информация приведенная тут ооооочень упрощена, за деталями можно (я бы сказал - нужно) обратиться к специализированной литературе по сетям, протоколам и серверам.
Клиент - тот, кто запрашивает информацию.
Сервер - тот, кто ее предоставляет.
Я не оговорился, когда написал выше, что ваш компьютер играет одну из ролей - он может выступать и как клиент, и как сервер. Когда вы что-то скачиваете или смотрите или запрашиваете в сети - вы клиент. Когда что-то скачивают с вам - вы сервер. (Ну или для тех, кто в детстве играл в сетевые игры по локальной сети - тот, кто запустил у себя игру, выбрал карту и ждет подключений других игроков - сервер, остальные клиенты)
По факту сервер это и компьютер с которого получают информацию и, если смотреть уже, программа, запущенная на этом компьютере, которая эту информацию отдает.
По типу информации, по ее предназначению и содержанию есть много типов серверов. Например, упомянутые выше - сервера компьютерных игр, файловые сервера, сервера терминального доступа, базы данных и тд и тп.
Нас же в первую очередь будут интересовать ВЕБ сервера и, соответственно, их основные клиенты - БРАУЗЕРЫ (chrome, internet explorer, safai и другие).
Главная функция ВЕБ сервера найти и отдать браузеру клиента некий контент. А точнее, набор контента, который браузер соберет воедино и отобразит вам. В большинстве случаев в результате вы увидите веб страницу с текстом, картинками, видео и тд.
Алгоритм работы примерно такой:
Пользователь: браузер, я хочу посмотреть сайт yandex.ru, покажи-ка мне его.
Браузер: так мне ввели адрес yandex.ru, мне надо получить его содержание
тут между еще куча этапов, как адрес текстовый преобразуется в ip адрес, как к этому ip адресу находится маршрут и многое что еще, все это происходит в процессе взаимодействия разных клиентов с разными серверами
Браузер: о, привет Веб-сервер, а у тебя есть страничка имя которой yandex.ru ?
Веб-сервер: да, вот вам файлик с разметкой, вот картинки для нее, а тут еще сервер приложений для нее кое-какие данные сгенерировал, забирайте
Браузер: (скачивает всю кучу данных, собирает воедино и показывает пользователю)
Какие данные отдает веб-сервер клиенту?
В первую очередь это html файлы, файлы разметки веб страницы. Код который рассказывает какая будет структура у информации, которую увидит пользователь.
Потом идут CSS файлы, файлы с описанием стилей оформления: "блок А будет на синем фоне, жирным шрифтом"
Потом, картинки, файлы jpg, png и другие
И самое интересное js файлы. Файлы скриптов. Программный код, который выполнит браузер на компьютере клиента, чтобы оживить страницу, добавить интерактивности. Например: всеми нами так любимые всплывающие окошки делает именно JavaScript. Кроме того js код на может сам обратиться к веб-серверу для получения дополнительной информации - именно это дает нам тот самый эффект подгрузки информации без перезагрузки страницы в браузере. Например, бесконечная лента комментариев, которая подгружается по мере пролистывания вниз.
Для самого начала нам пока достаточно: чтобы создать страницу, которую клиент может просмотреть в браузере - мы должны создать html файл с некоторой разметкой и положить ее на веб сервер.
Что ж. В следующем уроке попробуем ее создать.
Информация для закрепления и расширения кругозора: https://developer.mozilla.org/ru/docs/Learn/Getting_started_with_the_web/How_the_Web_works
#web #www #веб разработка
