Развернуть приложение Static React

Это руководство объяснит, как развернуть статическую одностраничную страницу ReactJS приложение на одном из наших общий веб-хостинг или бизнес Учетные записи веб-хостинга.Общий учетная запись веб-хостинга - это идеальное место для развертывания статических приложений для вашего портфолио или для проведения всего самого сайта портфеля разработчика.Это простой способ поставить свой код в Интернете и использовать домен вашего выбора, чтобы ваш портфолио было более профессиональным внешним видом.Чтобы продолжить с этим руководством, вы захотите быть знакомы или уже используют инструмент создания приложений Facebook создать-реагировать-приложение создать свой проект.

Это руководство предназначено только для информационных целей. Пожалуйста, проконсультируйтесь с вашим веб-разработчиком, чтобы поддержать ваш проект разработки, так как это не покрывается HOVENDWINDS STERS of Support.

Прежде, чем мы начнем

Есть несколько других предметов, которые вам нужно будет следовать вместе с этим руководством.

Первый: Вам понадобится общая или общая учетная запись бизнес-хостинга с Hostwinds.
Второй: Вам понадобится приложение React, созданное с помощью create-react-app.
Третий: Вам понадобится FTP-программа вроде FileZilla и уже настроить доступ по FTP в cPanel чтобы продолжить это руководство

Твой компьютер

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

Первый шаг: Измените каталоги в каталог вашего проекта, набрав следующую строку для вашего каталога:

cd /my_projects/my_example_project

Шаг второй: Как только вы окажетесь в каталоге своего проекта, введите:

npm run build

Это создаст производственную сборку вашего проекта React и объединяет необходимые зависимости для работы приложения. Ваши файлы сборки производства будут размещены в новом каталоге в вашей папке проекта, называемой сборкой.

FTP файлы на ваш сервер

Затем вы будете использовать программу FTP для перемещения файлов производства на вашу учетную запись общего хостинга.

Первый шаг: Откройте программу FTP и подключитесь к вашей учетной записи веб-хостинга.

Шаг второй: Если это первый проект, который вы ходите, и скажем, что это главная страница портфеля, например, вы передадите его в корневой каталог вашей учетной записи общего хостинга.По умолчанию Root Document для вашей основной учетной записи веб-хостинга находится в папке назначения на сервере и называется pooke_html.Здесь вы найдете файлы и папки, связанные с вашими основными доменными именами, такими как index.html, в качестве домашней страницы или что-то подобное, если вы уже создали домашнюю страницу для вашего главного сайта.

Шаг третий: Вы будете ориентироваться в программе FTP в папку «Создание в файлах вашего проекта», а затем выберите все файлы в папке «Создать» и выбросить их в правильный каталог в папке Public_HTML на другой стороне графического интерфейса в программе FTP

Шаг четвертый: После завершения передачи файлов, то ваше приложение должно быть немедленно доступно для того, чтобы быть воспитанным, набрав свой домен в строку URL

Шаг пятый: Чтобы развернуть в поддиатанте папки Public_HTML, необходимо будет выполнить дополнительный шаг, прежде чем выполнить вашу сборку. Если вы хотите, чтобы приложение React для отображения из подкаталога необходимо добавить ссылку на домашнюю страницу в файле Package.json для вашего проекта. Без этого страница будет пустой белой, когда она навигация. Требуемая ссылка будет:

"homepage": "https://yourdomain.mn/public_html/bar",

И когда помещается в

package.json

это будет выглядеть так:

После того, как эта ссылка была добавлена, и сборка NPM завершена завершена, вы можете FTP ваши файлы сборки в любом подкаталоге в вашем каталоге pubblic_html, и приложение будет представлять из этого каталога.

Резюме

Возможно и довольно легко развернуть статическое приложение RACT на хостинговой учетной записи HOSTWINDS.Это простое вариант для разработчиков, которые хотят собрать портфолио на своем доменном имени, чтобы иметь более профессиональный веб-сайт.Если вы ищете более продвинутые параметры и иметь полный контроль над конфигурацией сервера, и готовы переместить приложение в производственную среду, мы предлагаем смотреть на наш SSD Cloud VPS Серверы.