Windows11 に Node.js インストールして JavaScript 実行、React環境構築をやってみる
やることは大雑把にこんあところ
- Node.jsインストール
- Node.js で JavaScript実行(簡単なHTTPサーバたてる)
- React環境構築
Node.js インストール（node:v18.15.0, npm:v9.5.0）
- Node.js インストーラー取得(LTSの方を選択)
https://nodejs.org/ - インストーラ実行
画面に従い進める、許可などは確認して同意、はいを選択
途中でコマンドプロンプト、PowerShell 上がってくるのも画面に従いキー入力
Warning とか出ても気にしないでOK - インストール確認
コマンドプロンプト or Powrshell で以下を入力してバージョン確認# Node node --version # Node Package Manager npm --version
Node.js で JavaScript実行(HTTPサーバ)
- 適当なフォルダを作る
C:\nodework - フォルダの中に JavaScript
index.jsを作る
C:\nodework\index.js -
index.jsに以下のコードを入力index.js// モジュールインポート const http = require("http"); // HTTPサーバ設定 http.createServer((request, response) => { switch (request.url) { case '/json': response.writeHead(200, { "content-type": "application/json", "charset": "utf-8" }); response.write("{ text : Hello World }"); response.end(); break; case '/html': response.writeHead(200, { "content-type": "text/html", "charset": "utf-8" }); response.write("<!doctype html><html><body><h1>Hello World</h1></body></html>"); response.end(); break; default: response.writeHead(200, { "content-type": "text/plain" }); response.write("Hello World"); response.end(); } }).listen(8888); - コマンドプロンプト or Powrshell で作ったフォルダに移動
cd C:\nodework - コマンドプロンプト or Powrshell で Node 使って JavaScript 実行
以下のコマンド実行で Node から JavaScript が実行されるnode index.js # 実行すると Windows セキュリティの警告が出るときは気にせずキャンセルでOK # 他のPCとかデバイスから接続させたいときはアクセス許可するようにする - 実行したやつにアクセス
以下にブラウザからアクセスでHello Worldが表示されればOK
http://localhost:8888/
http://localhost:8888/json
http://localhost:8888/html
React環境構築(create-react-app:v5.0.1)
公式の Create a New React App を参考にやってみる
- 適当なフォルダを作る
C:\reactwork - コマンドプロンプト or Powrshell で作ったフォルダに移動
cd C:\reactwork -
create-react-appよりプロジェクト名を指定して作成npx create-react-app my-app # my-app のフォルダが作られて開発するプロジェクトになる # create-react-app のインストールするか聞かれたら y で続ける - 作ったプロジェクトに移動
cd my-app - 作ったプロジェクトを実行
npm start - ブラウザで以下が上がってくればOK
http://localhost:3000/
