Урок 4.4 — Деплой на Render: бесплатный хостинг за 5 минут

Зачем: Сайт который работает только на твоём компьютере — не сайт. Render даёт бесплатный хостинг, деплоится автоматически при каждом изменении в GitHub.


Render vs Vercel — что выбрать

RenderVercel
Бесплатный план✅ Есть✅ Есть
Next.js✅ Оптимизирован
Простые сайты / HTML✅ ОтличноХуже
Python / Flask / FastAPI✅ Да❌ Нет
Базы данных (PostgreSQL)✅ ВстроеноЧерез внешний сервис
Автодеплой из GitHub

Правило:

  • Next.js проект → Vercel (оптимизирован специально)
  • Всё остальное → Render

Деплой на Render — пошагово

Шаг 1 — Загрузи проект на GitHub

git init
git add .
git commit -m "first commit"
git remote add origin https://github.com/[твой-аккаунт]/[название].git
git push -u origin main

Шаг 2 — Подключи Render

  1. Открой render.com → зарегистрируйся
  2. «New +» → выбери тип сервиса:
    • Static Site — HTML/CSS/JS без бэкенда
    • Web Service — Next.js, Python, Node.js с сервером
  3. Подключи GitHub репозиторий
  4. Укажи команду сборки и папку вывода:
# Для Next.js:
Build Command: npm run build
Publish Directory: .next

# Для статичного HTML:
Build Command: (оставь пустым)
Publish Directory: ./  или  ./public

Шаг 3 — Deploy

Нажми «Create Service» → Render сам собирает и деплоит. Через 2–3 минуты — живая ссылка вида your-app.onrender.com


Автоматический деплой

После подключения — каждый git push автоматически деплоит новую версию. Правишь → пушишь → через пару минут изменения видны по ссылке.


Бесплатный план — важно знать

На бесплатном Render сервис «засыпает» после 15 минут бездействия. Первый запрос после паузы — медленный (30–60 сек). Для внутренних инструментов команды — нормально. Для публичного сайта — нужен платный план.


Промт для Claude Code — подготовка к деплою

Проект готов к деплою на Render как [Static Site / Web Service].

Проверь и исправь если нужно:
1. В package.json есть скрипт "build" и "start"?
2. Порт берётся из переменной окружения PORT?
   (process.env.PORT || 3000)
3. Все API-ключи в .env файле, не в коде?
4. .env добавлен в .gitignore?

Если что-то не так — исправь.

Проверь себя

Закрой страницу и ответь

  1. Когда использовать Render а когда Vercel?
  2. Какие три шага нужны для деплоя на Render?
  3. Что происходит автоматически после каждого git push?

Действие

Задеплой свой проект на Render или Vercel. Скопируй живую ссылку и отправь в claude-wins.


← Lesson 4.3 · Lesson 4.5 →