ReactJS - это front-end библиотека JavaScript с открытым исходным кодом. Помимо работы на NodeJS, ReactJS также разработан как UI для приложений JavaScript. Сама ReactJS была создана Facebook, которая отвечает за развитие внешнего вида и логического потока веб-приложений. В этой статье я покажу вам, как установить ReactJS на Ubuntu 24.04.

Предварительные условия

  • Сервер под управлением Ubuntu 24.04 или любой другой ОС Linux.
  • Привилегии пользователя: пользователь root или не root с привилегиями sudo.

Конвенции

1
2

# — данные команды должны выполняться с правами root либо непосредственно от имени пользователя root, либо с помощью команды sudo.
$ – данные команды должны выполняться от имени обычного пользователя

Шаг 1. Обновите систему

Мы предполагаем, что у вас установлена ​​новая версия Ubuntu 24.04. Нам необходимо обновить системные пакеты до последних доступных версий. Для этого выполните следующие команды:

1

sudo apt update -y && sudo apt upgrade -y

Система может нуждаться в перезагрузке после обновления.

1

sudo reboot -f

Шаг 2. Установите NodeJS

Для этого урока мы собираемся установить последнюю версию LTS NodeJS.

1

curl -fsSL https://deb.nodesource.com/setup_22.x | sudo -E bash -

Далее нам необходимо обновить информацию о пакете системы:

1

sudo apt update

Наконец, мы можем установить Node.js:

1

sudo apt install nodejs -y

Вы успешно установили LTS-версию Node.js.

Шаг 3. Установка ReactJS

Команда React официально депрецировала приложение Create React App (create-react-app) 14 февраля 2025 года. Существуют альтернативные инструменты для создания-реакт-приложение, такие как Vite, Next.js или Gatsby. В этой статье я покажу вам, как установить ReactJS с помощью Vite.

1

npm create vite@latest my-react-app

После выполнения команды выше, вам будет предложено несколько вопросов. Вас попросят выбрать, какой фреймворк, используйте вашу клавиатуру, выберите React и нажмите ENTER, чтобы продолжить.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

│
◆  Select a framework:
│  ○ Vanilla
│  ○ Vue
│  ● React
│  ○ Preact
│  ○ Lit
│  ○ Svelte
│  ○ Solid
│  ○ Qwik
│  ○ Angular
│  ○ Marko
│  ○ Others
└

Затем вам нужно будет выбрать вариант. Vite предлагает несколько вариантов React при запуске npm create vite@latest и выбрать React:

Далее выбирает JavaScript + React Compiler, используйте вашу клавиатуру для ее выбора, а затем нажмите ENTER. Затем выберите NO, когда он просит использовать rolldown-vite и дважды нажмите по ENTER.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19

> npx
> create-vite my-react-app

│
◇  Select a framework:
│  React
│
◇  Select a variant:
│  JavaScript + React Compiler
│
◇  Use rolldown-vite (Experimental)?:
│  No
│
◇  Install with npm and start now?
│  Yes
│
◇  Scaffolding project in /root/my-react-app...
│
◇  Installing dependencies with npm...

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

1
2
3
4
5

 VITE v7.2.7  ready in 641 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help

На данный момент вы должны иметь возможность получить доступ к http://localhost:5173

Вы можете закрыть его, нажав q затем ENTER

Теперь, если вы хотите, чтобы сервис слушал не только на localhost, вы можете запустить эту команду:

1
2

cd my-react-app
npm run dev -- --host

На данный момент вы должны иметь возможность получить доступ к http://localhost:5173

Шаг 4. Создание системного сервиса

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

1

sudo nano /etc/systemd/system/reactjs.service

Затем добавьте в файл следующее содержимое:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

[Unit]
Description=My Vite React App Service
After=network.target

[Service]
User=root
WorkingDirectory=/root/my-react-app2
ExecStart=/usr/bin/npm run dev -- --host
Restart=always
StandardOutput=syslog
StandardError=syslog
SyslogIdentifier=my-react-app

[Install]
WantedBy=multi-user.target

Сохраните и закройте файл, затем выйти из редактора и перезагрузите демон с командой ниже:

1
2
3
4

sudo systemctl daemon-reload
sudo systemctl start react.service
sudo systemctl enable react.service
sudo systemctl status react.service

Завершение

Поздравляю! Вы успешно установили ReactJS на своем Ubuntu 24.04 VPS. Для получения дополнительной информации о ReactJS, пожалуйста, обратитесь к веб-сайту ReactJS.

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