О чем эта статья
В этой статье вы узнаете, как подготовить сервер на Ubuntu 20.04 и затем развернуть на нем приложение ReactOS совместно с веб-сервером Nginx.
В Serverspace вы можете создать сервер с уже установленным приложением Nginx.
Что важно знать перед установкой
Чтобы вы могли установить приложение React на свой сервер, должны быть выполнены следующие требования:
- Ваш сервер должен работать под управлением современной операционной системы семейства Linux, например Ubuntu 20.04
- У вас должен быть root-доступ или ваш пользователь должен входить в группу sudo
- Также понадобится доменное имя с корректными настройками DNS. A-записи домена должны быть "направлены" на "внешний" IP-адрес вашего сервера.
Процесс установки
- Первый этап - авторизация от имени привилегированной учетной записи и установка NodeJS:
sudo -s
apt install nodejs npm -y
- Следующий шаг — установка пакета npx. Выполните команду:
npm i -g npx -y
- Для "промежуточной" проверки того, что все установилось корректно, дайте следующие команды:
node -v
npm -v
npx -v
Об успехе свидетельствует картина наподобие изображенной ниже:
- Первое react-приложение создается очень просто, буквально одной строкой:
npx create-react-app <ИМЯ_ПРИЛОЖЕНИЯ>
Процесс может занять некоторое время, будьте терпеливы. В итоге вы увидите что-то вроде изображения ниже и можно будет перейти к следующему разделу:
Установка веб-сервера
- Для удобной работы с только что созданным приложением понадобится любой современный веб-сервер, проиллюстрирую на примере Nginx. Чтобы установить его, выполните команду:
apt install -y nginx
- Создайте минимально необходимое описание конфигурации вашего веб-сайта:
cat <<EOF > /etc/nginx/sites-enabled/<ДОМЕННОЕ_ИМЯ>
server {
listen 80;
root /var/www/<ДОМЕННОЕ_ИМЯ>;
index index.php index.html;
server_name <ДОМЕННОЕ_ИМЯ> www.<ДОМЕННОЕ_ИМЯ>;
location / {
}
}
EOF
Первый запуск приложения
- Для инициализации вашего приложения потребуется дать команды:
cd /home/<ИМЯ_ПОЛЬЗОВАТЕЛЯ>/<КАТАЛОГ_ПРИЛОЖЕНИЯ>
npm start
В идеале вы должны увидеть что-то похожее на картинку ниже:
- Откройте в браузере адрес http://<IP_ВАШЕГО_СЕРВЕРА>:3000:
Если вы увидели в браузере страницу наподобие показанной выше, можете остановить работу приложения, нажав CTRL+C в SSH-консоли и переходите к следующему шагу.
- Перейдите в каталог с файлами вашего приложения и запустите процесс компиляции:
cd /home/<ИМЯ_ПОЛЬЗОВАТЕЛЯ>/<КАТАЛОГ_ПРИЛОЖЕНИЯ>
npm run build
Немного подождите. Об успехе процедуры свидетельствует картина наподобие изображенной на скриншоте:
- Теперь можно поместить скомпилированные файлы в директорию вашего сайта и перезапустить веб-сервер:
mkdir /var/www/<ДОМЕННОЕ_ИМЯ> && cp /home/<ИМЯ_ПОЛЬЗОВАТЕЛЯ>/<КАТАЛОГ_ПРИЛОЖЕНИЯ>/build/* /var/www/<ДОМЕННОЕ_ИМЯ>
systemctl enable nginx && service nginx restart
Финальная проверка
Чтобы проверить результат, просто откройте свой сайт в браузере. Об успехе свидетельствует такая страница:
Заключение
В этой статье мы описали, как установить NodeJS, создать свое первое приложение и развернуть его на своем веб-сайте с помощью веб-сервера Nginx.
