Rivalry2

Python: Веб-разработка (Flask)
2026-02-26 17:18 Diff
https://ru.hexlet.io/courses/python-flask/lessons/web-server/theory_unit
В этом уроке мы рассмотрим, для чего нужен веб-сервер, и как устроено сетевое взаимодействие.
Процессы

Единицей исполнения в операционных системах является процесс. Это некоторая абстракция внутри ОС. Любая запущенная программа — это либо один процесс, либо набор процессов. Например, в браузерах одна вкладка, как правило, — это один процесс.
Особенность процессов в том, что они изолированы друг от друга. Например, сбой в одном процессе не влечет за собой остановку работы других. Такое свойство процессов можно наблюдать в тех ситуациях, когда одна из вкладок браузера начинает тормозить и зависает. В это время можно без проблем продолжать использовать другие вкладки.
Внутри себя процесс может делиться на потоки:
Посмотреть список процессов в Linux можно командой ps aux либо top.
Подробнее о менеджменте процессов можно прочитать в книгах по операционным системам.
Понимание процессов тесно связано с сетевым взаимодействием. Взаимодействие между двумя компьютерами в сети — всегда сводится к взаимодействию двух процессов. То есть нельзя подключиться к компьютеру в целом — можно подключиться только к конкретному процессу конкретной программы.
Происходит это так: одна программа, которая хочет, чтобы к ней можно было подключаться по сети, при запуске начинает слушать сетевой сокет. Такая программа называется сервером. Другая программа к ней подключается — клиент. В случае веба, сервер — это конкретный веб-сервер, например, nginx, а клиент — это браузер.
Сетевое взаимодействие между программами двух компьютеров осуществляется с помощью одного из транспортных протоколов — например TCP, поверх которого уже работает HTTP. Для обращения к другому компьютеру нужно знать два параметра: IP-адрес и порт. «Слушать сетевой сокет» — это занять определенный порт на определенном сетевом интерфейсе и дать возможность обращаться к процессу через него. По номеру порта операционная система понимает, к какому процессу пытаются обратиться.
Благодаря DNS браузер получает IP-адрес компьютера, на котором расположен сайт указанного домена. Также существует соглашение, согласно которому веб-сервер, обслуживающий сайт по протоколу HTTP, слушает порт 80, а протокол HTTPS обслуживается на порту 443. Поэтому браузер знает порт, на котором висит веб-сервер в ожидании входящих запросов.
Но так бывает не всегда. Во время локальной разработки обычно используются другие порты, например, 3000 или 4000. Сам номер не принципиален. Главное, что он доступен для веб-сервера, и мы обращаемся через браузер именно к нему. Порт указывается через двоеточие после названия сайта, например, www.google.com:80.
Веб-сервер

Веб-сервер — специализированная программа для обслуживания сайтов. Один веб-сервер может обрабатывать практически любое число сайтов (Virtual Hosts в HTTP). Он перенаправляет входящие сетевые запросы на код сайтов, получает от них ответ и возвращает его браузеру.
Еще у веб-серверов есть большое количество вспомогательных функций. Среди них кеширование, перезапись запросов, раздача статики, reverse proxy, балансировка нагрузки и многое другое.
Веб-сервера не знают, на чем написан сайт. Все способы взаимодействия веб-сервера и сайта на любом языке стандартизированы. Благодаря этому веб-серверов существует не так много, и они могут работать с сайтами, которые написаны на чем угодно.
Первым и самым простым способом взаимодействия веб-сервера с сайтом был CGI — Common Gateway Interface. Этот стандарт сразу разрабатывался с учетом того, что сервер не должен зависеть от того, на чем написан сайт. Он основан на переменных окружения.
По сути, сайт — это исполняемый файл, который запускается веб-сервером во время обработки входящего запроса и передает в него все параметры запроса через переменные окружения. Все, что требуется от скрипта, — это вернуть HTTP-ответ в стандартный вывод (STDOUT). Общий алгоритм работы выглядит так:
Клиент запрашивает страницу сайта
Веб-сервер принимает запрос и устанавливает переменные окружения. Через них приложению передаются данные и служебная информация
Веб-сервер перенаправляет запросы через стандартный поток ввода (stdin) на вход вызываемой программы
CGI-приложение выполняет все необходимые операции и формирует результаты в виде HTML
Сформированный гипертекст возвращается веб-серверу через стандартный поток вывода (stdout). Сообщения об ошибках передаются через поток ошибок (stderr)
Веб-сервер передает результаты запроса клиенту
WSGI

У CGI-серверов был один важный недостаток — они запускали скрипты на каждый запрос, значит, каждый раз запускался интерпретатор. В ответ CGI в Python-комьюнити предложили новый стандарт, описанный в PEP3333 — WSGI (Web Server Gateway Interface).
Основная идея WSGI — простое взаимодействие Python-приложения и веб-сервера. Согласно стандарту, веб-приложение — это просто функция или другой callable объект, которая принимает два аргумента
Словарь переменных окружения
Функцию, которая устанавливает параметры ответа, а возвращает iterable в качестве ответа
Минимальное WSGI-приложение, то есть приложение, которое поддерживает стандарт WSGI, выглядит примерно так:
WSGI-сервер внутри себя вызовет функцию app и с помощью механизма замыканий передаст в нее необходимые аргументы. Все, что касается конкретного запроса, приходит в аргументе environ. Функция start_response() устанавливает параметры ответа. В приведенном примере — размер ответа и тип содержимого. Затем функция просто возвращает итератор, который построчно отдает ответ.
Все современные веб-фреймворки в Python поддерживают стандарт WSGI, то есть предоставляют на верхнем уровне этот callable объект — app во Flask, wsgi модуль в Django. А все WSGI-серверы умеют с этим объектом работать. Некоторые веб-серверы, как nginx, не поддерживают стандарт, но все равно умеют общаться с WSGI совместимыми (gunicorn, uWSGI). Поэтому мы часто будем встречать классическую связку как nginx-gunicorn-Django.
Реализации

Веб-серверов довольно много. Самым популярным и эффективным решением на текущий момент является nginx. Именно с ним и стоит познакомиться. Для разработки он не понадобится, но в продакшен-среде без него нельзя.
Также набирает популярность веб-сервер Caddy, который хоть и не такой быстрый, но обладает рядом важных особенностей. Он значительно проще в настройке, из коробки умеет генерировать сертификаты и многое другое.
Еще в Python самым популярным решением для WSGI-сервера остается gunicorn. Хоть gunicorn и является полноценным веб-сервером, его чаще используют в связке с nginx или Caddy. Так он отдает все сложности по кешированию, балансировке, раздаче статики, сертификатам и многое другое на их плечи.
<!DOCTYPE html>
<html class="h-100" data-bs-theme="light" data-mantine-color-scheme="light" lang="ru" prefix="og: https://ogp.me/ns#">
<head>
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<link crossorigin="true" href="https://cdn.hexlet.io" rel="preconnect">
<link href="https://mc.yandex.ru" rel="preconnect">
<meta content="aa2vrdtq64dub8knuf83lwywit311w" name="facebook-domain-verification">
<link href="/favicon.ico" rel="icon" sizes="any">
<link href="/favicon.svg" rel="icon" type="image/svg+xml">
<link href="/apple-touch-icon.png" rel="apple-touch-icon">
<link href="/manifest.webmanifest" rel="manifest">

<script>
//<![CDATA[
window.gon={};gon.ym_counter="25559621";gon.is_bot=true;gon.applications={};gon.current_user={"id":null,"last_viewed_notification_id":null,"email":null,"state":null,"first_name":"","last_name":"","created_at":"2026-02-26 17:18:32 UTC","current_program":null,"current_team":null,"full_name":"","guest":true,"can_use_paid_features":false,"is_hexlet_employee":false,"sanitized_phone_number":"","can_subscribe":true,"can_renew_education":false};gon.token="rPvdO5fx3IzMyySMyfAoauTyg2vVkjr1vXzZwr7VUyxDKhYMZY9x7HqIABTF_9gdJPuuwd2lxFcAnEOW7NK0Qg";gon.locale="ru";gon.language="ru";gon.theme="light";gon.rails_env="production";gon.mobile=false;gon.google={"analytics_key":"UA-1360700-51","optimize_key":"GTM-5QDVFPF"};gon.captcha={"google_v3_site_key":"6LenGbgZAAAAAM7HbrDbn5JlizCSzPcS767c9vaY","yandex_site_key":"ysc1_Vyob5ZPPUdPBsu0ykt8bVFdzsfpoVjQChLGl2b4g19647a89","verification_failed":null};gon.social_signin=false;gon.typoreporter_google_form_id="1FAIpQLSeibfGq-KvWQ2Fyru-zkFFRVTLBuzXAHAoEyN1p49FtDmNoNA";
//]]>
</script>
<meta charset="utf-8">
<title>Веб-сервер | Python: Веб-разработка (Flask)</title>
<meta name="description" content="Веб-сервер / Python: Веб-разработка (Flask): Разберемся, зачем нужен веб-сервер, и как устроено сетевое взаимодействие">
<link rel="canonical" href="https://ru.hexlet.io/courses/python-flask/lessons/web-server/theory_unit">
<meta name="robots" content="noarchive">
<meta property="og:title" content="Веб-сервер">
<meta property="og:title" content="Python: Веб-разработка (Flask)">
<meta property="og:description" content="Веб-сервер / Python: Веб-разработка (Flask): Разберемся, зачем нужен веб-сервер, и как устроено сетевое взаимодействие">
<meta property="og:url" content="https://ru.hexlet.io/courses/python-flask/lessons/web-server/theory_unit">
<meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="zDzcTEq0xlZvJdbeTAMpdXwbop8pEVQMf744bXqbwg8j7Rd7uMprNtlm8kZADNkCvBKPNSEmqq7CXqI5KJwlYQ" />



<script src="/vite/assets/inertia-INZxX8jp.js" crossorigin="anonymous" type="module"></script><link rel="modulepreload" href="/vite/assets/chunk-DsPFFUou.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/preload-helper-BJ4cLWpC.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/init-nkZBEvfU.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/ahoy-DrlRQ-1D.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/analytics-6pOtQ3OW.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/ErrorFallbackBlock-naDSYSy9.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Surface-DL2bpZA-.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/gon-D3e4yh1x.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/mantine-CGMYrt2Y.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/utils-DRqSHbQE.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/routes-CCH8ilKF.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/extends-C-EagtpE.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/inheritsLoose-BBd-DCVI.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/objectWithoutPropertiesLoose-DRHXDhjp.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/index.esm-DAqKOkZ0.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Button-CGPUux8l.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/CloseButton-D1euiPao.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Group-BX48WcuU.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Loader-BQEY8g6v.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Modal-Cy3HByv7.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/OptionalPortal-1Hza5P2w.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Stack-CtjJzfw4.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Textarea-Ck64llAy.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Box-B5-OOzBf.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/DirectionProvider-Dc9zdUke.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/events-DJQOhap0.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/use-reduced-motion-D2owz4wa.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/use-disclosure-zKtK5W1r.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/use-hotkeys-Cnc_Rwkb.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/random-id-DOQyszCZ.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/notifications.store-C-3AFSMn.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/exports-C_MrNx_T.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/axios-BEvgo0ym.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/dayjs.min-BkKovM-s.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/i18next-BlSq9s7B.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/client-U9M77rxp.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/react-dom-DaLxUz_h.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/useTranslation-Bx1Cdrkz.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/compiler-runtime-6XxiPFnt.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/jsx-runtime-CwjcCKJi.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/react-CkL4ZRHB.js" as="script" crossorigin="anonymous">
<link rel="stylesheet" href="/vite/assets/application-BqhCP46M.js" />
<script src="/vite/assets/application-Df9RExpe.js" crossorigin="anonymous" type="module"></script><link rel="modulepreload" href="/vite/assets/chunk-DsPFFUou.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/autocomplete-VMNbxKGl.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/routes-CCH8ilKF.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/createPopper-C3aM9r1M.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/js.cookie-D1-O8zkX.js" as="script" crossorigin="anonymous"><link rel="stylesheet" href="/vite/assets/application-C8HjmMaq.css" media="screen" />
<script>
  window.ym = function(){(ym.a=ym.a||[]).push(arguments)};
  window.addEventListener('load', function() {
    setTimeout(function() {
      ym.l = 1*new Date();
      ym(window.gon.ym_counter, "init", {
        clickmap: true,
        trackLinks: true,
        accurateTrackBounce: true,
        webvisor: true
      });
  
      // Загружаем скрипт
      var k = document.createElement('script');
      k.async = 1;
      k.src = 'https://mc.yandex.ru/metrika/tag.js';
      document.head.appendChild(k);
  
      ym(window.gon.ym_counter, 'getClientID', function(clientID) {
        window.ymClientId = clientID;
      });
    }, 1500);
  });
</script>

<!-- Google Tag Manager - deferred -->
<script>
  // dataLayer stub сразу — пуши работают до загрузки скрипта
  window.dataLayer = window.dataLayer || [];
  
  // Сам скрипт — отложенно после load
  window.addEventListener('load', function() {
    setTimeout(function() {
      dataLayer.push({'gtm.start': new Date().getTime(), event: 'gtm.js'});
      var j = document.createElement('script');
      j.async = true;
      j.src = 'https://www.googletagmanager.com/gtm.js?id=GTM-WK88TH';
      document.head.appendChild(j);
    }, 1500);
  });
</script>
<!-- End Google Tag Manager -->




</head>
<body>
<noscript>
<div>
<img alt="" src="https://mc.yandex.ru/watch/25559621" style="position:absolute; left:-9999px;">
</div>
</noscript>


<header class="sticky-top bg-body">
<nav class="navbar navbar-expand-lg">
<div class="container-xxl">
<a class="navbar-brand" href="/"><img alt="Логотип Хекслета" height="24" src="https://ru.hexlet.io/vite/assets/logo_ru_light-BpiEA1LT.svg" width="96">
</a><button aria-controls="collapsable" aria-expanded="false" aria-label="Меню" class="navbar-toggler border-0 mb-0 mt-1" data-bs-target="#collapsable" data-bs-toggle="collapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="collapsable">
<ul class="navbar-nav mb-lg-0 mt-lg-1">
<li class="nav-item dropdown">
<button aria-haspopup class="btn nav-link" data-bs-toggle="dropdown" type="button">
Все курсы
<span class="bi bi-chevron-down align-middle ms-1"></span>
</button>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item d-flex py-2" href="/courses"><div class="fw-bold me-auto">Все что есть</div>
<div class="text-muted">117</div>
</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li class="dropdown-item">
<b>Популярные категории</b>
</li>
<li>
<a class="dropdown-item py-2" href="/courses_devops">Курсы по DevOps
</a></li>
<li>
<a class="dropdown-item py-2" href="/courses_data_analytics">Курсы по аналитике данных
</a></li>
<li>
<a class="dropdown-item py-2" href="/courses_programming">Курсы по программированию
</a></li>
<li>
<a class="dropdown-item py-2" href="/courses_testing">Курсы по тестированию
</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li class="dropdown-item">
<b>Популярные курсы</b>
</li>
<li>
<a class="dropdown-item py-2" href="/programs/devops-engineer-from-scratch">DevOps-инженер с нуля
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/go">Go-разработчик
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/java">Java-разработчик
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/python">Python-разработчик 
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/qa-auto-engineer-java">Автоматизатор тестирования на Java
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/data-analytics">Аналитик данных
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/frontend">Фронтенд-разработчик
</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<button aria-haspopup class="btn nav-link" data-bs-toggle="dropdown" type="button">
О Хекслете
<span class="bi bi-chevron-down align-middle"></span>
</button>
<ul class="dropdown-menu bg-body">
<li>
<a class="dropdown-item py-2" href="/pages/about">О нас
</a></li>
<li>
<a class="dropdown-item py-2" href="/blog">Блог
</a></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://special.hexlet.io/hse-research" role="button">Результаты (Исследование)
</span></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://career.hexlet.io" role="button">Хекслет Карьера
</span></li>
<li>
<a class="dropdown-item py-2" href="/testimonials">Отзывы студентов
</a></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://t.me/hexlet_help_bot" role="button">Поддержка (В ТГ)
</span></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://special.hexlet.io/referal-program/?promo_creative=priglasite-druzei&amp;promo_name=referal-program&amp;promo_position=promo_position&amp;promo_start=010724&amp;promo_type=link" role="button">Реферальная программа
</span></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://special.hexlet.io/certificate" role="button">Подарочные сертификаты
</span></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://hh.ru/employer/4307094" role="button">Вакансии
</span></li>
<li>
<span class="dropdown-item d-flex external-link" rel="noopener noreferrer nofollow" data-href="https://b2b.hexlet.io" data-target="_blank" role="button">Компаниям
</span></li>
<li>
<span class="dropdown-item d-flex external-link" rel="noopener noreferrer nofollow" data-href="https://hexly.ru/" data-target="_blank" role="button">Колледж
</span></li>
<li>
<span class="dropdown-item d-flex external-link" rel="noopener noreferrer nofollow" data-href="https://hexlyschool.ru/" data-target="_blank" role="button">Частная школа
</span></li>
</ul>
</li>
<li><a class="nav-link" href="/subscription/new">Подписка</a></li>
</ul>
<ul class="navbar-nav flex-lg-row align-items-lg-center gap-2 ms-auto">
<li>
<a class="nav-link" aria-label="Переключить тему" href="/theme/switch?new_theme=dark"><span aria-hidden="true" class="bi bi-moon"></span>
</a></li>
<li>
<span data-target="_self" class="nav-link external-link" data-href="/u/new" role="button"><span>Регистрация</span>
</span></li>
<li>
<span data-target="_self" class="nav-link external-link" data-href="https://ru.hexlet.io/session/new" role="button"><span>Вход</span>
</span></li>
</ul>
</div>
</div>
</nav>
</header>
<div class="x-container-xxxl">

</div>

<main class="mb-6 min-vh-100 h-100">
<link rel="preload" as="image" href="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzczMSwicHVyIjoiYmxvYl9pZCJ9fQ==--f5df4883f3f678321cb4fa96e9ce657bd5ee1adf/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Static%20website-cuate.png"/><link rel="preload" as="image" href="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzY3NywicHVyIjoiYmxvYl9pZCJ9fQ==--745022c2f47ba4203dd11cd8922cd55d5bebfdca/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Code%20typing-rafiki.png"/><link rel="preload" as="image" href="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6Mzk2NSwicHVyIjoiYmxvYl9pZCJ9fQ==--84278a1852c9c6fb13b80a69f395bac6e47a422e/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Cloud%20sync-bro.png"/><link rel="preload" as="image" href="/vite/assets/development-BVihs_d5.png"/><div id="app" data-page="{&quot;component&quot;:&quot;web/courses/lessons/theory_unit&quot;,&quot;props&quot;:{&quot;errors&quot;:{},&quot;locale&quot;:&quot;ru&quot;,&quot;language&quot;:&quot;ru&quot;,&quot;httpsHost&quot;:&quot;https://ru.hexlet.io&quot;,&quot;host&quot;:&quot;ru.hexlet.io&quot;,&quot;colorScheme&quot;:&quot;light&quot;,&quot;auth&quot;:{&quot;user&quot;:{&quot;id&quot;:null,&quot;last_viewed_notification_id&quot;:null,&quot;email&quot;:null,&quot;state&quot;:null,&quot;first_name&quot;:&quot;&quot;,&quot;last_name&quot;:&quot;&quot;,&quot;created_at&quot;:&quot;2026-02-26T17:18:32.641Z&quot;,&quot;current_program&quot;:null,&quot;current_team&quot;:null,&quot;full_name&quot;:&quot;&quot;,&quot;guest&quot;:true,&quot;can_use_paid_features&quot;:false,&quot;is_hexlet_employee&quot;:false,&quot;sanitized_phone_number&quot;:&quot;&quot;,&quot;can_subscribe&quot;:true,&quot;can_renew_education&quot;:false}},&quot;cloudflareTurnstileSiteKey&quot;:&quot;0x4AAAAAAA15KmeFXzd2H0Xo&quot;,&quot;vkIdClientId&quot;:&quot;51586979&quot;,&quot;yandexIdClientId&quot;:&quot;88d071f1d3384eb4bd1deb37910235c7&quot;,&quot;formAuthToken&quot;:&quot;Ju_LoP_1WccR-RiNhH2cD3_2GMhHJKl4V1o6ihHdjczJPgCXDYv0p6e6PBWIcmx4v_81Yk8TV9rquqDeQ9pqog&quot;,&quot;topics&quot;:[{&quot;id&quot;:76671,&quot;title&quot;:&quot;Для тех кто хочет запустить под windows - не работает\nиспользуйте docker, wsl или виртуалку ну или много-много гугла и stackoverflow:), я потратил час разбираясь как запустить в windows, вроде даже нашел, но не до конца, вроде можно, но где то мне знаний не хватает, оставлю на потом.\n&quot;,&quot;plain_title&quot;:&quot;Для тех кто хочет запустить под windows - не работает используйте docker, wsl или виртуалку ну или много-много гугла и stackoverflow:), я потратил час разбираясь как запустить в windows, вроде даже нашел, но не до конца, вроде можно, но где то мне знаний не хватает, оставлю на потом. &quot;,&quot;creator&quot;:{&quot;public_name&quot;:&quot;Дмитрий Иванов&quot;,&quot;id&quot;:509779,&quot;is_tutor&quot;:false},&quot;comments&quot;:[{&quot;creator&quot;:{&quot;public_name&quot;:&quot;Ivan Mamtsev&quot;,&quot;id&quot;:294764,&quot;is_tutor&quot;:true},&quot;id&quot;:159502,&quot;body&quot;:&quot;Добрый день, мы советуем разрабатывать и проходить обучение на *nix-системах (как убунта или макОС) или ставить WSL.&quot;,&quot;topic_id&quot;:76671}],&quot;communitable&quot;:{&quot;parent_entity_name&quot;:null,&quot;parent_entity_url&quot;:null,&quot;entity_name&quot;:&quot;Веб-сервер&quot;,&quot;entity_url&quot;:null,&quot;active&quot;:true}},{&quot;id&quot;:80079,&quot;title&quot;:&quot;Сервер gunicorn я запустил. Вопрос: как его теперь остановить правильно?&quot;,&quot;plain_title&quot;:&quot;Сервер gunicorn я запустил. Вопрос: как его теперь остановить правильно? &quot;,&quot;creator&quot;:{&quot;public_name&quot;:&quot;Алексей Шепелев&quot;,&quot;id&quot;:442234,&quot;is_tutor&quot;:false},&quot;comments&quot;:[{&quot;creator&quot;:{&quot;public_name&quot;:&quot;Алексей Шепелев&quot;,&quot;id&quot;:442234,&quot;is_tutor&quot;:false},&quot;id&quot;:164561,&quot;body&quot;:&quot;Спасибо. Перепробывал кучу комбинаций клавиш, а про \&quot;скопировать\&quot; ;) забыл. Пришлось рубануть через pkill -f gunicorn&quot;,&quot;topic_id&quot;:80079},{&quot;creator&quot;:{&quot;public_name&quot;:&quot;Ivan Mamtsev&quot;,&quot;id&quot;:294764,&quot;is_tutor&quot;:true},&quot;id&quot;:164507,&quot;body&quot;:&quot;Ctrl-C  =)&quot;,&quot;topic_id&quot;:80079}],&quot;communitable&quot;:{&quot;parent_entity_name&quot;:null,&quot;parent_entity_url&quot;:null,&quot;entity_name&quot;:&quot;Веб-сервер&quot;,&quot;entity_url&quot;:null,&quot;active&quot;:true}},{&quot;id&quot;:86103,&quot;title&quot;:&quot;веб-приложение — это просто функция или другой callable объект, которая принимает два аргумента:\n- Словарь переменных окружения\n- Функцию, которая устанавливает параметры ответа, а возвращает iterable в качестве ответа\n\nНо ведь в примере аргумент *start_response* (функция, устанавливающая параметры ответа) функции *app* не возвращает ничего (вернее, он может возвращать, но, во всяком случае, мы не присваиваем никакой переменной возвращаемое значение), мы просто вызываем эту функцию.\n\nИ еще, будет ли подробнее разобран механизм работы этого процесса? Т.е. как именно устанавливаются параметры ответа, зачем аргумент *environ*, если он никак не используется и т.д... \nИли этот курс только для поверхностного ознакомления?\n\nЗаранее спасибо за потраченное время&quot;,&quot;plain_title&quot;:&quot;веб-приложение — это просто функция или другой callable объект, которая принимает два аргумента: - Словарь переменных окружения - Функцию, которая устанавливает параметры ответа, а возвращает iterable в качестве ответа Но ведь в примере аргумент start_response (функция, устанавливающая параметры ответа) функции app не возвращает ничего (вернее, он может возвращать, но, во всяком случае, мы не присваиваем никакой переменной возвращаемое значение), мы просто вызываем эту функцию. И еще, будет ли подробнее разобран механизм работы этого процесса? Т.е. как именно устанавливаются параметры ответа, зачем аргумент environ, если он никак не используется и т.д...  Или этот курс только для поверхностного ознакомления? Заранее спасибо за потраченное время &quot;,&quot;creator&quot;:{&quot;public_name&quot;:&quot;Di&quot;,&quot;id&quot;:451900,&quot;is_tutor&quot;:false},&quot;comments&quot;:[{&quot;creator&quot;:{&quot;public_name&quot;:&quot;Ivan Mamtsev&quot;,&quot;id&quot;:294764,&quot;is_tutor&quot;:true},&quot;id&quot;:173494,&quot;body&quot;:&quot;Добрый день, подробнее вы можете прочитать по ссылке на PEP в тексте урока. В целом все что вам нужно представлять пока то, что веб-сервер это некая функция (пусть и большая и сложная) которая принимает запрос и возвращает ответ.&quot;,&quot;topic_id&quot;:86103}],&quot;communitable&quot;:{&quot;parent_entity_name&quot;:null,&quot;parent_entity_url&quot;:null,&quot;entity_name&quot;:&quot;Веб-сервер&quot;,&quot;entity_url&quot;:null,&quot;active&quot;:true}},{&quot;id&quot;:91091,&quot;title&quot;:&quot;Подсказка для тех кто использует Windows:\n\n*модуля fсntl нет, поэтому надо устанавливать Linux или же вот статья: https://guides.hexlet.io/ru/ubuntu-linux-in-windows/\n\n*проходите всё по пунктам и будет вам счастье\n\nА у меня такой вопрос, почему при переходе по сыылке открывается  2 окна? \n* первое работет (Hello, world)\n* второе выдает ошибку \n\n&quot;,&quot;plain_title&quot;:&quot;Подсказка для тех кто использует Windows: *модуля fсntl нет, поэтому надо устанавливать Linux или же вот статья: https://guides.hexlet.io/ru/ubuntu-linux-in-windows/ *проходите всё по пунктам и будет вам счастье А у меня такой вопрос, почему при переходе по сыылке открывается  2 окна?  * первое работет (Hello, world) * второе выдает ошибку  &quot;,&quot;creator&quot;:{&quot;public_name&quot;:&quot;Baobab :d&quot;,&quot;id&quot;:607567,&quot;is_tutor&quot;:false},&quot;comments&quot;:[{&quot;creator&quot;:{&quot;public_name&quot;:&quot;Ivan Mamtsev&quot;,&quot;id&quot;:294764,&quot;is_tutor&quot;:true},&quot;id&quot;:180656,&quot;body&quot;:&quot;Возможно это какая-то проблема с WSL&quot;,&quot;topic_id&quot;:91091},{&quot;creator&quot;:{&quot;public_name&quot;:&quot;Ivan Mamtsev&quot;,&quot;id&quot;:294764,&quot;is_tutor&quot;:true},&quot;id&quot;:180573,&quot;body&quot;:&quot;Подскажите, какая ошибка у вас выдается?&quot;,&quot;topic_id&quot;:91091},{&quot;creator&quot;:{&quot;public_name&quot;:&quot;Baobab :d&quot;,&quot;id&quot;:607567,&quot;is_tutor&quot;:false},&quot;id&quot;:180587,&quot;body&quot;:&quot;* почему-то не правильно выдается название хоста(без двоеточия) - http//127.0.0.1:8000\n* DNS_PROBE_FINISHED_NXDOMAIN\n\nСтранный момент, но в WLS (ubuntu), адрес нормальный (http://127.0.0.1:8000), а когда перехожу по нему из терминала то открываются 2 страницы:\n\n* http//127.0.0.1:8000 (не работет)\n* 127.0.0.1:8000 (работает)\n&quot;,&quot;topic_id&quot;:91091}],&quot;communitable&quot;:{&quot;parent_entity_name&quot;:null,&quot;parent_entity_url&quot;:null,&quot;entity_name&quot;:&quot;Веб-сервер&quot;,&quot;entity_url&quot;:null,&quot;active&quot;:true}},{&quot;id&quot;:94761,&quot;title&quot;:&quot;День добрый, вопрос по самостоятельной работе: сделал новую папку с проектом в poetry, установил окружение, добавил gunicorn в зависимости, создал файл example.py, и запустил всё это командой poetry run gunicorn -w 4 example:app (в ubuntu-on-windows) , далее в винде в браузере захожу на адрес http://127.0.0.1:8000 - бесконечная загрузка и ничего не происходит. почему так?&quot;,&quot;plain_title&quot;:&quot;День добрый, вопрос по самостоятельной работе: сделал новую папку с проектом в poetry, установил окружение, добавил gunicorn в зависимости, создал файл example.py, и запустил всё это командой poetry run gunicorn -w 4 example:app (в ubuntu-on-windows) , далее в винде в браузере захожу на адрес http://127.0.0.1:8000 - бесконечная загрузка и ничего не происходит. почему так? &quot;,&quot;creator&quot;:{&quot;public_name&quot;:&quot;Anton Kadkin&quot;,&quot;id&quot;:543185,&quot;is_tutor&quot;:false},&quot;comments&quot;:[{&quot;creator&quot;:{&quot;public_name&quot;:&quot;Elena Gromova&quot;,&quot;id&quot;:548102,&quot;is_tutor&quot;:true},&quot;id&quot;:185235,&quot;body&quot;:&quot;Добрый день!\n\nОтлично, что получилось самостоятельно разобраться)&quot;,&quot;topic_id&quot;:94761},{&quot;creator&quot;:{&quot;public_name&quot;:&quot;Anton Kadkin&quot;,&quot;id&quot;:543185,&quot;is_tutor&quot;:false},&quot;id&quot;:185220,&quot;body&quot;:&quot;разобрался. обновил все пакеты в убунту, переключил версию wsl с 1 на 2, запустил сервер заново, всё заработало, в браузере всё чётко.&quot;,&quot;topic_id&quot;:94761}],&quot;communitable&quot;:{&quot;parent_entity_name&quot;:null,&quot;parent_entity_url&quot;:null,&quot;entity_name&quot;:&quot;Веб-сервер&quot;,&quot;entity_url&quot;:null,&quot;active&quot;:true}},{&quot;id&quot;:99679,&quot;title&quot;:&quot;Мне кажется или в тексте теории опечатка?\n\n&gt; одного из транспортных протоколов — TCP. Например, поверх которого уже работает HTTP\n\nмне кажется должно быть что-то вроде\n\n&gt; одного из транспортных протоколов — например TCP, поверх которого уже работает HTTP&quot;,&quot;plain_title&quot;:&quot;Мне кажется или в тексте теории опечатка? одного из транспортных протоколов — TCP. Например, поверх которого уже работает HTTP мне кажется должно быть что-то вроде одного из транспортных протоколов — например TCP, поверх которого уже работает HTTP &quot;,&quot;creator&quot;:{&quot;public_name&quot;:&quot;Владислав Смирнов&quot;,&quot;id&quot;:656520,&quot;is_tutor&quot;:false},&quot;comments&quot;:[{&quot;creator&quot;:{&quot;public_name&quot;:&quot;Ivan Gagarinov&quot;,&quot;id&quot;:75907,&quot;is_tutor&quot;:true},&quot;id&quot;:191268,&quot;body&quot;:&quot;**Владислав Смирнов**, здравствуйте. Спасибо, поправил.&quot;,&quot;topic_id&quot;:99679}],&quot;communitable&quot;:{&quot;parent_entity_name&quot;:null,&quot;parent_entity_url&quot;:null,&quot;entity_name&quot;:&quot;Веб-сервер&quot;,&quot;entity_url&quot;:null,&quot;active&quot;:true}}],&quot;lesson&quot;:{&quot;exercise&quot;:null,&quot;units&quot;:[{&quot;id&quot;:6754,&quot;name&quot;:&quot;theory&quot;,&quot;url&quot;:&quot;/courses/python-flask/lessons/web-server/theory_unit&quot;},{&quot;id&quot;:6755,&quot;name&quot;:&quot;quiz&quot;,&quot;url&quot;:&quot;/courses/python-flask/lessons/web-server/quiz_unit&quot;}],&quot;links&quot;:[{&quot;id&quot;:425952,&quot;name&quot;:&quot;Сетевые сокеты&quot;,&quot;url&quot;:&quot;https://ru.wikipedia.org/wiki/Сокет_(программный_интерфейс)&quot;},{&quot;id&quot;:425953,&quot;name&quot;:&quot;CGI&quot;,&quot;url&quot;:&quot;https://ru.wikipedia.org/wiki/CGI&quot;},{&quot;id&quot;:425954,&quot;name&quot;:&quot;WSGI&quot;,&quot;url&quot;:&quot;https://en.wikipedia.org/wiki/Web_Server_Gateway_Interface&quot;}],&quot;ordered_units&quot;:[{&quot;id&quot;:6754,&quot;name&quot;:&quot;theory&quot;,&quot;url&quot;:&quot;/courses/python-flask/lessons/web-server/theory_unit&quot;},{&quot;id&quot;:6755,&quot;name&quot;:&quot;quiz&quot;,&quot;url&quot;:&quot;/courses/python-flask/lessons/web-server/quiz_unit&quot;}],&quot;id&quot;:2960,&quot;slug&quot;:&quot;web-server&quot;,&quot;state&quot;:&quot;approved&quot;,&quot;name&quot;:&quot;Веб-сервер&quot;,&quot;course_order&quot;:120,&quot;goal&quot;:&quot;Разберемся, зачем нужен веб-сервер, и как устроено сетевое взаимодействие&quot;,&quot;self_study&quot;:&quot;Сохраните код WSGI-приложения из урока в модуль example.py. Установите gunicorn. Всегда все устанавливайте в виртуальное окружение. Создать его можете любыми инструментами. Запустите модуль командой `gunicorn -w 4 example:app` — этой командой мы запускаем WSGI-сервер gunicorn и указываем ему путь до нашей функции-приложения. Перейдите в браузер по адресу в выводе и посмотрите на результат.\n&quot;,&quot;theory_video_provider&quot;:null,&quot;theory_video_uid&quot;:null,&quot;theory&quot;:&quot;В этом уроке мы рассмотрим, для чего нужен веб-сервер, и как устроено сетевое взаимодействие.\n\n## Процессы\n\nЕдиницей исполнения в операционных системах является процесс. Это некоторая абстракция внутри ОС. Любая запущенная программа — это либо один процесс, либо набор процессов. Например, в браузерах одна вкладка, как правило, — это один процесс.\n\nОсобенность процессов в том, что они изолированы друг от друга. Например, сбой в одном процессе не влечет за собой остановку работы других. Такое свойство процессов можно наблюдать в тех ситуациях, когда одна из вкладок браузера начинает тормозить и зависает. В это время можно без проблем продолжать использовать другие вкладки.\n\nВнутри себя процесс может делиться на потоки:\n\n![Process List](/rails/active_storage/blobs/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MTAwMTYsInB1ciI6ImJsb2JfaWQifX0=--dc3b702add19732b305a82797a830412b110af88/process-list.png)\n\nПосмотреть список процессов в Linux можно командой `ps aux` либо `top`.\n\nПодробнее о менеджменте процессов можно прочитать в [книгах](https://ru.hexlet.io/pages/recommended-books) по операционным системам.\n\nПонимание процессов тесно связано с сетевым взаимодействием. Взаимодействие между двумя компьютерами в сети — всегда сводится к взаимодействию двух процессов. То есть нельзя подключиться к компьютеру в целом — можно подключиться только к конкретному процессу конкретной программы.\n\nПроисходит это так: одна программа, которая хочет, чтобы к ней можно было подключаться по сети, при запуске начинает слушать сетевой сокет. Такая программа называется сервером. Другая программа к ней подключается — клиент. В случае веба, сервер — это конкретный веб-сервер, например, nginx, а клиент — это браузер.\n\nСетевое взаимодействие между программами двух компьютеров осуществляется с помощью одного из транспортных протоколов — например TCP, поверх которого уже работает HTTP. Для обращения к другому компьютеру нужно знать два параметра: **IP-адрес** и **порт**. «Слушать сетевой сокет» — это занять определенный порт на определенном сетевом интерфейсе и дать возможность обращаться к процессу через него. По номеру порта операционная система понимает, к какому процессу пытаются обратиться.\n\nБлагодаря DNS браузер получает IP-адрес компьютера, на котором расположен сайт указанного домена. Также существует соглашение, согласно которому веб-сервер, обслуживающий сайт по протоколу HTTP, слушает порт `80`, а протокол HTTPS обслуживается на порту `443`. Поэтому браузер знает порт, на котором висит веб-сервер в ожидании входящих запросов.\n\nНо так бывает не всегда. Во время локальной разработки обычно используются другие порты, например, `3000` или `4000`. Сам номер не принципиален. Главное, что он доступен для веб-сервера, и мы обращаемся через браузер именно к нему. Порт указывается через двоеточие после названия сайта, например, `www.google.com:80`.\n\n## Веб-сервер\n\n**Веб-сервер** — специализированная программа для обслуживания сайтов. Один веб-сервер может обрабатывать практически любое число сайтов (Virtual Hosts в HTTP). Он перенаправляет входящие сетевые запросы на код сайтов, получает от них ответ и возвращает его браузеру.\n\nЕще у веб-серверов есть большое количество вспомогательных функций. Среди них кеширование, перезапись запросов, раздача статики, reverse proxy, балансировка нагрузки и многое другое.\n\nВеб-сервера не знают, на чем написан сайт. Все способы взаимодействия веб-сервера и сайта на любом языке стандартизированы. Благодаря этому веб-серверов существует не так много, и они могут работать с сайтами, которые написаны на чем угодно.\n\nПервым и самым простым способом взаимодействия веб-сервера с сайтом был **CGI** — Common Gateway Interface. Этот стандарт сразу разрабатывался с учетом того, что сервер не должен зависеть от того, на чем написан сайт. Он основан на переменных окружения.\n\nПо сути, сайт — это исполняемый файл, который запускается веб-сервером во время обработки входящего запроса и передает в него все параметры запроса через переменные окружения. Все, что требуется от скрипта, — это вернуть HTTP-ответ в стандартный вывод (STDOUT). Общий алгоритм работы выглядит так:\n\n1. Клиент запрашивает страницу сайта\n2. Веб-сервер принимает запрос и устанавливает переменные окружения. Через них приложению передаются данные и служебная информация\n3. Веб-сервер перенаправляет запросы через стандартный поток ввода (stdin) на вход вызываемой программы\n4. CGI-приложение выполняет все необходимые операции и формирует результаты в виде HTML\n5. Сформированный гипертекст возвращается веб-серверу через стандартный поток вывода (stdout). Сообщения об ошибках передаются через поток ошибок (stderr)\n6. Веб-сервер передает результаты запроса клиенту\n\n## WSGI\n\nУ CGI-серверов был один важный недостаток — они запускали скрипты на каждый запрос, значит, каждый раз запускался интерпретатор. В ответ CGI в Python-комьюнити предложили новый стандарт, описанный в [PEP3333](https://peps.python.org/pep-3333/) — WSGI (Web Server Gateway Interface).\n\nОсновная идея WSGI — простое взаимодействие Python-приложения и веб-сервера. Согласно стандарту, веб-приложение — это просто функция или другой callable объект, которая принимает два аргумента\n\n* Словарь переменных окружения\n* Функцию, которая устанавливает параметры ответа, а возвращает iterable в качестве ответа\n\nМинимальное WSGI-приложение, то есть приложение, которое поддерживает стандарт WSGI, выглядит примерно так:\n\n```python\ndef app(environ, start_response):\n    data = b\&quot;Hello, World!\\n\&quot;\n    start_response(\n        \&quot;200 OK\&quot;, [(\&quot;Content-Type\&quot;, \&quot;text/plain\&quot;), (\&quot;Content-Length\&quot;, str(len(data)))]\n    )\n    return iter([data])\n```\n\nWSGI-сервер внутри себя вызовет функцию `app` и с помощью механизма замыканий передаст в нее необходимые аргументы. Все, что касается конкретного запроса, приходит в аргументе `environ`. Функция `start_response()` устанавливает параметры ответа. В приведенном примере — размер ответа и тип содержимого. Затем функция просто возвращает итератор, который построчно отдает ответ.\n\nВсе современные веб-фреймворки в Python поддерживают стандарт WSGI, то есть предоставляют на верхнем уровне этот callable объект — `app` во Flask, `wsgi` модуль в Django. А все WSGI-серверы умеют с этим объектом работать. Некоторые веб-серверы, как nginx, не поддерживают стандарт, но все равно умеют общаться с WSGI совместимыми (`gunicorn`, `uWSGI`). Поэтому мы часто будем встречать классическую связку как nginx-gunicorn-Django.\n\n## Реализации\n\nВеб-серверов довольно много. Самым популярным и эффективным решением на текущий момент является nginx. Именно с ним и стоит познакомиться. Для разработки он не понадобится, но в продакшен-среде без него нельзя.\n\nТакже набирает популярность веб-сервер Caddy, который хоть и не такой быстрый, но обладает рядом важных особенностей. Он значительно проще в настройке, из коробки умеет генерировать сертификаты и многое другое.\n\nЕще в Python самым популярным решением для WSGI-сервера остается gunicorn. Хоть gunicorn и является полноценным веб-сервером, его чаще используют в связке с nginx или Caddy. Так он отдает все сложности по кешированию, балансировке, раздаче статики, сертификатам и многое другое на их плечи.\n&quot;},&quot;lessonMember&quot;:null,&quot;courseMember&quot;:null,&quot;course&quot;:{&quot;start_lesson&quot;:{&quot;exercise&quot;:null,&quot;units&quot;:[{&quot;id&quot;:6811,&quot;name&quot;:&quot;theory&quot;,&quot;url&quot;:&quot;/courses/python-flask/lessons/about/theory_unit&quot;}],&quot;links&quot;:[{&quot;id&quot;:425950,&quot;name&quot;:&quot;Что такое протокол HTTPS, и как он защищает вас в интернете&quot;,&quot;url&quot;:&quot;https://guides.hexlet.io/ru/https-yandex-guide/&quot;},{&quot;id&quot;:425951,&quot;name&quot;:&quot;Как работает DNS&quot;,&quot;url&quot;:&quot;https://guides.hexlet.io/ru/dns/&quot;}],&quot;ordered_units&quot;:[{&quot;id&quot;:6811,&quot;name&quot;:&quot;theory&quot;,&quot;url&quot;:&quot;/courses/python-flask/lessons/about/theory_unit&quot;}],&quot;id&quot;:2995,&quot;slug&quot;:&quot;about&quot;,&quot;state&quot;:&quot;approved&quot;,&quot;name&quot;:&quot;О курсе&quot;,&quot;course_order&quot;:100,&quot;goal&quot;:&quot;Узнаем о курсе, его структуре, задачах и целях&quot;,&quot;self_study&quot;:null,&quot;theory_video_provider&quot;:null,&quot;theory_video_uid&quot;:null,&quot;theory&quot;:&quot;Flask — это один из популярных веб-фреймворков на Python, который помогает быстро и просто разрабатывать сайты. Его создатели придерживаются минималистского подхода, поэтому Flask предоставляет только необходимые инструменты и библиотеки для создания сайтов. Так он обеспечивает разработчикам гибкость в создании собственного набора технологий.\n\nЭтот курс подойдет тем, кто продолжает изучать Python и его применение в вебе. Здесь мы будем изучать основы веб-разработки. Вы познакомитесь с архитектурой веба и детально изучите принципы создания современных веб-приложений.\n\nВо время прохождения курса мы рассмотрим следующие темы:\n\n- Обработка запросов и формирование ответов\n- Обработка форм\n- Шаблонизатор\n- Ресурсная маршрутизация\n- CRUD и работа с сущностями\n- Архитектурный паттерн MVC\n- Работа с куками и сессиями\n- Деплой\n\nПрактика этого курса выполняется в среде Хекслета, но для полноценного погружения рекомендуем повторять все действия на своем компьютере. Для этого убедитесь, что в вашей системе установлены:\n\n- Python 3.10 (или более новая версия)\n- [uv](https://docs.astral.sh/uv/)\n\nКроме практики в нашей среде, почти каждый урок содержит самостоятельную работу. Ее нужно выполнять у себя на компьютере. Эти задания зависят друг от друга. Каждая новая самостоятельная работа базируется на том, что было сделано в предыдущих уроках.\n&quot;},&quot;id&quot;:197,&quot;slug&quot;:&quot;python-flask&quot;,&quot;challenges_count&quot;:3,&quot;name&quot;:&quot;Python: Веб-разработка (Flask)&quot;,&quot;allow_indexing&quot;:true,&quot;state&quot;:&quot;approved&quot;,&quot;course_state&quot;:&quot;finished&quot;,&quot;pricing_type&quot;:&quot;paid&quot;,&quot;description&quot;:&quot;На этом курсе вы изучите основы веб-разработки на примере микрофреймворка Flask. Вы узнаете, как обрабатывать запросы и формировать ответ, как работать с куки и сессиями, что такое CRUD и как правильно работать с сущностями. В итоге вы научитесь создавать полноценные сайты, строить архитектуру веб-приложений и доставлять их до сервера. Веб-разработка на Flask пригодится, если вы решите детально изучить принципы создания современных веб-приложений.&quot;,&quot;kind&quot;:&quot;basic&quot;,&quot;updated_at&quot;:&quot;2026-01-22T11:47:35.289Z&quot;,&quot;language&quot;:&quot;python&quot;,&quot;duration_cache&quot;:83280,&quot;skills&quot;:[&quot;Создавать полноценные сайты с помощью Python&quot;,&quot;Работать с микрофреймворком Flask&quot;,&quot;Использовать шаблонизатор Jinja2&quot;,&quot;Правильно строить архитектуру веб-приложений и разбираться в MVC&quot;,&quot;Доставлять приложение до сервера&quot;],&quot;keywords&quot;:[&quot;маршрутизация&quot;,&quot;шаблонизация&quot;,&quot;request&quot;,&quot;WSGI&quot;,&quot;методы HTTP&quot;,&quot;отладка&quot;],&quot;lessons_count&quot;:27,&quot;cover&quot;:&quot;https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MTAwMTQsInB1ciI6ImJsb2JfaWQifX0=--9c99b10db54291c4df80ff1a5d0fcbe1aaba5be0/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJwbmciLCJyZXNpemVfdG9fZmlsbCI6WzYwMCw0MDBdfSwicHVyIjoidmFyaWF0aW9uIn19--6067466c2912ca31a17eddee04b8cf2a38c6ad17/image.png&quot;},&quot;recommendedLandings&quot;:[{&quot;stack&quot;:{&quot;id&quot;:7,&quot;slug&quot;:&quot;python&quot;,&quot;title&quot;:&quot;Python-разработчик&quot;,&quot;audience&quot;:&quot;for_beginners&quot;,&quot;start_type&quot;:&quot;weekly&quot;,&quot;pricing_model&quot;:&quot;purchase&quot;,&quot;priority&quot;:&quot;high&quot;,&quot;kind&quot;:&quot;profession&quot;,&quot;state&quot;:&quot;published&quot;,&quot;stack_state&quot;:&quot;finished&quot;,&quot;order&quot;:10,&quot;duration_in_months&quot;:10},&quot;id&quot;:7,&quot;slug&quot;:&quot;python&quot;,&quot;title&quot;:&quot;Python-разработчик &quot;,&quot;subtitle&quot;:&quot;Изучите Python, Django, REST и Fast API для создания веб-приложений&quot;,&quot;subtitle_for_lists&quot;:&quot;Изучите Python, Django, REST и Fast API для создания веб-приложений&quot;,&quot;locale&quot;:&quot;ru&quot;,&quot;current&quot;:true,&quot;duration_in_months_text&quot;:&quot;10 месяцев&quot;,&quot;stack_slug&quot;:&quot;python&quot;,&quot;price_text&quot;:&quot;от 6 792 ₽&quot;,&quot;duration_text&quot;:&quot;10 месяцев&quot;,&quot;cover_list_variant&quot;:&quot;https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzczMSwicHVyIjoiYmxvYl9pZCJ9fQ==--f5df4883f3f678321cb4fa96e9ce657bd5ee1adf/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Static%20website-cuate.png&quot;},{&quot;stack&quot;:{&quot;id&quot;:131,&quot;slug&quot;:&quot;flask&quot;,&quot;title&quot;:&quot;Веб разработка на Python&quot;,&quot;audience&quot;:&quot;for_beginners&quot;,&quot;start_type&quot;:&quot;anytime&quot;,&quot;pricing_model&quot;:&quot;subscription&quot;,&quot;priority&quot;:&quot;medium&quot;,&quot;kind&quot;:&quot;track&quot;,&quot;state&quot;:&quot;published&quot;,&quot;stack_state&quot;:&quot;finished&quot;,&quot;order&quot;:1050,&quot;duration_in_months&quot;:1},&quot;id&quot;:222,&quot;slug&quot;:&quot;flask&quot;,&quot;title&quot;:&quot;Веб-разработка на Python&quot;,&quot;subtitle&quot;:&quot;Навык создания веб-приложений на Flask для разработки лёгких и гибких серверных решений&quot;,&quot;subtitle_for_lists&quot;:&quot;Навык создания веб-приложений на Flask&quot;,&quot;locale&quot;:&quot;ru&quot;,&quot;current&quot;:true,&quot;duration_in_months_text&quot;:&quot;1 месяц&quot;,&quot;stack_slug&quot;:&quot;flask&quot;,&quot;price_text&quot;:&quot;от 3 900 ₽&quot;,&quot;duration_text&quot;:&quot;1 месяц&quot;,&quot;cover_list_variant&quot;:&quot;https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzY3NywicHVyIjoiYmxvYl9pZCJ9fQ==--745022c2f47ba4203dd11cd8922cd55d5bebfdca/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Code%20typing-rafiki.png&quot;},{&quot;stack&quot;:{&quot;id&quot;:225,&quot;slug&quot;:&quot;devops-engineer-from-scratch&quot;,&quot;title&quot;:&quot;DevOps-инженер с нуля&quot;,&quot;audience&quot;:&quot;for_beginners&quot;,&quot;start_type&quot;:&quot;weekly&quot;,&quot;pricing_model&quot;:&quot;purchase&quot;,&quot;priority&quot;:&quot;high&quot;,&quot;kind&quot;:&quot;profession&quot;,&quot;state&quot;:&quot;published&quot;,&quot;stack_state&quot;:&quot;not_finished&quot;,&quot;order&quot;:50,&quot;duration_in_months&quot;:14},&quot;id&quot;:355,&quot;slug&quot;:&quot;devops-engineer-from-scratch&quot;,&quot;title&quot;:&quot;DevOps-инженер с нуля&quot;,&quot;subtitle&quot;:&quot;Полное погружение в DevOps: весь стек от Linux до Kubernetes&quot;,&quot;subtitle_for_lists&quot;:&quot;Полное погружение в DevOps: весь стек от Linux до Kubernetes&quot;,&quot;locale&quot;:&quot;ru&quot;,&quot;current&quot;:true,&quot;duration_in_months_text&quot;:&quot;14 месяцев&quot;,&quot;stack_slug&quot;:&quot;devops-engineer-from-scratch&quot;,&quot;price_text&quot;:&quot;от 6 792 ₽&quot;,&quot;duration_text&quot;:&quot;14 месяцев&quot;,&quot;cover_list_variant&quot;:&quot;https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6Mzk2NSwicHVyIjoiYmxvYl9pZCJ9fQ==--84278a1852c9c6fb13b80a69f395bac6e47a422e/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Cloud%20sync-bro.png&quot;}],&quot;lessonMemberUnit&quot;:null,&quot;accessToLearnUnitExists&quot;:false,&quot;accessToCourseExists&quot;:false},&quot;url&quot;:&quot;/courses/python-flask/lessons/web-server/theory_unit&quot;,&quot;version&quot;:&quot;0b0c6d4ebbd40fd58630a0dd89cc25544ccdf24e&quot;,&quot;encryptHistory&quot;:false,&quot;clearHistory&quot;:false}"><style data-mantine-styles="true">:root, :host{--mantine-font-family: Arial, sans-serif;--mantine-font-family-headings: Arial, sans-serif;--mantine-heading-font-weight: normal;--mantine-radius-default: 0rem;--mantine-primary-color-filled: var(--mantine-color-indigo-filled);--mantine-primary-color-filled-hover: var(--mantine-color-indigo-filled-hover);--mantine-primary-color-light: var(--mantine-color-indigo-light);--mantine-primary-color-light-hover: var(--mantine-color-indigo-light-hover);--mantine-primary-color-light-color: var(--mantine-color-indigo-light-color);--mantine-spacing-xxl: calc(4rem * var(--mantine-scale));--mantine-font-size-xs: 12px;--mantine-font-size-sm: 14px;--mantine-font-size-md: 16px;--mantine-font-size-lg: clamp(16.0000px, calc(15.2727px + 0.2273vw), 18.0000px);--mantine-font-size-xl: clamp(16.0000px, calc(14.5455px + 0.4545vw), 20.0000px);--mantine-font-size-display-3: clamp(32.0000px, calc(26.1818px + 1.8182vw), 48.0000px);--mantine-font-size-display-2: clamp(36.0000px, calc(25.8182px + 3.1818vw), 64.0000px);--mantine-font-size-display-1: clamp(40.0000px, calc(25.4545px + 4.5455vw), 80.0000px);--mantine-font-size-h1: clamp(28.0000px, calc(23.6364px + 1.3636vw), 40.0000px);--mantine-font-size-h2: clamp(24.0000px, calc(21.0909px + 0.9091vw), 32.0000px);--mantine-font-size-h3: clamp(20.0000px, calc(17.0909px + 0.9091vw), 28.0000px);--mantine-font-size-h4: clamp(16.0000px, calc(13.0909px + 0.9091vw), 24.0000px);--mantine-font-size-h5: clamp(16.0000px, calc(14.5455px + 0.4545vw), 20.0000px);--mantine-font-size-h6: 1rem;--mantine-primary-color-0: var(--mantine-color-indigo-0);--mantine-primary-color-1: var(--mantine-color-indigo-1);--mantine-primary-color-2: var(--mantine-color-indigo-2);--mantine-primary-color-3: var(--mantine-color-indigo-3);--mantine-primary-color-4: var(--mantine-color-indigo-4);--mantine-primary-color-5: var(--mantine-color-indigo-5);--mantine-primary-color-6: var(--mantine-color-indigo-6);--mantine-primary-color-7: var(--mantine-color-indigo-7);--mantine-primary-color-8: var(--mantine-color-indigo-8);--mantine-primary-color-9: var(--mantine-color-indigo-9);--mantine-color-red-0: #ffeaea;--mantine-color-red-1: #fed4d4;--mantine-color-red-2: #f4a7a8;--mantine-color-red-3: #ec7878;--mantine-color-red-4: #e55050;--mantine-color-red-5: #e03131;--mantine-color-red-6: #e02829;--mantine-color-red-7: #c71a1c;--mantine-color-red-8: #b21218;--mantine-color-red-9: #9c0411;--mantine-color-violet-0: #fce9ff;--mantine-color-violet-1: #f1cfff;--mantine-color-violet-2: #e09bff;--mantine-color-violet-3: #d16fff;--mantine-color-violet-4: #be37fe;--mantine-color-violet-5: #b51afe;--mantine-color-violet-6: #b009ff;--mantine-color-violet-7: #9b00e4;--mantine-color-violet-8: #8a00cc;--mantine-color-violet-9: #7800b3;--mantine-color-indigo-0: #edecff;--mantine-color-indigo-1: #d6d5fe;--mantine-color-indigo-2: #aaa9f4;--mantine-color-indigo-3: #7b79eb;--mantine-color-indigo-4: #5451e4;--mantine-color-indigo-5: #3b37e0;--mantine-color-indigo-6: #2d2adf;--mantine-color-indigo-7: #1f1ec7;--mantine-color-indigo-8: #1819b2;--mantine-color-indigo-9: #0c149e;--mantine-color-cyan-0: #dffdff;--mantine-color-cyan-1: #caf5ff;--mantine-color-cyan-2: #99e8ff;--mantine-color-cyan-3: #64daff;--mantine-color-cyan-4: #3ccffe;--mantine-color-cyan-5: #24c8fe;--mantine-color-cyan-6: #00c2ff;--mantine-color-cyan-7: #00ade4;--mantine-color-cyan-8: #009acd;--mantine-color-cyan-9: #0085b5;--mantine-color-green-0: #e9fdec;--mantine-color-green-1: #d7f6dc;--mantine-color-green-2: #b0eab9;--mantine-color-green-3: #86df94;--mantine-color-green-4: #62d574;--mantine-color-green-5: #4ccf5f;--mantine-color-green-6: #3fcc54;--mantine-color-green-7: #2fb344;--mantine-color-green-8: #25a03b;--mantine-color-green-9: #138a2e;--mantine-color-yellow-0: #fff7e2;--mantine-color-yellow-1: #ffeecd;--mantine-color-yellow-2: #ffdc9c;--mantine-color-yellow-3: #ffc966;--mantine-color-yellow-4: #feb93a;--mantine-color-yellow-5: #feae1e;--mantine-color-yellow-6: #ffa90f;--mantine-color-yellow-8: #ca8200;--mantine-color-yellow-9: #af7000;--mantine-h1-font-size: clamp(28.0000px, calc(23.6364px + 1.3636vw), 40.0000px);--mantine-h1-font-weight: normal;--mantine-h2-font-size: clamp(24.0000px, calc(21.0909px + 0.9091vw), 32.0000px);--mantine-h2-font-weight: normal;--mantine-h3-font-size: clamp(20.0000px, calc(17.0909px + 0.9091vw), 28.0000px);--mantine-h3-font-weight: normal;--mantine-h4-font-size: clamp(16.0000px, calc(13.0909px + 0.9091vw), 24.0000px);--mantine-h4-font-weight: normal;--mantine-h5-font-size: clamp(16.0000px, calc(14.5455px + 0.4545vw), 20.0000px);--mantine-h5-font-weight: normal;--mantine-h6-font-size: 1rem;--mantine-h6-font-weight: normal;}

:root[data-mantine-color-scheme="dark"], :host([data-mantine-color-scheme="dark"]){--mantine-color-anchor: var(--mantine-color-text);--mantine-color-dimmed: #495057;--mantine-color-dark-filled: var(--mantine-color-dark-5);--mantine-color-dark-filled-hover: var(--mantine-color-dark-6);--mantine-color-dark-light: rgba(105, 105, 105, 0.15);--mantine-color-dark-light-hover: rgba(105, 105, 105, 0.2);--mantine-color-dark-light-color: var(--mantine-color-dark-0);--mantine-color-dark-outline: var(--mantine-color-dark-1);--mantine-color-dark-outline-hover: rgba(184, 184, 184, 0.05);--mantine-color-gray-filled: var(--mantine-color-gray-5);--mantine-color-gray-filled-hover: var(--mantine-color-gray-6);--mantine-color-gray-light: rgba(222, 226, 230, 0.15);--mantine-color-gray-light-hover: rgba(222, 226, 230, 0.2);--mantine-color-gray-light-color: var(--mantine-color-gray-0);--mantine-color-gray-outline: var(--mantine-color-gray-1);--mantine-color-gray-outline-hover: rgba(241, 243, 245, 0.05);--mantine-color-red-filled: var(--mantine-color-red-5);--mantine-color-red-filled-hover: var(--mantine-color-red-6);--mantine-color-red-light: rgba(236, 120, 120, 0.15);--mantine-color-red-light-hover: rgba(236, 120, 120, 0.2);--mantine-color-red-light-color: var(--mantine-color-red-0);--mantine-color-red-outline: var(--mantine-color-red-1);--mantine-color-red-outline-hover: rgba(254, 212, 212, 0.05);--mantine-color-pink-filled: var(--mantine-color-pink-5);--mantine-color-pink-filled-hover: var(--mantine-color-pink-6);--mantine-color-pink-light: rgba(250, 162, 193, 0.15);--mantine-color-pink-light-hover: rgba(250, 162, 193, 0.2);--mantine-color-pink-light-color: var(--mantine-color-pink-0);--mantine-color-pink-outline: var(--mantine-color-pink-1);--mantine-color-pink-outline-hover: rgba(255, 222, 235, 0.05);--mantine-color-grape-filled: var(--mantine-color-grape-5);--mantine-color-grape-filled-hover: var(--mantine-color-grape-6);--mantine-color-grape-light: rgba(229, 153, 247, 0.15);--mantine-color-grape-light-hover: rgba(229, 153, 247, 0.2);--mantine-color-grape-light-color: var(--mantine-color-grape-0);--mantine-color-grape-outline: var(--mantine-color-grape-1);--mantine-color-grape-outline-hover: rgba(243, 217, 250, 0.05);--mantine-color-violet-filled: var(--mantine-color-violet-5);--mantine-color-violet-filled-hover: var(--mantine-color-violet-6);--mantine-color-violet-light: rgba(209, 111, 255, 0.15);--mantine-color-violet-light-hover: rgba(209, 111, 255, 0.2);--mantine-color-violet-light-color: var(--mantine-color-violet-0);--mantine-color-violet-outline: var(--mantine-color-violet-1);--mantine-color-violet-outline-hover: rgba(241, 207, 255, 0.05);--mantine-color-indigo-filled: var(--mantine-color-indigo-5);--mantine-color-indigo-filled-hover: var(--mantine-color-indigo-6);--mantine-color-indigo-light: rgba(123, 121, 235, 0.15);--mantine-color-indigo-light-hover: rgba(123, 121, 235, 0.2);--mantine-color-indigo-light-color: var(--mantine-color-indigo-0);--mantine-color-indigo-outline: var(--mantine-color-indigo-1);--mantine-color-indigo-outline-hover: rgba(214, 213, 254, 0.05);--mantine-color-blue-filled: var(--mantine-color-blue-5);--mantine-color-blue-filled-hover: var(--mantine-color-blue-6);--mantine-color-blue-light: rgba(116, 192, 252, 0.15);--mantine-color-blue-light-hover: rgba(116, 192, 252, 0.2);--mantine-color-blue-light-color: var(--mantine-color-blue-0);--mantine-color-blue-outline: var(--mantine-color-blue-1);--mantine-color-blue-outline-hover: rgba(208, 235, 255, 0.05);--mantine-color-cyan-filled: var(--mantine-color-cyan-5);--mantine-color-cyan-filled-hover: var(--mantine-color-cyan-6);--mantine-color-cyan-light: rgba(100, 218, 255, 0.15);--mantine-color-cyan-light-hover: rgba(100, 218, 255, 0.2);--mantine-color-cyan-light-color: var(--mantine-color-cyan-0);--mantine-color-cyan-outline: var(--mantine-color-cyan-1);--mantine-color-cyan-outline-hover: rgba(202, 245, 255, 0.05);--mantine-color-teal-filled: var(--mantine-color-teal-5);--mantine-color-teal-filled-hover: var(--mantine-color-teal-6);--mantine-color-teal-light: rgba(99, 230, 190, 0.15);--mantine-color-teal-light-hover: rgba(99, 230, 190, 0.2);--mantine-color-teal-light-color: var(--mantine-color-teal-0);--mantine-color-teal-outline: var(--mantine-color-teal-1);--mantine-color-teal-outline-hover: rgba(195, 250, 232, 0.05);--mantine-color-green-filled: var(--mantine-color-green-5);--mantine-color-green-filled-hover: var(--mantine-color-green-6);--mantine-color-green-light: rgba(134, 223, 148, 0.15);--mantine-color-green-light-hover: rgba(134, 223, 148, 0.2);--mantine-color-green-light-color: var(--mantine-color-green-0);--mantine-color-green-outline: var(--mantine-color-green-1);--mantine-color-green-outline-hover: rgba(215, 246, 220, 0.05);--mantine-color-lime-filled: var(--mantine-color-lime-5);--mantine-color-lime-filled-hover: var(--mantine-color-lime-6);--mantine-color-lime-light: rgba(192, 235, 117, 0.15);--mantine-color-lime-light-hover: rgba(192, 235, 117, 0.2);--mantine-color-lime-light-color: var(--mantine-color-lime-0);--mantine-color-lime-outline: var(--mantine-color-lime-1);--mantine-color-lime-outline-hover: rgba(233, 250, 200, 0.05);--mantine-color-yellow-filled: var(--mantine-color-yellow-5);--mantine-color-yellow-filled-hover: var(--mantine-color-yellow-6);--mantine-color-yellow-light: rgba(255, 201, 102, 0.15);--mantine-color-yellow-light-hover: rgba(255, 201, 102, 0.2);--mantine-color-yellow-light-color: var(--mantine-color-yellow-0);--mantine-color-yellow-outline: var(--mantine-color-yellow-1);--mantine-color-yellow-outline-hover: rgba(255, 238, 205, 0.05);--mantine-color-orange-filled: var(--mantine-color-orange-5);--mantine-color-orange-filled-hover: var(--mantine-color-orange-6);--mantine-color-orange-light: rgba(255, 192, 120, 0.15);--mantine-color-orange-light-hover: rgba(255, 192, 120, 0.2);--mantine-color-orange-light-color: var(--mantine-color-orange-0);--mantine-color-orange-outline: var(--mantine-color-orange-1);--mantine-color-orange-outline-hover: rgba(255, 232, 204, 0.05);--app-cta-gradient: linear-gradient(90deg, var(--mantine-color-blue-9) 0%, var(--mantine-color-cyan-7) 100%);--app-color-surface: #2e2e2e;}

:root[data-mantine-color-scheme="light"], :host([data-mantine-color-scheme="light"]){--mantine-color-anchor: var(--mantine-color-text);--mantine-color-dimmed: #495057;--mantine-color-red-light: rgba(224, 40, 41, 0.1);--mantine-color-red-light-hover: rgba(224, 40, 41, 0.12);--mantine-color-red-outline-hover: rgba(224, 40, 41, 0.05);--mantine-color-violet-light: rgba(176, 9, 255, 0.1);--mantine-color-violet-light-hover: rgba(176, 9, 255, 0.12);--mantine-color-violet-outline-hover: rgba(176, 9, 255, 0.05);--mantine-color-indigo-light: rgba(45, 42, 223, 0.1);--mantine-color-indigo-light-hover: rgba(45, 42, 223, 0.12);--mantine-color-indigo-outline-hover: rgba(45, 42, 223, 0.05);--mantine-color-cyan-light: rgba(0, 194, 255, 0.1);--mantine-color-cyan-light-hover: rgba(0, 194, 255, 0.12);--mantine-color-cyan-outline-hover: rgba(0, 194, 255, 0.05);--mantine-color-green-light: rgba(63, 204, 84, 0.1);--mantine-color-green-light-hover: rgba(63, 204, 84, 0.12);--mantine-color-green-outline-hover: rgba(63, 204, 84, 0.05);--mantine-color-yellow-light: rgba(255, 169, 15, 0.1);--mantine-color-yellow-light-hover: rgba(255, 169, 15, 0.12);--mantine-color-yellow-outline-hover: rgba(255, 169, 15, 0.05);--app-color-surface: #f1f3f5;--app-cta-gradient: linear-gradient(90deg, var(--mantine-color-blue-filled) 0%, var(--mantine-color-cyan-5) 100%);}</style><style data-mantine-styles="classes">@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}</style><div style="position:absolute;top:0rem" class=""></div><div style="max-width:var(--container-size-xl);height:100%;min-height:0rem" class=""><style data-mantine-styles="inline">.__m__-_R_5ub_{--grid-gutter:0rem;}</style><div style="height:100%;min-height:0rem" class="m_410352e9 mantine-Grid-root __m__-_R_5ub_"><div class="m_dee7bd2f mantine-Grid-inner" style="height:100%"><style data-mantine-styles="inline">.__m__-_R_rdub_{--col-flex-grow:auto;--col-flex-basis:91.66666666666667%;--col-max-width:91.66666666666667%;}@media(min-width: 48em){.__m__-_R_rdub_{--col-flex-grow:auto;--col-flex-basis:83.33333333333334%;--col-max-width:83.33333333333334%;}}</style><div style="min-width:0rem;height:100%;min-height:0rem;display:flex" class="m_96bdd299 mantine-Grid-col __m__-_R_rdub_"><style data-mantine-styles="inline">.__m__-_R_6qrdub_{margin-top:0rem;padding-inline:var(--mantine-spacing-xs);width:100%;}@media(min-width: 48em){.__m__-_R_6qrdub_{margin-top:var(--mantine-spacing-xl);width:80%;}}@media(min-width: 62em){.__m__-_R_6qrdub_{padding-inline:var(--mantine-spacing-xl);}}</style><div style="margin-inline:auto;max-width:var(--mantine-breakpoint-xl)" class="__m__-_R_6qrdub_"><div style="color:var(--mantine-color-dimmed)" class="m_4451eb3a mantine-Center-root" data-inline="true"><div style="--ti-size:var(--ti-size-xs);--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;margin-inline-end:calc(0.125rem * var(--mantine-scale));color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent" data-size="xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-lock "><path d="M5 13a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v6a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-6"></path><path d="M11 16a1 1 0 1 0 2 0a1 1 0 0 0 -2 0"></path><path d="M8 11v-4a4 4 0 1 1 8 0v4"></path></svg></div><p style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Python: Веб-разработка (Flask)</p></div><h1 style="--title-fw:var(--mantine-h1-font-weight);--title-lh:var(--mantine-h1-line-height);--title-fz:var(--mantine-h1-font-size);margin-bottom:var(--mantine-spacing-xl)" class="m_8a5d1357 mantine-Title-root" data-order="1">Теория: Веб-сервер</h1><script type="application/ld+json">{"@context":"https://schema.org","@type":"LearningResource","name":"Веб-сервер","inLanguage":"ru","isPartOf":{"@type":"LearningResource","name":"Python: Веб-разработка (Flask)"},"isAccessibleForFree":"False","hasPart":{"@type":"WebPageElement","isAccessibleForFree":"False","cssSelector":".paywalled"}}</script><div class=""><div style="--alert-color:var(--mantine-color-indigo-light-color);margin-bottom:var(--mantine-spacing-lg);font-size:var(--mantine-font-size-lg)" class="m_66836ed3 mantine-Alert-root" id="mantine-_R_remqrdub_" role="alert" aria-describedby="mantine-_R_remqrdub_-body" aria-labelledby="mantine-_R_remqrdub_-title"><div class="m_a5d60502 mantine-Alert-wrapper"><div class="m_667f2a6a mantine-Alert-icon"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-rocket "><path d="M4 13a8 8 0 0 1 7 7a6 6 0 0 0 3 -5a9 9 0 0 0 6 -8a3 3 0 0 0 -3 -3a9 9 0 0 0 -8 6a6 6 0 0 0 -5 3"></path><path d="M7 14a6 6 0 0 0 -3 6a6 6 0 0 0 6 -3"></path><path d="M14 9a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path></svg></div><div class="m_667c2793 mantine-Alert-body"><div class="m_6a03f287 mantine-Alert-title"><span id="mantine-_R_remqrdub_-title" class="m_698f4f23 mantine-Alert-label">Полный доступ к материалам</span></div><div id="mantine-_R_remqrdub_-body" class="m_7fa78076 mantine-Alert-message"><div style="--group-gap:var(--mantine-spacing-md);--group-align:center;--group-justify:space-between;--group-wrap:wrap" class="m_4081bf90 mantine-Group-root"><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Зарегистрируйтесь и получите доступ к этому и десяткам других курсов</p><a style="--button-height:var(--button-height-xs);--button-padding-x:var(--button-padding-x-xs);--button-fz:var(--mantine-font-size-xs);--button-bg:linear-gradient(45deg, var(--mantine-color-blue-filled) 0%, var(--mantine-color-cyan-filled) 100%);--button-hover:linear-gradient(45deg, var(--mantine-color-blue-filled) 0%, var(--mantine-color-cyan-filled) 100%);--button-color:var(--mantine-color-white);--button-bd:none" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="gradient" data-size="xs" href="/u/new"><span class="m_80f1301b mantine-Button-inner"><span class="m_811560b9 mantine-Button-label">Зарегистрироваться</span></span></a></div></div></div></div></div><div class="paywalled m_d08caa0 mantine-Typography-root"><p>В этом уроке мы рассмотрим, для чего нужен веб-сервер, и как устроено сетевое взаимодействие.</p>
<h2 id="heading-2-1">Процессы</h2>
<p>Единицей исполнения в операционных системах является процесс. Это некоторая абстракция внутри ОС. Любая запущенная программа — это либо один процесс, либо набор процессов. Например, в браузерах одна вкладка, как правило, — это один процесс.</p>
<p>Особенность процессов в том, что они изолированы друг от друга. Например, сбой в одном процессе не влечет за собой остановку работы других. Такое свойство процессов можно наблюдать в тех ситуациях, когда одна из вкладок браузера начинает тормозить и зависает. В это время можно без проблем продолжать использовать другие вкладки.</p>
<p>Внутри себя процесс может делиться на потоки:</p>
<p><img style="--image-object-fit:contain;width:auto" class="m_9e117634 mantine-Image-root" src="/rails/active_storage/blobs/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MTAwMTYsInB1ciI6ImJsb2JfaWQifX0=--dc3b702add19732b305a82797a830412b110af88/process-list.png" alt="Process List" loading="lazy"/></p>
<p>Посмотреть список процессов в Linux можно командой <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">ps aux</code> либо <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">top</code>.</p>
<p>Подробнее о менеджменте процессов можно прочитать в <a style="text-decoration:underline" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="https://ru.hexlet.io/pages/recommended-books" rel="noopener noreferrer" target="_blank">книгах</a> по операционным системам.</p>
<p>Понимание процессов тесно связано с сетевым взаимодействием. Взаимодействие между двумя компьютерами в сети — всегда сводится к взаимодействию двух процессов. То есть нельзя подключиться к компьютеру в целом — можно подключиться только к конкретному процессу конкретной программы.</p>
<p>Происходит это так: одна программа, которая хочет, чтобы к ней можно было подключаться по сети, при запуске начинает слушать сетевой сокет. Такая программа называется сервером. Другая программа к ней подключается — клиент. В случае веба, сервер — это конкретный веб-сервер, например, nginx, а клиент — это браузер.</p>
<p>Сетевое взаимодействие между программами двух компьютеров осуществляется с помощью одного из транспортных протоколов — например TCP, поверх которого уже работает HTTP. Для обращения к другому компьютеру нужно знать два параметра: <strong>IP-адрес</strong> и <strong>порт</strong>. «Слушать сетевой сокет» — это занять определенный порт на определенном сетевом интерфейсе и дать возможность обращаться к процессу через него. По номеру порта операционная система понимает, к какому процессу пытаются обратиться.</p>
<p>Благодаря DNS браузер получает IP-адрес компьютера, на котором расположен сайт указанного домена. Также существует соглашение, согласно которому веб-сервер, обслуживающий сайт по протоколу HTTP, слушает порт <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">80</code>, а протокол HTTPS обслуживается на порту <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">443</code>. Поэтому браузер знает порт, на котором висит веб-сервер в ожидании входящих запросов.</p>
<p>Но так бывает не всегда. Во время локальной разработки обычно используются другие порты, например, <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">3000</code> или <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">4000</code>. Сам номер не принципиален. Главное, что он доступен для веб-сервера, и мы обращаемся через браузер именно к нему. Порт указывается через двоеточие после названия сайта, например, <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">www.google.com:80</code>.</p>
<h2 id="heading-2-2">Веб-сервер</h2>
<p><strong>Веб-сервер</strong> — специализированная программа для обслуживания сайтов. Один веб-сервер может обрабатывать практически любое число сайтов (Virtual Hosts в HTTP). Он перенаправляет входящие сетевые запросы на код сайтов, получает от них ответ и возвращает его браузеру.</p>
<p>Еще у веб-серверов есть большое количество вспомогательных функций. Среди них кеширование, перезапись запросов, раздача статики, reverse proxy, балансировка нагрузки и многое другое.</p>
<p>Веб-сервера не знают, на чем написан сайт. Все способы взаимодействия веб-сервера и сайта на любом языке стандартизированы. Благодаря этому веб-серверов существует не так много, и они могут работать с сайтами, которые написаны на чем угодно.</p>
<p>Первым и самым простым способом взаимодействия веб-сервера с сайтом был <strong>CGI</strong> — Common Gateway Interface. Этот стандарт сразу разрабатывался с учетом того, что сервер не должен зависеть от того, на чем написан сайт. Он основан на переменных окружения.</p>
<p>По сути, сайт — это исполняемый файл, который запускается веб-сервером во время обработки входящего запроса и передает в него все параметры запроса через переменные окружения. Все, что требуется от скрипта, — это вернуть HTTP-ответ в стандартный вывод (STDOUT). Общий алгоритм работы выглядит так:</p>
<ol>
<li>Клиент запрашивает страницу сайта</li>
<li>Веб-сервер принимает запрос и устанавливает переменные окружения. Через них приложению передаются данные и служебная информация</li>
<li>Веб-сервер перенаправляет запросы через стандартный поток ввода (stdin) на вход вызываемой программы</li>
<li>CGI-приложение выполняет все необходимые операции и формирует результаты в виде HTML</li>
<li>Сформированный гипертекст возвращается веб-серверу через стандартный поток вывода (stdout). Сообщения об ошибках передаются через поток ошибок (stderr)</li>
<li>Веб-сервер передает результаты запроса клиенту</li>
</ol>
<h2 id="heading-2-3">WSGI</h2>
<p>У CGI-серверов был один важный недостаток — они запускали скрипты на каждый запрос, значит, каждый раз запускался интерпретатор. В ответ CGI в Python-комьюнити предложили новый стандарт, описанный в <a style="text-decoration:underline" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="https://peps.python.org/pep-3333/" rel="noopener noreferrer" target="_blank">PEP3333</a> — WSGI (Web Server Gateway Interface).</p>
<p>Основная идея WSGI — простое взаимодействие Python-приложения и веб-сервера. Согласно стандарту, веб-приложение — это просто функция или другой callable объект, которая принимает два аргумента</p>
<ul>
<li>Словарь переменных окружения</li>
<li>Функцию, которая устанавливает параметры ответа, а возвращает iterable в качестве ответа</li>
</ul>
<p>Минимальное WSGI-приложение, то есть приложение, которое поддерживает стандарт WSGI, выглядит примерно так:</p>
<div style="margin-bottom:var(--mantine-spacing-lg)" class="m_e597c321 mantine-CodeHighlight-codeHighlight" dir="ltr"><div class="m_be7e9c9c mantine-CodeHighlight-controls"><button style="--ai-bg:transparent;--ai-hover:transparent;--ai-color:inherit;--ai-bd:none" class="mantine-focus-auto mantine-active m_d498bab7 mantine-CodeHighlight-control m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root" data-variant="none" type="button" aria-label="Copy code"><span class="m_8d3afb97 mantine-ActionIcon-icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M8 8m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z"></path><path d="M16 8v-2a2 2 0 0 0 -2 -2h-8a2 2 0 0 0 -2 2v8a2 2 0 0 0 2 2h2"></path></svg></span></button></div><div style="--scrollarea-scrollbar-size:calc(0.25rem * var(--mantine-scale));--sa-corner-width:0px;--sa-corner-height:0px" class="m_f744fd40 mantine-CodeHighlight-scrollarea m_d57069b5 mantine-ScrollArea-root" dir="ltr"><div style="overflow-x:hidden;overflow-y:hidden;overscroll-behavior-inline:none" class="m_c0783ff9 mantine-ScrollArea-viewport" data-scrollbars="xy"><div class="m_b1336c6 mantine-ScrollArea-content"><pre class="m_2c47c4fd mantine-CodeHighlight-pre" style="padding:0"><code class="m_5caae6d3 mantine-CodeHighlight-code">def app(environ, start_response):
    data = b&quot;Hello, World!\n&quot;
    start_response(
        &quot;200 OK&quot;, [(&quot;Content-Type&quot;, &quot;text/plain&quot;), (&quot;Content-Length&quot;, str(len(data)))]
    )
    return iter([data])</code></pre></div></div></div><button class="mantine-focus-auto m_c9378bc2 mantine-CodeHighlight-showCodeButton m_87cf2631 mantine-UnstyledButton-root" data-hidden="true" type="button">Expand code</button></div>
<p>WSGI-сервер внутри себя вызовет функцию <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">app</code> и с помощью механизма замыканий передаст в нее необходимые аргументы. Все, что касается конкретного запроса, приходит в аргументе <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">environ</code>. Функция <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">start_response()</code> устанавливает параметры ответа. В приведенном примере — размер ответа и тип содержимого. Затем функция просто возвращает итератор, который построчно отдает ответ.</p>
<p>Все современные веб-фреймворки в Python поддерживают стандарт WSGI, то есть предоставляют на верхнем уровне этот callable объект — <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">app</code> во Flask, <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">wsgi</code> модуль в Django. А все WSGI-серверы умеют с этим объектом работать. Некоторые веб-серверы, как nginx, не поддерживают стандарт, но все равно умеют общаться с WSGI совместимыми (<code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">gunicorn</code>, <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">uWSGI</code>). Поэтому мы часто будем встречать классическую связку как nginx-gunicorn-Django.</p>
<h2 id="heading-2-4">Реализации</h2>
<p>Веб-серверов довольно много. Самым популярным и эффективным решением на текущий момент является nginx. Именно с ним и стоит познакомиться. Для разработки он не понадобится, но в продакшен-среде без него нельзя.</p>
<p>Также набирает популярность веб-сервер Caddy, который хоть и не такой быстрый, но обладает рядом важных особенностей. Он значительно проще в настройке, из коробки умеет генерировать сертификаты и многое другое.</p>
<p>Еще в Python самым популярным решением для WSGI-сервера остается gunicorn. Хоть gunicorn и является полноценным веб-сервером, его чаще используют в связке с nginx или Caddy. Так он отдает все сложности по кешированию, балансировке, раздаче статики, сертификатам и многое другое на их плечи.</p></div><div style="margin-block:var(--mantine-spacing-xl)" class=""><h2 style="--title-fw:var(--mantine-h2-font-weight);--title-lh:var(--mantine-h2-line-height);--title-fz:var(--mantine-h2-font-size);margin-bottom:var(--mantine-spacing-md)" class="m_8a5d1357 mantine-Title-root" data-order="2">Рекомендуемые программы</h2><style data-mantine-styles="inline">.__m__-_R_2mremqrdub_{--carousel-slide-gap:var(--mantine-spacing-xs);--carousel-slide-size:70%;}@media(min-width: 36em){.__m__-_R_2mremqrdub_{--carousel-slide-gap:var(--mantine-spacing-xl);--carousel-slide-size:50%;}}</style><div style="--carousel-control-size:calc(2.5rem * var(--mantine-scale));--carousel-controls-offset:var(--mantine-spacing-sm);margin-bottom:var(--mantine-spacing-lg);padding-block:var(--mantine-spacing-sm);background:var(--app-color-surface)" class="m_17884d0f mantine-Carousel-root responsiveClassName" data-orientation="horizontal" data-include-gap-in-size="true"><div class="m_39bc3463 mantine-Carousel-controls" data-orientation="horizontal"><button class="mantine-focus-auto m_64f58e10 mantine-Carousel-control m_87cf2631 mantine-UnstyledButton-root" type="button" data-inactive="true" data-type="previous" tabindex="-1"><svg viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg" style="transform:rotate(90deg);width:calc(1rem * var(--mantine-scale));height:calc(1rem * var(--mantine-scale));display:block"><path d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg></button><button class="mantine-focus-auto m_64f58e10 mantine-Carousel-control m_87cf2631 mantine-UnstyledButton-root" type="button" data-inactive="true" data-type="next" tabindex="-1"><svg viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg" style="transform:rotate(-90deg);width:calc(1rem * var(--mantine-scale));height:calc(1rem * var(--mantine-scale));display:block"><path d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg></button></div><div class="m_a2dae653 mantine-Carousel-viewport" data-type="media"><div class="m_fcd81474 mantine-Carousel-container __m__-_R_2mremqrdub_" data-orientation="horizontal"><div class="m_d98df724 mantine-Carousel-slide" data-orientation="horizontal"><div tabindex="0" style="cursor:pointer;height:100%"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/programs/python?promo_name=programs_list&amp;promo_position=course&amp;promo_creative=catalog_card&amp;promo_type=card" target="_blank"><div style="height:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true"><div style="--group-gap:calc(0.25rem * var(--mantine-scale));--group-align:center;--group-justify:flex-start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">10 месяцев</span><span class="mantine-focus-auto m_b6d8b162 mantine-Text-root">·</span><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">С нуля</span></div><p style="margin-bottom:var(--mantine-spacing-sm);font-size:var(--mantine-font-size-h5);font-weight:bold" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Python-разработчик </p><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Изучите Python, Django, REST и Fast API для создания веб-приложений</p><div style="margin-top:auto" class=""><div class="m_4451eb3a mantine-Center-root"><img style="opacity:0.8;width:70%" class="m_9e117634 mantine-Image-root mantine-visible-from-xs" src="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzczMSwicHVyIjoiYmxvYl9pZCJ9fQ==--f5df4883f3f678321cb4fa96e9ce657bd5ee1adf/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Static%20website-cuate.png" alt="Python-разработчик " loading="eager"/></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:end;--group-justify:space-between;--group-wrap:wrap;margin-top:var(--mantine-spacing-xs)" class="m_4081bf90 mantine-Group-root"><p style="font-size:var(--mantine-font-size-xl)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">от 6 792 ₽</p><p style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Посмотреть →</p></div></div></div></a></div></div><div class="m_d98df724 mantine-Carousel-slide" data-orientation="horizontal"><div tabindex="0" style="cursor:pointer;height:100%"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/programs/flask?promo_name=programs_list&amp;promo_position=course&amp;promo_creative=catalog_card&amp;promo_type=card" target="_blank"><div style="height:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true"><div style="--group-gap:calc(0.25rem * var(--mantine-scale));--group-align:center;--group-justify:flex-start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">1 месяц</span><span class="mantine-focus-auto m_b6d8b162 mantine-Text-root">·</span><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">С нуля</span></div><p style="margin-bottom:var(--mantine-spacing-sm);font-size:var(--mantine-font-size-h5);font-weight:bold" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Веб-разработка на Python</p><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Навык создания веб-приложений на Flask</p><div style="margin-top:auto" class=""><div class="m_4451eb3a mantine-Center-root"><img style="opacity:0.8;width:70%" class="m_9e117634 mantine-Image-root mantine-visible-from-xs" src="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzY3NywicHVyIjoiYmxvYl9pZCJ9fQ==--745022c2f47ba4203dd11cd8922cd55d5bebfdca/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Code%20typing-rafiki.png" alt="Веб-разработка на Python" loading="eager"/></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:end;--group-justify:space-between;--group-wrap:wrap;margin-top:var(--mantine-spacing-xs)" class="m_4081bf90 mantine-Group-root"><p style="font-size:var(--mantine-font-size-xl)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">от 3 900 ₽</p><p style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Посмотреть →</p></div></div></div></a></div></div><div class="m_d98df724 mantine-Carousel-slide" data-orientation="horizontal"><div tabindex="0" style="cursor:pointer;height:100%"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/programs/devops-engineer-from-scratch?promo_name=programs_list&amp;promo_position=course&amp;promo_creative=catalog_card&amp;promo_type=card" target="_blank"><div style="height:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true"><div style="--group-gap:calc(0.25rem * var(--mantine-scale));--group-align:center;--group-justify:flex-start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">14 месяцев</span><span class="mantine-focus-auto m_b6d8b162 mantine-Text-root">·</span><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">С нуля</span></div><p style="margin-bottom:var(--mantine-spacing-sm);font-size:var(--mantine-font-size-h5);font-weight:bold" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">DevOps-инженер с нуля</p><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Полное погружение в DevOps: весь стек от Linux до Kubernetes</p><div style="margin-top:auto" class=""><div class="m_4451eb3a mantine-Center-root"><img style="opacity:0.8;width:70%" class="m_9e117634 mantine-Image-root mantine-visible-from-xs" src="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6Mzk2NSwicHVyIjoiYmxvYl9pZCJ9fQ==--84278a1852c9c6fb13b80a69f395bac6e47a422e/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Cloud%20sync-bro.png" alt="DevOps-инженер с нуля" loading="eager"/></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:end;--group-justify:space-between;--group-wrap:wrap;margin-top:var(--mantine-spacing-xs)" class="m_4081bf90 mantine-Group-root"><p style="font-size:var(--mantine-font-size-xl)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">от 6 792 ₽</p><p style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Посмотреть →</p></div></div></div></a></div></div><div class="m_d98df724 mantine-Carousel-slide" data-orientation="horizontal"><div tabindex="0" style="cursor:pointer;height:100%"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/courses?promo_name=programs_list&amp;promo_position=course&amp;promo_creative=catalog_card&amp;promo_type=card"><div style="height:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true"><h2 style="--title-fw:var(--mantine-h2-font-weight);--title-lh:var(--mantine-h2-line-height);--title-fz:var(--mantine-h2-font-size);margin-bottom:var(--mantine-spacing-md);font-size:var(--mantine-font-size-h3)" class="m_8a5d1357 mantine-Title-root" data-order="2" data-responsive="true">Каталог</h2><p style="margin-bottom:auto" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Полный список доступных курсов по разным направлениям</p><div style="margin-top:auto" class=""><div class="m_4451eb3a mantine-Center-root"><img style="opacity:0.8;width:70%" class="m_9e117634 mantine-Image-root mantine-visible-from-xs" src="/vite/assets/development-BVihs_d5.png" alt="Orientation"/></div></div></div></a></div></div></div></div></div></div></div></div></div><style data-mantine-styles="inline">.__m__-_R_1bdub_{--col-flex-grow:auto;--col-flex-basis:8.333333333333334%;--col-max-width:8.333333333333334%;}@media(min-width: 48em){.__m__-_R_1bdub_{--col-flex-grow:auto;--col-flex-basis:16.666666666666668%;--col-max-width:16.666666666666668%;}}</style><div style="min-width:0rem;height:100%;min-height:0rem" class="m_96bdd299 mantine-Grid-col __m__-_R_1bdub_"><div style="margin-inline:var(--mantine-spacing-xs)" class="mantine-visible-from-sm"><a style="--button-color:var(--mantine-color-white);margin-bottom:var(--mantine-spacing-lg);text-decoration:none" class="mantine-focus-auto m_849cf0da mantine-focus-auto m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/courses/python-flask/lessons/web-server/finish_unit?unit=theory" data-disabled="true" data-block="true" disabled=""><span class="m_80f1301b mantine-Button-inner"><span class="m_811560b9 mantine-Button-label"><span style="margin-inline-end:var(--mantine-spacing-xs)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Дальше</span>→</span></span></a><a style="padding-inline:0rem" class="mantine-focus-auto m_f0824112 mantine-NavLink-root m_87cf2631 mantine-UnstyledButton-root"><span class="m_690090b5 mantine-NavLink-section" data-position="left"><div style="--ti-size:var(--ti-size-sm);--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent" data-size="sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-list-numbers "><path d="M11 6h9"></path><path d="M11 12h9"></path><path d="M12 18h8"></path><path d="M4 16a2 2 0 1 1 4 0c0 .591 -.5 1 -1 1.5l-3 2.5h4"></path><path d="M6 10v-6l-2 2"></path></svg></div></span><div class="m_f07af9d2 mantine-NavLink-body"><span class="m_1f6ac4c4 mantine-NavLink-label">Навигация по теме</span><span class="m_57492dcc mantine-NavLink-description">Теория</span></div><span class="m_690090b5 mantine-NavLink-section" data-position="right"></span></a><div style="margin-block:var(--mantine-spacing-lg)" class="m_3eebeb36 mantine-Divider-root" data-orientation="horizontal" role="separator"></div><div style="margin-block:var(--mantine-spacing-lg)" class=""><div style="justify-content:space-between;margin-bottom:calc(0.1875rem * var(--mantine-scale));color:var(--mantine-color-dimmed);font-size:var(--mantine-font-size-xs)" class="m_8bffd616 mantine-Flex-root __m__-_R_qimrbdub_"><p style="font-size:var(--mantine-font-size-xs)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Завершено</p><p style="font-size:var(--mantine-font-size-xs)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">0 / 27</p></div><div style="--progress-size:var(--progress-size-sm)" class="m_db6d6462 mantine-Progress-root" data-size="sm"><div style="--progress-section-size:0%;--progress-section-color:var(--mantine-color-gray-filled)" class="m_2242eb65 mantine-Progress-section" role="progressbar" aria-valuemax="100" aria-valuemin="0" aria-valuenow="0" aria-valuetext="0%"></div></div></div><button style="padding-inline:0rem" class="mantine-focus-auto m_f0824112 mantine-NavLink-root m_87cf2631 mantine-UnstyledButton-root" type="button"><span class="m_690090b5 mantine-NavLink-section" data-position="left"><div style="--ti-size:var(--ti-size-sm);--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent" data-size="sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-message "><path d="M8 9h8"></path><path d="M8 13h6"></path><path d="M18 4a3 3 0 0 1 3 3v8a3 3 0 0 1 -3 3h-5l-5 3v-3h-2a3 3 0 0 1 -3 -3v-8a3 3 0 0 1 3 -3h12"></path></svg></div></span><div class="m_f07af9d2 mantine-NavLink-body"><span class="m_1f6ac4c4 mantine-NavLink-label">Обсуждения (архив)</span><span class="m_57492dcc mantine-NavLink-description"></span></div></button><div style="--toc-bg:var(--mantine-color-blue-light);--toc-color:var(--mantine-color-blue-light-color);--toc-size:var(--mantine-font-size-sm);--toc-radius:var(--mantine-radius-sm);margin-top:var(--mantine-spacing-xl)" class="m_bcaa9990 mantine-TableOfContents-root" data-variant="light" data-size="sm"></div></div><div class="mantine-hidden-from-sm"><div style="--stack-gap:0rem;--stack-align:stretch;--stack-justify:flex-start" class="m_6d731127 mantine-Stack-root"><a style="--button-color:var(--mantine-color-white);margin-bottom:var(--mantine-spacing-xs);padding:0rem;text-decoration:none" class="mantine-focus-auto m_849cf0da mantine-focus-auto m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/courses/python-flask/lessons/web-server/finish_unit?unit=theory" data-disabled="true" data-block="true" disabled=""><span class="m_80f1301b mantine-Button-inner"><span class="m_811560b9 mantine-Button-label">→</span></span></a><button style="--ai-size:var(--ai-size-sm);--ai-bg:transparent;--ai-hover:var(--mantine-color-indigo-light-hover);--ai-color:var(--mantine-color-indigo-light-color);--ai-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-block:var(--mantine-spacing-lg);color:inherit;width:100%" class="mantine-focus-auto m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" data-disabled="true" type="button" disabled=""><span class="m_8d3afb97 mantine-ActionIcon-icon"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-list-numbers "><path d="M11 6h9"></path><path d="M11 12h9"></path><path d="M12 18h8"></path><path d="M4 16a2 2 0 1 1 4 0c0 .591 -.5 1 -1 1.5l-3 2.5h4"></path><path d="M6 10v-6l-2 2"></path></svg></span></button><button style="--ai-size:var(--ai-size-sm);--ai-bg:transparent;--ai-hover:var(--mantine-color-indigo-light-hover);--ai-color:var(--mantine-color-indigo-light-color);--ai-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-block:var(--mantine-spacing-lg);color:inherit;width:100%" class="mantine-focus-auto mantine-active m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" type="button"><span class="m_8d3afb97 mantine-ActionIcon-icon"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-message "><path d="M8 9h8"></path><path d="M8 13h6"></path><path d="M18 4a3 3 0 0 1 3 3v8a3 3 0 0 1 -3 3h-5l-5 3v-3h-2a3 3 0 0 1 -3 -3v-8a3 3 0 0 1 3 -3h12"></path></svg></span></button></div></div></div></div></div></div></div>
</main>
<footer class="bg-dark fw-light text-light px-3 py-5">
<div class="row small">
<div class="col-12 col-sm-6 col-md-3">
<div class="h5 mb-3">Хекслет</div>
<ul class="list-unstyled">
<li>
<a class="nav-link link-light py-1 ps-0" href="/pages/about">О нас</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/testimonials">Отзывы</a>
</li>
<li>
<span class="nav-link link-light py-1 ps-0 external-link" data-href="https://b2b.hexlet.io" role="button">Корпоративное обучение</span>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/blog">Блог</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/qna">Вопросы и ответы</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/glossary">Глоссарий</a>
</li>
<li>
<span class="nav-link link-light py-1 ps-0 external-link" data-href="https://help.hexlet.io" data-target="_blank" role="button">Справка</span>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" target="_blank" rel="noopener noreferrer" href="/map">Карта сайта</a>
</li>
</ul>
</div>
<div class="col-12 col-sm-6 col-md-3">
<div class="h5 fw-normal mb-3">Направления</div>
<ul class="list-unstyled">
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_devops">DevOps
</a></li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_data_analytics">Аналитика
</a></li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_backend_development">Бэкенд
</a></li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_programming">Программирование
</a></li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_testing">Тестирование
</a></li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_front_end_dev">Фронтенд
</a></li>
</ul>
</div>
<div class="col-12 col-sm-6 col-md-3">
<div class="h5">Профессии</div>
<ul class="list-unstyled">
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/devops-engineer-from-scratch">DevOps-инженер с нуля</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/go">Go-разработчик</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/java">Java-разработчик</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/python">Python-разработчик </a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/data-analytics">Аналитик данных</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/qa-engineer">Инженер по ручному тестированию</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/php">РНР-разработчик</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/frontend">Фронтенд-разработчик</a>
</li>
</ul>
</div>
<div class="col-12 col-sm-6 col-md-3">
<div class="h5">Навыки</div>
<ul class="list-unstyled">
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/python-django-developer">Django</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/docker">Docker</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/php-laravel-developer">Laravel</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/postman">Postman</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/js-react-developer">React</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/js-rest-api">REST API в Node.js</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/spring-boot">Spring Boot</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/typescript">Typescript</a>
</li>
</ul>
</div>
</div>
<hr>
<div class="row">
<div class="col-12 col-sm-4 col-md-2">
<div class="fs-4">
<ul class="list-unstyled d-flex">
<li class="me-3">
<a aria-label="Telegram" target="_blank" class="link-light" rel="noopener noreferrer nofollow" href="https://t.me/hexlet_ru"><span class="bi bi-telegram"></span>
</a></li>
<li>
<a aria-label="Youtube" target="_blank" class="link-light" rel="noopener noreferrer nofollow" href="https://www.youtube.com/user/HexletUniversity"><span class="bi bi-youtube"></span>
</a></li>
</ul>
</div>
<div class="mb-2 d-flex flex-column">
<a class="link-light text-decoration-none" rel="nofollow" href="mailto:support@hexlet.io">support@hexlet.io</a>
<a class="link-light text-decoration-none py-2" target="_blank" href="https://t.me/hexlet_help_bot">t.me/hexlet_help_bot</a>
</div>
<ul class="list-unstyled d-flex">
<li class="me-3">
<span class="link-light text-decoration-none opacity-50 x-font-size-18 external-link" rel="nofollow" data-href="https://hexlet.io/locale/switch?new_locale=en" data-target="_self" role="button"><span class="my-auto">EN</span>
</span></li>
<li class="me-3">
<span class="link-light text-decoration-none opacity-50 x-font-size-18 opacity-100 external-link" rel="nofollow" data-href="https://ru.hexlet.io/locale/switch?new_locale=ru" data-target="_self" role="button"><span class="my-auto">RU</span>
</span></li>
<li class="me-3">
<span class="link-light text-decoration-none opacity-50 x-font-size-18 external-link" rel="nofollow" data-href="https://kz.hexlet.io/locale/switch?new_locale=kz" data-target="_self" role="button"><span class="my-auto">KZ</span>
</span></li>
</ul>
</div>
<div class="col-12 col-sm-4 col-md-3">
<ul class="list-unstyled fs-4">
<li class="mb-3">
<a class="link-light text-decoration-none" href="tel:8%20800%20100%2022%2047">8 800 100 22 47</a>
<span class="d-block opacity-50 small">бесплатно по РФ</span>
</li>
<li>
<a class="link-light text-decoration-none" href="tel:%2B7%20495%20085%2021%2062">+7 495 085 21 62</a>
<span class="d-block opacity-50 small">бесплатно по Москве</span>
</li>
</ul>
</div>
<div class="col-12 col-sm-4 col-md-3">
<div class="small mb-3">Образовательные услуги оказываются на основании Л035-01298-77/01989008 от 14.03.2025</div>
<ul class="list-unstyled small">
<li>
<a class="nav-link link-light py-1 ps-0" href="/pages/legal">Правовая информация</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/pages/offer">Оферта</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/pages/license">Лицензия</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/pages/contacts">Контакты</a>
</li>
</ul>
</div>
<div class="col-12 col-sm-12 col-md-4 small">
<div class="mb-2">
<div>ООО «<a href="/" class="text-decoration-none link-light">Хекслет Рус</a>»</div>
<div>108813 г. Москва, вн.тер.г. поселение Московский,</div>
<div>г. Московский, ул. Солнечная, д. 3А, стр. 1, помещ. 20Б/3</div>
<div>ОГРН 1217300010476</div>
<div>ИНН 7325174845</div>
</div>
<hr>
<div>АНО ДПО «<a href="/" class="text-decoration-none link-light">Учебный центр «Хекслет</a>»</div>
<div>119331 г. Москва, вн. тер. г. муниципальный округ</div>
<div>Ломоносовский, пр-кт Вернадского, д. 29</div>
<div>ОГРН 1247700712390</div>
<div>ИНН 7736364948</div>
</div>
</div>
</footer>


<div id="root-assistant-offcanvas"></div>
<script src="/vite/assets/assistant-CdBlNCiQ.js" crossorigin="anonymous" type="module"></script><link rel="modulepreload" href="/vite/assets/chunk-DsPFFUou.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/init-nkZBEvfU.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/ErrorFallbackBlock-naDSYSy9.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/MarkdownBlock-DbyKWoR_.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/gon-D3e4yh1x.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/mantine-CGMYrt2Y.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/shiki-V011pkdv.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/utils-DRqSHbQE.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/routes-CCH8ilKF.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/lib-XR8Qr8kR.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/dist-GCHh59xr.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Box-B5-OOzBf.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/notifications.store-C-3AFSMn.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/useIsomorphicEffect-HJ6VK0D3.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/lib-KSp6QbZ0.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/axios-BEvgo0ym.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/classnames-l6ipYlLR.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/dayjs.min-BkKovM-s.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/debounce-jMQ_Cf4f.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/i18next-BlSq9s7B.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/client-U9M77rxp.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/react-dom-DaLxUz_h.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/useTranslation-Bx1Cdrkz.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/compiler-runtime-6XxiPFnt.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/jsx-runtime-CwjcCKJi.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/react-CkL4ZRHB.js" as="script" crossorigin="anonymous">



<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v67327c56f0bb4ef8b305cae61679db8f1769101564043" integrity="sha512-rdcWY47ByXd76cbCFzznIcEaCN71jqkWBBqlwhF1SY7KubdLKZiEGeP7AyieKZlGP9hbY/MhGrwXzJC/HulNyg==" data-cf-beacon='{"version":"2024.11.0","token":"d11015b65d11429ea6b4a2ef37dd7e0b","server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
</body>
</html>