React を Windows に直接インストールする

  • [アーティクル]

このガイドでは、Vite フロントエンド ツールを使用して、Linux 用 Windows サブシステム (WSL) 上で実行されている Linux ディストリビューション (Ubuntu) に React をインストールする方法について説明します。

React を初めて使用する場合や、学習に興味がある場合は、これらの手順に従うことをお勧めします。 Bash コマンドやツールを使用してシングルページ アプリ (SPA) を作成する場合、Linux サーバーへのデプロイを計画している場合、またはその両方の場合、Vite を使用して Linux 用 Windows サブシステム (WSL) にインストールすることをお勧めします。

React のより一般的な情報、および React (Web アプリ)、React Native (モバイル アプリ)、React Native for Windows (デスクトップ アプリ) のどれを使うかの決定については、「Reactの概要」を参照してください。

React アプリを作成する

Create React App をインストールするには:

  1. ターミナル (Windows コマンド プロンプトまたは PowerShell) を開きます。

  2. 新しいプロジェクト フォルダーを作成し (mkdir ReactProjects)、そのディレクトリに移動します (cd ReactProjects)。

  3. Vite を使用したインストール:

    npm create vite@latest my-react-app -- --template react

  4. インストールが完了したら、新しいアプリのディレクトリ ("my-react-app" または任意の名前) に移動し (cd my-react-app)、依存関係をインストールしてから (npm install)、ローカル開発サーバーを起動します (npm run dev)。

    このコマンドは Node.js サーバーを起動し、アプリを表示する新しいブラウザー ウィンドウを起動します。 Ctrl + C キーを使用すると、コマンド ラインでの React アプリの実行を停止できます。

Note

Vite には、Babel、esbuild、Rollup を使用したフロントエンド ビルド パイプラインが含まれますが、バックエンドのロジックまたはデータベースは処理しません。 Node.js バックエンドを使用する、サーバーでレンダリングされる Web サイトを React で構築したい場合は、シングルページ アプリ向けの Vite をインストールするのではなく Next.jsをインストールすることをお勧めします。 また、静的なコンテンツ指向の Web サイトを構築する場合は、Gatsby のインストールを検討することもできます。

  1. Web アプリを運用環境にデプロイする準備ができたら、npm run build を実行して、"dist" フォルダーにアプリのビルドを作成します。 「静的なサイトのデプロイ」で、さらに詳細を確認できます。

その他のリソース