Auto | arch-x1: 2026-06-05 13:24:09

90 Library/Networking/NAT.md

@@ -1,12 +1,12 @@
 ---
-status: stable
+status: processing
 type: concept
 tags:
 - network
 - networking
 - nat
 created: 2025-12-17
-updated: 2026-05-07
+updated: 2026-06-05
 aliases:
 - NAT
 ---
@@ -91,5 +91,20 @@ PAT - это совершенно иная по сути работы систе
 |Повышение безопасности за счёт скрытия внутренней топологии|Сложности с туннелированием (IPsec и др.)|
 |Лёгкая смена публичной схемы адресации без перенастройки хостов|Нарушение работы сервисов, требующих входящих соединений или UDP|
 
+## Простыми словами для экзамена
+
+NAT нужен, чтобы частные адреса локальной сети могли ходить в интернет через один или несколько публичных адресов.
+
+Домашний пример:
+
+- ноутбук имеет `192.168.1.10`;
+- телефон имеет `192.168.1.11`;
+- роутер имеет публичный адрес провайдера;
+- сайты видят запросы как пришедшие от публичного адреса роутера.
+
+PAT — самый частый вариант NAT. Он различает внутренние устройства по портам. Поэтому один публичный IP может обслуживать много внутренних клиентов одновременно.
+
+Главная идея: IP меняется на границе сети, а таблица NAT запоминает, кому вернуть ответ.
+
 ## Связанные заметки
-- [[Terraform]] — NAT-шлюзы и пулы IP-адресов — типовые сетевые ресурсы, которые Terraform декларативно управляет в облачной инфраструктуре (VPC, subnets)
+- [[Terraform]] — NAT-шлюзы и пулы IP-адресов — типовые сетевые ресурсы, которые Terraform декларативно управляет в облачной инфраструктуре (VPC, subnets)

90 Library/Networking/OAuth 2.0.md

@@ -1,10 +1,10 @@
 ---
 title: OAuth 2.0
-status: seed
+status: processing
 type: concept
 tags: [web, security, oauth, authorization]
 created: 2026-06-04
-updated: 2026-06-04
+updated: 2026-06-05
 source: "[[00_базовые_понятия.pdf]]"
 aliases:
 - OAuth 2
@@ -41,6 +41,20 @@ OAuth 2.0 — протокол авторизации, который позво
 
 OAuth 2.0 — про авторизацию. Сам по себе он не обязан доказывать личность пользователя как протокол аутентификации; для входа поверх OAuth обычно используют OpenID Connect.
 
+## Простыми словами для экзамена
+
+OAuth 2.0 нужен, чтобы не отдавать пароль стороннему приложению.
+
+Пример: сайт просит "войти через GitHub".
+
+1. Сайт перенаправляет пользователя на GitHub.
+2. Пользователь подтверждает доступ на GitHub.
+3. GitHub возвращает сайту код авторизации.
+4. Сайт меняет код на access token.
+5. Сайт ходит в API GitHub с этим токеном.
+
+Токен можно ограничить по сроку и правам (`scope`). Это безопаснее, чем дать приложению пароль от аккаунта.
+
 ## Связи
 
 - [[Веб-аутентификация и авторизация]]

90 Library/Networking/Веб-аутентификация и авторизация.md

@@ -1,10 +1,10 @@
 ---
 title: Веб-аутентификация и авторизация
-status: seed
+status: processing
 type: concept
 tags: [web, security, authentication, authorization, oauth]
 created: 2026-06-04
-updated: 2026-06-04
+updated: 2026-06-05
 source: "[[00_базовые_понятия.pdf]]"
 aliases:
 - Идентификация, аутентификация и авторизация
@@ -38,6 +38,22 @@ Authorization: Bearer eyJhbGciOi...
 
 Bearer-токен даёт доступ тому, кто им владеет. Поэтому токены нужно хранить аккуратно, ограничивать срок их жизни и уметь отзывать.
 
+## Простыми словами для экзамена
+
+Три термина часто путают:
+
+- идентификация — пользователь назвал себя: "я `ivan@example.com`";
+- аутентификация — система проверила доказательство: пароль, код, ключ;
+- авторизация — система решила, что этому пользователю можно: читать, создавать, удалять.
+
+Пример:
+
+1. Ввод логина — идентификация.
+2. Проверка пароля — аутентификация.
+3. Проверка роли `admin` перед удалением записи — авторизация.
+
+HTTP сам по себе не помнит пользователя между запросами. Поэтому веб-приложения используют cookies, сессии или токены.
+
 ## Связи
 
 - [[OAuth 2.0]]

90 Library/Networking/Подсети и маска подсети.md

@@ -1,10 +1,10 @@
 ---
 title: Подсети и маска подсети
-status: seed
+status: processing
 type: concept
 tags: [network, networking, subnet, ipv4]
 created: 2026-06-04
-updated: 2026-06-04
+updated: 2026-06-05
 source: "[[00_базовые_понятия.pdf]]"
 aliases:
 - Маска подсети
@@ -58,6 +58,21 @@ Loopback-диапазон:
 
 - `127.0.0.0/8`, чаще всего `127.0.0.1` как `localhost`.
 
+## Простыми словами для экзамена
+
+Подсеть — это часть большой сети. Маска говорит, какие биты IP-адреса считаются номером сети, а какие остаются под устройства.
+
+Пример: `192.168.1.10/24`.
+
+- `/24` означает: первые 24 бита — сеть.
+- Адрес сети: `192.168.1.0`.
+- Хостовая часть: последнее число.
+- Типичный диапазон устройств: `192.168.1.1` ... `192.168.1.254`.
+
+Чем больше число после `/`, тем меньше подсеть. `/24` меньше, чем `/16`, потому что под хосты остаётся меньше бит.
+
+На экзамене часто спрашивают не точный расчёт, а смысл: маска нужна, чтобы понять, находится ли адрес в той же локальной сети или пакет нужно отправлять через шлюз.
+
 ## Связи
 
 - [[IP-адрес]]

90 Library/Networking/Протоколы/DNS.md

@@ -1,5 +1,5 @@
 ---
-status: stable
+status: processing
 type: concept
 tags:
 - network
@@ -7,7 +7,7 @@ tags:
 - protocols
 - dns
 created: 2025-12-17
-updated: 2026-05-07
+updated: 2026-06-05
 aliases:
 - DNS
 ---
@@ -46,4 +46,27 @@ DNS - Domain Name System Аналог: контактная книга в тел
 
 1. Recursive (рекурсивный) - запрос IP-адреса по домену.
 2. Iterative (итеративный) - запрос IP-адреса, либо авторитативного DNS сервера.
-3. Inverse (обратный) - запрос доменного имени по IP-адресу.
+3. Inverse (обратный) - запрос доменного имени по IP-адресу.
+
+## Простыми словами для экзамена
+
+DNS превращает понятное человеку имя сайта в IP-адрес, понятный сети.
+
+Упрощённая цепочка:
+
+1. Браузер проверяет свой кэш.
+2. ОС проверяет локальные данные, например `hosts`.
+3. Resolver спрашивает DNS-серверы.
+4. Root-сервер подсказывает сервер зоны верхнего уровня.
+5. TLD-сервер подсказывает авторитативный сервер домена.
+6. Авторитативный сервер отдаёт нужную запись.
+
+Частые записи:
+
+- `A` — домен в IPv4.
+- `AAAA` — домен в IPv6.
+- `CNAME` — псевдоним на другое имя.
+- `MX` — почтовые серверы домена.
+- `TXT` — текстовые данные, часто для подтверждений и SPF/DKIM.
+
+DNS не загружает сайт. Он только помогает найти адрес, куда потом пойдёт HTTP/HTTPS-запрос.

90 Library/Networking/Протоколы/HTTP, HTTPS и HTTP3.md

@@ -1,10 +1,10 @@
 ---
 title: HTTP, HTTPS и HTTP/3
-status: seed
+status: processing
 type: concept
 tags: [web, network, networking, protocols, http, https, http3]
 created: 2026-06-04
-updated: 2026-06-04
+updated: 2026-06-05
 source: "[[00_базовые_понятия.pdf]]"
 aliases:
 - HTTP, HTTPS и HTTP/3
@@ -114,6 +114,38 @@ HTTP/3 работает поверх QUIC, а QUIC работает поверх
 
 HTTP/3 не меняет смысл методов, заголовков и кодов ответа. Меняется транспортный слой.
 
+## Простыми словами для экзамена
+
+HTTP — это правила разговора браузера и сервера.
+
+Запрос отвечает на вопрос: "что клиент хочет?". Ответ отвечает: "что сервер вернул?".
+
+Пример GET:
+
+```http
+GET /posts/?page=2 HTTP/1.1
+Host: example.com
+```
+
+Пример POST:
+
+```http
+POST /login/ HTTP/1.1
+Host: example.com
+Content-Type: application/x-www-form-urlencoded
+
+username=ivan&password=secret
+```
+
+Главное различие:
+
+- `GET` обычно получает данные; параметры видны в URL.
+- `POST` обычно отправляет данные в теле запроса; подходит для форм, создания объектов, логина.
+
+HTTPS — это не "другой HTTP", а HTTP внутри защищённого TLS-соединения. Порт HTTP — `80`, HTTPS — `443`.
+
+HTTP/3 использует QUIC поверх UDP. Для экзамена достаточно помнить: HTTP/3 уменьшает задержки и проблему блокировки потоков при потере пакетов.
+
 ## Связи
 
 - [[TCP vs UDP]]

90 Library/Networking/Протоколы/IP-адрес.md

@@ -1,12 +1,12 @@
 ---
-status: stable
+status: processing
 type: concept
 tags:
 - network
 - networking
 - protocols
 created: 2025-12-17
-updated: 2026-05-07
+updated: 2026-06-05
 aliases:
 - IP-адрес
 ---
@@ -21,4 +21,18 @@ IP-адрес - это просто набор из 32 нулей и едини
 
 Статика - задается вручную и не меняется в ходе работы. Динамика - задается автоматически посредством DHCP-сервера из определенного ему пула IP.
 
-Т.к. переход на IPv6 дорог, да и иметь всем конкретный IP не очень безопасно, придумали [[NAT]] (Network Address Translation) и его надстройку PAT (Port Address Translation). Суть в том, что много устройств могут выходить в сеть под "одним" белым (внешним) IP. Но есть нюанс, при маршрутизации трафика к белому IP добавляется порт, который уточняет, к какому именно устройству сети и с каким "внутренним" IP направить эти пакеты.
+Т.к. переход на IPv6 дорог, да и иметь всем конкретный IP не очень безопасно, придумали [[NAT]] (Network Address Translation) и его надстройку PAT (Port Address Translation). Суть в том, что много устройств могут выходить в сеть под "одним" белым (внешним) IP. Но есть нюанс, при маршрутизации трафика к белому IP добавляется порт, который уточняет, к какому именно устройству сети и с каким "внутренним" IP направить эти пакеты.
+
+## Простыми словами для экзамена
+
+IP-адрес отвечает на вопрос: "на какой узел сети нужно доставить пакет?". В вебе это похоже на адрес дома: домен `example.com` сначала через [[DNS]] превращается в IP-адрес, а затем по этому адресу устанавливается соединение.
+
+IPv4 записывается как четыре числа от `0` до `255`, например `192.168.1.10`. Внутри это 32 бита. IPv6 длиннее: 128 бит, записывается шестнадцатеричными блоками, например `2001:db8::1`.
+
+Важно различать:
+
+- публичный IP — маршрутизируется в интернете;
+- приватный IP — используется внутри локальных сетей: `10.0.0.0/8`, `172.16.0.0/12`, `192.168.0.0/16`;
+- `127.0.0.1` или `localhost` — обращение к самому себе.
+
+Один IP указывает устройство или интерфейс, но не конкретное приложение. За приложение отвечает [[Сетевые порты|порт]].

90 Library/Networking/Протоколы/URI, URL, URN.md

@@ -1,10 +1,10 @@
 ---
 title: URI, URL, URN
-status: seed
+status: processing
 type: concept
 tags: [web, network, networking, uri, url, urn]
 created: 2026-06-04
-updated: 2026-06-04
+updated: 2026-06-05
 source: "[[00_базовые_понятия.pdf]]"
 aliases:
 - URI, URL, URN
@@ -68,6 +68,28 @@ URI (Uniform Resource Identifier) — общий идентификатор ре
 
 Главное правило: все URL являются URI, но не все URI являются URL.
 
+## Простыми словами для экзамена
+
+Самая короткая схема:
+
+- URI — любой идентификатор ресурса.
+- URL — URI, который говорит, где ресурс лежит и как его получить.
+- URN — URI, который даёт устойчивое имя, но не обязательно говорит, где ресурс скачать.
+
+Пример URL:
+
+```text
+https://example.com/articles/1?print=true#comments
+```
+
+В нём:
+
+- `https` — схема;
+- `example.com` — хост;
+- `/articles/1` — путь;
+- `?print=true` — параметры запроса;
+- `#comments` — фрагмент внутри страницы.
+
 ## Связи
 
 - [[HTTP, HTTPS и HTTP3]]

90 Library/Networking/Сетевые порты.md

@@ -1,10 +1,10 @@
 ---
 title: Сетевые порты
-status: seed
+status: processing
 type: concept
 tags: [network, networking, ports, tcp, udp, web]
 created: 2026-06-04
-updated: 2026-06-04
+updated: 2026-06-05
 source: "[[00_базовые_понятия.pdf]]"
 aliases:
 - Сетевые порты
@@ -46,6 +46,23 @@ aliases:
 | `3389` | RDP |
 | `8080` | альтернативный HTTP |
 
+## Простыми словами для экзамена
+
+IP-адрес выбирает компьютер, порт выбирает программу на этом компьютере.
+
+Пример: сервер имеет IP `203.0.113.10`.
+
+- `203.0.113.10:80` — обычный HTTP.
+- `203.0.113.10:443` — HTTPS.
+- `203.0.113.10:22` — SSH.
+
+Если в URL порт не указан, браузер берёт порт по схеме:
+
+- `http://example.com` → порт `80`;
+- `https://example.com` → порт `443`.
+
+Порт клиента обычно временный и выбирается автоматически. Порт сервера обычно известный и заранее открыт сервисом.
+
 ## Связи
 
 - [[HTTP, HTTPS и HTTP3]]

90 Library/Programming/Web/Адаптивность, Flexbox и Grid.md

@@ -1,5 +1,5 @@
 ---
-status: seed
+status: processing
 type: concept
 tags:
 - css
@@ -8,7 +8,7 @@ tags:
 - adaptive-design
 - responsive-web
 created: 2026-05-30
-updated: 2026-05-31
+updated: 2026-06-05
 source:
 - '[[14-css-adaptive.pdf]]'
 - '[[17-css-grid.pdf]]'
@@ -46,6 +46,13 @@ aliases:
     - `flex-basis` (базовый размер),
     - `order` (порядок отображения).
 
+Главная ось зависит от `flex-direction`:
+
+- `row` — главная ось горизонтальная;
+- `column` — главная ось вертикальная.
+
+`justify-content` выравнивает по главной оси. `align-items` выравнивает по поперечной оси. Значение `align-items` по умолчанию — `stretch`.
+
 ---
 
 # Grid Layout
@@ -56,6 +63,8 @@ aliases:
     - `grid-template-columns: repeat(3, 1fr);` (3 колонки равной ширины).
     - `grid-template-rows: auto 1fr;`.
 - **Единица fr:** Доля свободного пространства.
+- **Функция `repeat`:** сокращает повторяющиеся колонки или строки.
+- **Функция `minmax`:** задаёт минимальный и максимальный размер трека.
 - **Отступы:** `gap: 10px;`.
 - **Размещение элементов:**
     - `grid-column: 1 / 3;` (от 1-й до 3-й линии).
@@ -76,3 +85,42 @@ header { grid-area: header; }
 # Сравнение Flex и Grid
 - **Flexbox:** Лучше для одномерных структур (меню, тулбары) и распределения пространства между элементами.
 - **Grid:** Лучше для сложных макетов всей страницы, перекрытия элементов и точного контроля над строками и столбцами одновременно.
+
+## Простыми словами для экзамена
+
+Flexbox — раскладка в одном направлении: строка или колонка. Grid — раскладка сразу по двум направлениям: строки и столбцы.
+
+Flex-контейнер создаётся так:
+
+```css
+.menu {
+  display: flex;
+}
+```
+
+Строчный flex-контейнер:
+
+```css
+.menu {
+  display: inline-flex;
+}
+```
+
+Grid-контейнер:
+
+```css
+.layout {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-template-rows: auto minmax(200px, 1fr);
+}
+```
+
+Термины Grid:
+
+- grid lines — линии сетки;
+- grid tracks — строки или столбцы между линиями;
+- grid cells — ячейки;
+- grid areas — именованные области.
+
+`fr` делит свободное место. `1fr 2fr` означает: второй столбец получит в два раза больше свободного места, чем первый.

90 Library/Programming/Web/Основы HTML (структура, таблицы, формы).md

@@ -8,7 +8,7 @@ tags:
 - tables
 - forms
 created: 2026-05-30
-updated: 2026-05-30
+updated: 2026-06-05
 title: "Основы HTML (структура, таблицы, формы)"
 source:
 - '[[10-html_основы_НП.pdf]]'
@@ -273,3 +273,42 @@ HTML-валидация работает в браузере до отправк
   <button type="submit">Зарегистрироваться</button>
 </form>
 ```
+
+## Простыми словами для экзамена
+
+### Документ и `head`
+
+`<head>` хранит служебную информацию, а не видимый контент. Там обычно находятся:
+
+- `<meta charset="UTF-8">`;
+- `<meta name="viewport" content="width=device-width, initial-scale=1.0">`;
+- `<title>`;
+- `<link rel="stylesheet" href="...">`;
+- `<script src="..."></script>`.
+
+`viewport` особенно важен для мобильных устройств: без него страница может отображаться как уменьшенная десктопная версия.
+
+### Нормальный поток
+
+Нормальный поток — это стандартный порядок раскладки элементов без `position`, `flex`, `grid` и других специальных режимов. Блочные элементы идут сверху вниз, строчные элементы идут внутри строки слева направо.
+
+### Пробелы и переносы
+
+В обычном HTML несколько пробелов подряд схлопываются в один. Перенос строки в коде тоже обычно становится пробелом. Для явного переноса используют `<br>`, но абзацы лучше разделять через `<p>`.
+
+### Формы
+
+`id` нужен для связи с `label` и для уникального обращения к элементу. `name` нужен серверу: именно под этим именем значение поля уходит в запросе.
+
+```html
+<label for="email">Email</label>
+<input id="email" name="email" type="email" required>
+```
+
+`radio` выбирает один вариант из группы с одинаковым `name`. `checkbox` подходит для независимых флажков, где можно выбрать несколько вариантов.
+
+У `<button>` лучше явно указывать `type`:
+
+- `type="submit"` — отправляет форму;
+- `type="button"` — обычная кнопка;
+- `type="reset"` — сбрасывает форму.

90 Library/Programming/Web/Основы, селекторы и блочная модель.md

@@ -1,5 +1,5 @@
 ---
-status: seed
+status: processing
 type: concept
 tags:
   - css
@@ -7,7 +7,7 @@ tags:
   - selectors
   - box-model
 created: 2026-05-30
-updated: 2026-05-31
+updated: 2026-06-05
 source:
   - "[[12-css-базовые_свойства.pdf]]"
   - "[[12-css-блочная_модель.pdf]]"
@@ -46,6 +46,23 @@ aliases:
 3. Классы, атрибуты, псевдоклассы (0, 0, 1, 0)
 4. Теги и псевдоэлементы (0, 0, 0, 1)
 
+Пример:
+
+```css
+body .content { color: red; }
+div p { color: blue; }
+```
+
+`body .content` сильнее, потому что содержит класс `.content`. Класс весит больше, чем селектор элемента.
+
+Короткое правило:
+
+- `#id` сильнее `.class`;
+- `.class` сильнее `div`;
+- если специфичность одинаковая, побеждает правило, которое написано ниже.
+
+Наследование — это когда дочерний элемент получает значение свойства от родителя, например `font-family` или `color`. Не все свойства наследуются: `margin`, `padding`, `border`, `width` обычно не наследуются.
+
 ---
 
 # Блочная модель (Box Model)
@@ -61,6 +78,17 @@ aliases:
 - `content-box` (по умолчанию): `width` задает только ширину контента.
 - `border-box`: `width` включает в себя `padding` и `border`.
 
+Если задано:
+
+```css
+width: 100px;
+padding: 10px;
+border: 5px solid;
+box-sizing: border-box;
+```
+
+Реальная ширина блока останется `100px`: внутрь этой ширины войдут контент, `padding` и `border`.
+
 # Свойство display
 - `block`: Занимает всю ширину, начинается с новой строки.
 - `inline`: Ширина по контенту, не позволяет задавать `width/height`.
@@ -88,4 +116,22 @@ aliases:
 - `border: 1px solid black;`.
 - `border-radius: 5px;` (скругление углов).
 - `box-shadow: x y blur spread color;`.
+- `text-shadow: x y blur color;` — тень текста.
 - `transition: 0.3s;` (плавные переходы).
+
+## Простыми словами для экзамена
+
+CSS выбирает элементы селекторами и применяет к ним свойства. Если несколько правил спорят за одно свойство, решают каскад, специфичность и порядок.
+
+Частые селекторы:
+
+- `*` — все элементы;
+- `p` — все `<p>`;
+- `.card` — элементы с классом `card`;
+- `#main` — элемент с id `main`;
+- `article p` — все `p` внутри `article`;
+- `article > p` — только прямые дочерние `p`;
+- `h2 + p` — первый соседний `p` сразу после `h2`;
+- `input[required]` — поля с атрибутом `required`.
+
+Для текста часто нужны: `font-family`, `font-size`, `font-weight`, `font-style`, `text-align`, `text-decoration`, `line-height`, `letter-spacing`, `text-shadow`.