Где физически работает ваше приложение в интернете и где живут его данные — три типа хостинга простыми словами.
⏱ ≈ 7 минут🏗 хостинг, прод🎯 цель: выбирать тип хостинга и понимать, зачем нужна managed-база
Зачем это вам
Когда агент говорит «задеплоим на Vercel» или «нужен сервер под бэкенд» — это не технические детали, а решения с конкретными последствиями для цены, скорости и надёжности. Понимая три типа хостинга, вы сможете принять правильное решение сами — и объяснить агенту, чего именно хотите. А знание managed-баз избавит от ситуации «приложение работает, но данные пропали», которую начинающие вайб-кодеры проходят на собственном опыте.
Концепт
Хостинг — это «адрес», по которому живёт ваше приложение
Хостинг (hosting — «размещение») — место, где приложение работает и откуда оно отдаётся пользователям по всему миру. Выбор типа хостинга определяет: нужен ли ваш постоянный сервер, сколько вы платите и как приложение справляется с наплывом пользователей.
Существуют три принципиально разных подхода:
Тип 1
Статический хостинг — раздаёт только готовые файлы (HTML, CSS, JS), без вашего постоянно работающего сервера.1 Подходит для лендингов, портфолио, SPA (Single Page Application — одностраничное приложение без серверной части). Дёшево или бесплатно, очень быстро.
VercelNetlifyGitHub PagesCloudflare Pages
Тип 2
Свой сервер (постоянный) — ваша программа работает круглосуточно на арендованной машине (VPS — Virtual Private Server, виртуальный сервер). Полный контроль, нужен для тяжёлого или постоянного бэкенда.
VPSRenderRailwayDocker
Тип 3
Serverless («бессерверный» — для вас) — ваш код запускается по запросу как отдельная функция.2 Платите только за фактические вызовы, масштаб регулируется автоматически. «Бессерверный» не значит, что сервера нет физически, — просто им управляет провайдер, а не вы.
Vercel FunctionsAWS LambdaCloudflare Workers
База данных в проде. Локальная тестовая база (та, что запущена у вас на компьютере во время разработки) для боевой версии не годится: она недоступна пользователям из интернета, нет бэкапов (резервных копий), нет гарантий доступности. Вместо неё берут managed-базу (хостинг БД под ключ) — провайдер хранит данные, делает резервные копии и держит базу доступной 24/7.3 Приложение подключается к ней по строке подключения — это секрет, он хранится в .env (вы разбирали это в Блоке 5).
📌 Главный ориентир: если приложение только отдаёт готовые файлы без своей логики — достаточно статического хостинга. Если есть API, обработка данных, авторизация — нужен сервер или serverless. Если нужно хранить данные пользователей — добавляем managed-базу.
Аналогия, которую можно пересказать
«Аренда помещения под бизнес»
«Витрина с готовой вывеской»— статический хостинг: прохожие видят товар, «персонала» внутри нет. Дёшево, быстро, только показать готовое.
«Магазин с продавцом 24/7»— свой сервер: арендованный зал с продавцом за прилавком круглосуточно. Всё под вашим контролем, но платите за помещение постоянно.
«Зал по факту прихода клиентов»— serverless: пришла толпа — выделили больше места; никого нет — за простой не платите. Масштабируется сам.
«Охраняемый склад рядом»— managed-база: товар (данные) хранят и стерегут профессионалы, делают инвентаризацию (бэкапы). Вы только подключаетесь.
Как и с помещением, выбор зависит от масштаба и характера бизнеса: маленький лендинг не требует магазина с продавцом, но серьёзный продукт с пользователями уже требует «склада» для их данных.
Запомните одно
Тип хостинга = тип вашей задачи
Статика → только готовые файлы. Сервер → постоянная логика. Serverless → логика по запросу. Managed-база → данные пользователей в бою. Эти четыре варианта покрывают 95% сценариев вайб-кодера.
Что это даёт на практике
Фраза агента → что он имеет в виду
«Задеплоим на Vercel / Netlify»
Разместим приложение на статическом или serverless-хостинге. Бесплатно или дёшево, деплой автоматический при каждом пуше в git.
«Это статика»
Приложение состоит только из готовых файлов: HTML, CSS, JS. Серверная логика не нужна — значит, самый дешёвый и быстрый хостинг.
«Нужен сервер под бэкенд»
Есть постоянно работающая программа (API, обработка данных). Берём VPS, Render или Railway — машина крутится круглосуточно.
«Подключим managed-базу (Supabase / Neon)»
Вместо локальной тестовой базы ставим боевую под ключ. Провайдер сам хранит данные, делает бэкапы и следит за доступностью.
Хостинг (hosting) — место, где приложение работает и откуда отдаётся пользователям.
Статический хостинг — раздаёт готовые файлы без своего постоянного сервера (Vercel, Netlify, GitHub Pages).
Serverless — код запускается по запросу как функция; плата за фактические вызовы, масштаб — автоматически (AWS Lambda, Vercel Functions, Cloudflare Workers).
Managed-база (хостинг БД) — база данных под ключ: хранение, резервные копии, доступность — на стороне провайдера (Supabase, Neon, PlanetScale).
Проверьте себя
Четыре вопроса с мгновенной проверкой
1. Что такое хостинг?
Верно. Хостинг — это «адрес» приложения в интернете: там оно запускается и оттуда отдаёт страницы пользователям по всему миру.
2. Что значит serverless («бессерверный»)?
Верно. «Бессерверный» означает, что физического сервера нет у вас под управлением — провайдер запускает вашу функцию только тогда, когда поступает запрос, и берёт деньги именно за эти вызовы.
3. Почему для прода берут managed-базу, а не локальную тестовую?
Верно. Локальная база работает только на вашем компьютере: пользователям из интернета к ней не добраться, бэкапов нет, доступность не гарантирована. Managed-база решает все три проблемы.
4. Для простого лендинга без бэкенда — чего достаточно?
Верно. Лендинг без бэкенда — это просто набор готовых файлов. Статический хостинг (Netlify, GitHub Pages) раздаёт их пользователям дёшево и очень быстро, постоянный сервер здесь излишество.
Куда мы идём
Программа курса — 7 блоков
1Как устроен вебСайт/приложение, HTTP, URL, DOM✓ есть
2Где живут данныеСостояние, хранилище, база данных✓ есть
3Как приложения общаютсяAPI, JSON, REST✓ есть
4Фронтенд-слойReact / Next / Vite, компоненты✓ есть
5Секреты и безопасностьГде вайб-кодеры горят чаще всего✓ есть
6Доставкаdev/prod, хостинг, домен/DNS/SSLВы здесь · урок 2 из 4✓ идём