← Все новости·2026-08-09·3 мин чтения

Бесплатный шаблон лендинга React для стартапов

Готовый одностраничный шаблон лендинга на React. Агент клонирует репо, заполняет один файл data.json под твой проект — и сайт с героем, преимуществами, командой и контактами готов.

landingvibeuigithubtemplate

Прошу агента сделать лендинг для проекта — и он делает. Технически всё работает. Но выглядит как студенческая работа: блоки съехали, шрифты разные, первый экран пустой и скучный. Агент не виноват — просто у него нет хорошей отправной точки.

React Landing Page Template решает именно это. Бесплатный чистый одностраничный шаблон для стартапов: первый экран с заголовком, блок преимуществ, портфолио, команда и контактная форма. Всё что нужно нормальному лендингу — уже есть и уже оформлено. Больше 1600 звёзд на GitHub, лицензия MIT. И самое главное для вайб-кодера: весь текст — заголовки, описания, имена команды, лейблы фич — лежит в одном файле data.json.

Исходники

issaafalkattan/React-Landing-Page-Template

1 653JavaScript

Открыть на GitHub →

Именно data.json делает этот шаблон удобным для вайб-кодинга. Не нужно понимать как работает React или трогать компоненты. Агент клонирует репо, ты описываешь свой проект — и он просто редактирует этот один файл. Заголовки, подзаголовки, фичи, члены команды, контакты — всё в одном месте. Дизайн остаётся как есть. Меняются только слова.

Как использовать этот шаблон лендинга

Шаг 1: клонировать и установить
git clone https://github.com/issaafalkattan/React-Landing-Page-Template.git
cd React-Landing-Page-Template
yarn
Шаг 2: запустить и посмотреть
yarn start

После этого сайт открывается в браузере по адресу localhost:3000. Можно увидеть весь шаблон с заглушками — стартап «ReactJS» с командой и блоком фич. Задача агента — заменить всё это на реальный контент твоего проекта.

Что сказать агенту

Промпт для агента: кастомизация шаблона
Клонируй https://github.com/issaafalkattan/React-Landing-Page-Template, сделай yarn install и yarn start. Потом открой data.json и замени все заглушки на реальную информацию о моём проекте:
- Название: [название проекта]
- Слоган: [одна строка — что делает проект]
- Преимущества: [перечисли фичи]
- Команда: [если нужна секция с командой — добавь имена]
Структуру не трогай, меняй только текст.

У этого шаблона есть V2 — react-landing-page-template-2021 — на Next.js и Tailwind CSS, если нужно что-то более современное. Тот же автор, та же идея, чуть свежее визуально. Оба бесплатны и с открытым кодом.

Что в итоге

Нормальный лендинг для стартапа — не пустой вывод агента, а готовый одностраничник с дизайном: герой, преимущества, портфолио, команда, форма контактов. Агент делает всю настройку. Ты описываешь проект — он заполняет шаблон. Бесплатно, MIT-лицензия.

Источник: github.com

Бесплатный курс

Хватит читать про ИИ — начни строить с ним

Бесплатный курс Claude Code: свой первый сайт, инструмент или игра — без программирования. Без апсейлов и кросс-сейлов — здесь нечего купить.

Начать →
ЕАЕвгений Арсентьев

Автор

Евгений Арсентьев

PhD · CEO, digital health