Node.jsとは?
フロント(HTML ,CSS ,JavaScript)を触っているとたまに出てくる
『Node.js』
よくわからないから触らないでおこうと思ったら大間違い!
これを知っているとサーバーの知識、API関係、エラーで詰まった時の対応など様々な学習効果が得られます!
あと、自分はやっていて楽しかったのでまとめました。
では早速、Node.jsとは『サーバーまで自分で作れます』ということ。
HTML ,CSS ,JavaScriptで表示された画面、例えばツイッター(X)やYouTUbeの画面はクライアントサイド(お客様)で、サーバーにデータを渡して情報を取得し、再度クライアント側に更新した情報を載せている。
そしてNode.jsは言語ではなく、JavaScriptを用いた設計手法なのでJavaScriptの書き方でサーバー構築ができる。
ということは、JavaScriptを覚えたらクライアントもサーバーも作れちゃうということ。(だからJavaScriptはベースになるのか)
まとめ
JavaScriptができるようになると
1 クライアントとサーバーが作れるようになる。
2 リアルタイムアプリケーションが非同期処理で作れるようになる。
(リアルタイムアプリケーションはラインやツイッター、Zoomなど)
では次から実際にNode.jsを使っていきます。
まずnodeをPCにダウンロードし、インストールします。
次にVScodeのターミナルで適当にフォルダを作ります。
(ターミナルはcommand+Jで下に表示されます)
自分は『nodejs』フォルダを作り、cdコマンドで移動します。
※ターミナル操作についてはまた別でまとめたいと思います。
nodejsフォルダの位置で npm init -y でenterを押すとpackage.jsonができます。
npmはノードパッケージモジュールの略。npm init -yこのコマンドは初期化です。
package.jsonはモジュール(パーツ)を入れていく為の依存関係やバージョン管理を
パッケージ(包み)したものです。
さて、ここまでできたらサーバー構築していきましょう。
nodejsフォルダにserver.jsファイルを作ります。
(JavaScriptなので拡張子.jsを使用します。)
server.jsファイルを作ったら試しにconsole.log("nodejs");を打ちましょう。
そして下のターミナルにnode server.jsでenterを押すとnodejsが表示されます。
(ローカルサーバーに表示されます)
これでserver.jsファイルが読み込まれているのがわかります。
次に、今回はHTTPというモジュールを使っていきます。
npm install --save-dev http とターミナルに打ち込んでenterを押しましょう。
すると画像のようにnode_modulesとpackage.jsonが作成されます。
node_modulesフォルダにhttpフォルダが入ってます。
そしてpackage.jsonの一番下にhttpの部品が追加されています。
ローカルサーバーで立ち上げるのに実際の現場での使い方はpackage.jsonの中身を変更してserver.jsを表示させます。
"scripts": {
"dev": "node server.js"
},
(devのところはstartでもいい)
scripts内の”test"をこのように書き換えます。
そしてターミナルにnpm run devを打ち込んで立ち上げるとserver.jsファイルが表示されます。
では準備ができたので次回から自作Webサーバーを作っていきます。
(長くなったので次回に)
Discussion