Глава 30. Формы, деплой и финальный проект
Зачем эта глава
Финальная глава соединяет всё вместе: формы, отправку данных, деплой и финальный мини-проект.
Теория (коротко)
В Next.js можно обрабатывать формы через серверные действия (Server Actions) или API.
Для публикации чаще всего используют Vercel или другие хостинги.
"use client";
export default function ContactForm() {
return (
<form>
<input placeholder="Имя" />
<button type="submit">Отправить</button>
</form>
);
}
Важно: перед деплоем проверь адаптивность, ошибки и скорость загрузки.
Типовые требования клиентов
- Адаптивность под телефон.
- Быстрая загрузка.
- Форма заявки или обратной связи.
- Понятная структура страниц.
Чек-лист сдачи
- Все ссылки и кнопки работают.
- Формы отправляются корректно.
- Нет «ломающейся» верстки.
- Есть инструкция для запуска.
Мини-шаблон ТЗ
Цель проекта:
Страницы:
Функции:
Дизайн:
Сроки:
Бюджет:
Критерии сдачи:
Задания
Задание: финальный шаг
- Собери финальный проект (мини-каталог).
- Добавь форму обратной связи.
- Разверни проект на хостинге.
Практика для фриланса
Перед сдачей заказа подготовь: ссылку на деплой, краткую инструкцию, список выполненных задач и список того, что не входит в работу.
Проверка себя
Ты можешь собрать проект целиком и опубликовать его.
Мини-проект
Цель: финальный проект для портфолио.
Требования: главная, каталог, карточка товара, форма заявки.
Критерий готовности: проект работает, выглядит аккуратно и готов для клиента.
Словарь главы
- Деплой
- Публикация проекта в интернет.
- Server Actions
- Способ обрабатывать формы на сервере в Next.js.