Ubuntu 20.04LTSにReactJSをインストールする方法

このチュートリアルでは、Ubuntu 20.04LTSにReactJSをインストールする方法を紹介します。 知らなかった人のために、ReactはWebフロントエンドとUIコンポーネントを作成するためのオープンソースのJavaScriptライブラリです。 それはによって開発され、維持されています Facebook そして開発者の大規模なコミュニティ。 ReactJSは、Webアプリケーションまたはモバイルアプリの開発に使用できます。

この記事は、少なくともLinuxの基本的な知識があり、シェルの使用方法を知っていること、そして最も重要なこととして、自分のVPSでサイトをホストしていることを前提としています。 インストールは非常に簡単で、rootアカウントで実行していることを前提としています。そうでない場合は、 ‘を追加する必要があります。sudo‘root権限を取得するコマンドに。 Ubuntu 20.04（Focal Fossa）にReactJSを段階的にインストールする方法を紹介します。 Ubuntu 18.04、16.04、およびLinuxMintなどの他のDebianベースのディストリビューションでも同じ手順に従うことができます。

Ubuntu 20.04 LTS FocalFossaにReactJSをインストールします

手順1.まず、次のコマンドを実行して、すべてのシステムパッケージが最新であることを確認します。 apt ターミナルのコマンド。

sudo apt update
sudo apt upgrade

ステップ2.Node.jsをインストールします。

次に、Node.jsPPAをUbuntuシステムに追加します。

curl -sL https://deb.nodesource.com/setup_14.x | sudo bash -

次に、次のコマンドを実行してNode.jsをインストールします。

sudo apt install nodejs

UbuntuシステムにYarnパッケージマネージャーをインストールすることもできます。

npm install -g yarn

ステップ3.新しいReact.jsアプリを作成します。

次のいずれかのコマンドを使用して、React.jsアプリケーションを作成できます。

yarn create react-app myreactapp

アプリケーションが正常に作成されると、画面に長い結果が表示されます。

Success! Created reactproject at /opt/reactproject
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd reactproject
  npm start

Reactアプリケーションを作成したら。 これにより、現在のディレクトリにプロジェクト名のフォルダが作成されます。 そのプロジェクトに切り替えて実行します yarn start アプリケーションを起動するには：

cd myreactapp
yarn start

出力：

Compiled successfully!

You can now view myreactapp in the browser.

  https://localhost:3000

Note that the development build is not optimized.
To create a production build, use yarn build.

おめでとう！ これでReactJSが正常にインストールされました。 このチュートリアルを使用して、Ubuntu 20.04 LTS FocalFossaシステムにReactJSをインストールしていただきありがとうございます。 追加のヘルプまたは有用な情報については、チェックすることをお勧めします ReactJSの公式ウェブサイト。

Related Posts