0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

WindowsでのReact環境構築をしてみた

Posted at

Reactの勉強をするためにViteを利用してReactの環境構築をしてみました。

1.Node.jsをインストールする

1-1.公式サイトにあるインストーラーを使用してインストール

1-2.コマンドプロンプトでバージョン確認してインストールできたことを確認

node -v
npm -v

---なぜNode.jsをインストールするの?---

・Node.jsに付いてくるnpmというパッケージ管理ツールでReactで使うパッケージの管理を簡単にするため
・ローカル開発サーバーを使って開発アプリの動作を確認するため

2.Viteの環境構築構築をする

2-1.以下のコマンドでViteプロジェクトを作成する

npm create vite@latest

2-2.作成するとプロジェクト名は何にするか聞かれるので任意のプロジェクトを入力する
image.png

2-3.使用するフレームワークを選択する。ここではReactを選択。
image.png

2-4.今回僕の環境ではTypeScriptを使わないので「JavaScript + SWC(コンパイラ)」を選択する

image.png

2-5.package.jsonに明示されている全てのパッケージをインストールする

nmp i

2-6.開発サーバーを起動する

npm run dev

サーバーのアドレスにアクセスして以下が表示されればok
image.png

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?