# Как выложить React-приложение в интернет

https://netrun.io/blog/react-prilozhenie

_5 октября 2026 г. · 3 мин чтения_

> Чтобы выложить React-приложение в интернет, загрузите код с package.json и скриптом сборки — без папки node_modules и без готовой сборки. Netrun распознает React, сам выполнит сборку на Vite, Create React App или другом сборщике и раздаст готовые файлы по ссылке с HTTPS. Новая версия публикуется обновлением кода по тому же адресу.

- React-приложение после сборки — это набор статических файлов: HTML, JavaScript и CSS.
- Netrun выполняет сборку сам, поэтому папку node_modules и готовую сборку загружать не нужно.
- Подходят проекты на Vite, Create React App и других сборщиках, если в package.json есть скрипт сборки.
- Переменные окружения подставляются во фронтенд-код при сборке, поэтому секретный ключ в React-приложении может прочитать любой посетитель.
- Так же публикуются приложения на Vue, Svelte и других фронтенд-фреймворках.

Обычно, чтобы показать React-приложение миру, нужно собрать его командой сборки, залить готовую папку на хостинг и настроить, чтобы маршруты работали правильно. Несколько шагов, на которых легко ошибиться.

Netrun сам определит, что это React, соберет проект и раздаст его по ссылке. От вас — только код. Разберем по шагам.

## 1. Подготовьте проект

Убедитесь, что в проекте есть package.json со скриптом сборки (Vite, Create React App или другой бандлер) и что проект собирается у вас локально.

## 2. Загрузите код в Netrun

ZIP-архивом или импортом из GitHub. Папки node_modules и собранную сборку класть не нужно — мы установим зависимости и соберем проект сами.

## 3. Netrun соберет приложение

Платформа распознает React, выполнит сборку и подготовит готовые файлы к раздаче — настраивать команду сборки вручную не требуется.

## 4. Получите ссылку

После сборки Netrun выдаст публичный адрес с HTTPS, по которому приложение открывается у всех.

## 5. Обновляйте

Чтобы выложить новую версию, обновите код — Netrun пересоберет приложение по тому же адресу.

Так же разворачиваются приложения на Vue, Svelte и других фронтенд- фреймворках. Если код сгенерировала нейросеть — просто загрузите его как есть. [Попробовать Netrun](https://netrun.io/).

## Частые вопросы

### Почему React-приложение не видит переменные окружения?

Сборщики пропускают в браузерный код только переменные с особым префиксом: VITE_ в Vite и REACT_APP_ в Create React App. Значения подставляются во время сборки, поэтому после их изменения проект нужно опубликовать заново.

### Можно ли хранить API-ключ в React-приложении?

Нет, если ключ секретный: все, что попало во фронтенд, можно прочитать в браузере. Запросы с секретным ключом делают через свой бэкенд, где ключ лежит в переменных окружения, а React обращается уже к этому бэкенду.

### Нужно ли загружать папку dist или build?

Нет. Netrun устанавливает зависимости и собирает проект сам, поэтому достаточно исходного кода с package.json. Главное — чтобы проект без ошибок собирался у вас локально той же командой сборки.

### Подойдет ли бесплатный тариф для React-сайта?

Да: на бесплатном тарифе сайт живет сколько угодно, засыпает без посетителей и просыпается сам, когда его открывают. Первое открытие после сна занимает несколько секунд; чтобы сайт не засыпал, нужен тариф Pro.

### Как обновить опубликованное React-приложение?

Загрузите новую версию кода в кабинете — архивом, из GitHub или повторной публикацией из редактора с ИИ, — и Netrun пересоберет приложение по тому же адресу. Автоматической публикации по git push нет.