Личный курс

Фундамент веб-разработки

Понимать, как устроено веб-приложение целиком — чтобы уверенно управлять ИИ-агентом: где живут данные, где прячутся риски, что такое React / Next / Vite / TypeScript и когда что применять.

Для кого: для того, кто собирает приложения через ИИ-агента и хочет принимать решения осознанно, а не на веру. Без написания кода — только концепции, термины, решения и риски.

Программа

7 блоков — это большие темы. Внутри каждого блока несколько коротких уроков. Можно идти по порядку, можно прыгать.

Блок 1

Как устроен веб

7 уроков
Урок 1 Сайт или веб-приложение?Что строим: читаемый сайт или приложение с данными → Урок 2 Как работает веб целикомПуть запроса, клиент/сервер, где выполняется код → Урок 3 HTTP: язык браузера и сервераЗапрос и ответ, методы GET / POST / PUT / DELETE → Урок 4 Статус-коды: 200, 404, 500Что означают ответы сервера и чья это «вина» → Урок 5 Анатомия URLИз чего состоит адрес: домен, путь, query, порт → Урок 6 HTML, CSS, JavaScript — три ролиТри слоя страницы: структура, вид, поведение → Урок 7 DOM — живое дерево страницыЧем DOM отличается от HTML и что меняет JavaScript →
Блок 2

Где живут данные

5 уроков
Урок 1 Состояние: живая память приложенияЧто приложение помнит сейчас и почему это исчезает при перезагрузке → Урок 2 Хранилище браузера: localStorage и кукиЧто переживает перезагрузку и почему вход «не виден» на другом устройстве → Урок 3 База данных: SQL или NoSQLГде данные живут надолго и что стоит за выбором базы → Урок 4 Модель данных и ORMЧертёж данных и «переводчик» между кодом и базой → Урок 5 Почему данные пропадаютДиагностика: на каком из трёх уровней лежали данные →
Блок 3

Как приложения общаются

4 урока
Урок 1 API и эндпоинтКак одна программа просит данные у другой → Урок 2 JSON — формат обмена даннымиОбщий язык фронтенда, бэкенда и чужих API → Урок 3 REST: ресурсы, методы, статус-кодыСоглашения, по которым устроено почти любое API → Урок 4 Чужие API на практикеКлючи, лимиты и деньги, вебхуки, «CORS blocked» →
Блок 4

Фронтенд-слой

7 уроков
Урок 1 React / Next / Vite — что и когдаИз чего собран интерфейс и выбор инструментов → Урок 2 Компонент и пропсыПереиспользуемые кубики интерфейса и их настройка → Урок 3 Состояние и реактивностьПочему интерфейс сам обновляется при изменении данных → Урок 4 TypeScript: зачем типыЧто он ловит до запуска и когда оправдан → Урок 5 Оформление: Tailwind и UI-библиотекиТри подхода к стилям и красивый результат без дизайнера → Урок 6 Рендеринг: CSR / SSR / SSGГде собирается страница и при чём тут SEO → Урок 7 Next подробно: сервер и клиентСерверные и клиентские компоненты, когда Next не нужен →
Блок 5

Секреты и безопасность

4 урока
Урок 1 Секреты и переменные окруженияПочему ключи не пишут в коде и что такое .env → Урок 2 Аутентификация и авторизацияКто ты, что тебе можно и как вход помнят → Урок 3 Готовый вход и HTTPSНе изобретайте логин и шифрование — берите проверенное → Урок 4 Валидация и топ-уязвимостиНе доверяй вводу; где вайб-кодеры горят чаще всего →
Блок 6

Доставка

4 урока
Урок 1 Две среды: разработка и продЧем «у меня на компьютере» отличается от «в интернете для людей» → Урок 2 Где живёт прод: хостинг и базаСтатика, свой сервер, serverless и managed-база простыми словами → Урок 3 Домен, DNS и SSL на практикеКрасивый адрес, как его находят и откуда «замочек» → Урок 4 Доставка кода и наблюдениеCI/CD, логи и мониторинг: как код едет в прод и как за ним следить →
Блок 7

Работа с агентом и ремесло

4 урока
Урок 1 Git и откат: машина времени для кодаСохранять версии, откатываться — и где отката уже нет → Урок 2 Зависимости: чужие детали в проектеnpm-пакеты, package.json и почему у всего есть версии → Урок 3 Читать ошибки и писать баг-репортГде смотреть при сбое и как описать проблему агенту → Урок 4 Ставить ТЗ и принимать работуПоставить задачу и проверить результат — финал курса 🎉 →
📖 Словарь курсаСправочник терминов — растёт от урока к уроку