React Js: Как установить и создать приложение React в Windows 10

В этом примере руководства вы узнаете, как установить приложение React и создать первое приложение в Windows 10.

В этом руководстве вы шаг за шагом узнаете, как установить инструмент create-react-app с помощью Node Package Manager (NPM). Create-react-app - это инструмент, разработанный командой React.js, который упрощает настройку React в нашей системе.

Прежде всего, необходимо установить Node.js в нашей системе Windows 10. Итак, следуйте инструкциям по загрузке установщика Node.js для Windows 10. Давайте воспользуемся последней версией долгосрочной поддержки (LTS) для Windows и выберем 64-разрядную версию с помощью иконки установщика Windows.

Текущую стабильную версию Node.js можно загрузить и установить с официального сайта node.js, который указан ниже.

https://nodejs.org/

Скачайте последнюю версию и установите ее. Вы можете выбрать LTS или последнюю версию.

После завершения установки node js откройте свой терминал и выполните следующую команду, чтобы проверить версии node js и npm:

node -v
npm -v

Как установить React JS с помощью приложения Create React в Windows 10

Есть два способа установить React и создать проекты. Вы можете поступить следующим образом: 

Способ 1

Шаг 1 - Создайте каталог

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

mkdir first-react-app

Шаг 2 - Перейдите в папку проекта

Затем перейдите в каталог, откройте терминал и выполните следующую команду: 

cd first-react-app

Шаг 3 - Создайте файл package.json

На этом этапе следующая команда проведет вас через создание файла package.json

npm init

Шаг 4 - Установите React и другие модули

На этом шаге выполните следующие команды, чтобы установить React в вашем приложении Windows 10: 

npm install --save react

npm install --save react-dom

Способ 2

Шаг 1. Установите инструмент Create-React-App

Нам нужно установить инструмент с именем create-response-app, использующий NPM как глобальный. Этот инструмент используется для простого создания приложений React из нашей системы. 

npm install -g create-react-app

Шаг 2 - Создание нового проекта React

После успешной установки create-react-app мы можем создать наше первое приложение.

create-react-app first-react-project

Здесь first-react-project - это имя, которое я выбрал для своего нового проекта. 

Шаг 3 - Запуск приложения

Созданное нами приложение может запускаться локально в нашей системе с помощью команды npm start. 

cd first-react-project
npm start

Это откроет приложение для React на новой вкладке нашего браузера с указанным ниже URL-адресом. 

http://localhost:3000/