React アプリを作成するには?インストールと環境設定

React を使用してアプリケーションの構築を開始する前に、適切な開発環境を用意することが重要です。ここでは、開始に役立つステップバイステップのガイドを示します:

ステップ 1. Node.js と npm をインストールします

React 環境をセットアップする最初のステップは、Node.js をインストールすることです。Node.js は、ブラウザーの外でコードを実行するために必要な JavaScript ランタイムを提供します。 Node.js をインストールすると、プロジェクト内の依存関係を管理するために不可欠な npm (Node Package Manager) がバンドルされます。 Node.js をダウンロードするには、公式 Web サイトにアクセスし、お使いのシステムに適したバージョンを選択してください。

ステップ 2. Create React App (CRA) を使用して新しい React プロジェクトをセットアップする

React は、Create React App (CRA) と呼ばれる公式ツールを提供しています。これにより、事前構成された環境で新しいプロジェクトを作成するプロセスが簡素化されます。 CRA が webpack、Babel、その他の必要なツールのセットアップを処理するため、コーディングに集中できます。新しい React プロジェクトを作成するには、ターミナルを開いて次のコマンドを実行します:

npx create-react-app my-react-app

ここで、my-react-app をプロジェクトに使用する任意の名前に置き換えることができます。これにより、基本的な React プロジェクトに必要なすべてのファイルとフォルダーが生成されます。

ステップ 3. プロジェクト フォルダーに移動します

React プロジェクトが作成されたら、プロジェクト フォルダーに移動して開発を開始します。次のコマンドを使用して、新しく作成したプロジェクト ディレクトリに移動します:

cd my-react-app

ステップ 4. React アプリケーションを起動して実行します

プロジェクトのセットアップが完了したので、開発サーバーを起動して React アプリケーションの動作を確認できます。プロジェクト ディレクトリ内で次のコマンドを実行します:

npm 開始

このコマンドは開発サーバーを起動し、デフォルトのブラウザを自動的に開いてアプリケーションを表示します。

デフォルトでは、アプリは http://localhost:3000 で実行されます。開発サーバーはホット リロードを提供します。つまり、コードに加えた変更は、ページを手動で更新しなくても、自動的にブラウザに反映されます。

React について詳しくは、私の Medium にアクセスしてください: https://medium.com/@CodingAdventure

以上がReact アプリを作成するには?インストールと環境設定の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。