前回の続きです。ぜひこちらを読んでから御覧ください。

クライアントから受け取ったリクエストとレスポンスを引数として受け取り、ブラウザへ処理を返す。

最初に"res.writeHead()を追加する。これはリクエストに対してこういうHead情報を返しますよという関数。

第1引数には200を入れる。これは通信がうまくいってますよというステータスコード。
第2引数にはHeadの中身を入れる。今回はそのレスポンスで返すコンテンツの中身はhtmlファイルですよっていう中身を送る。

それが以下のようなコードになる。

    //ブラウザからアクセスが来たときの処理
    res.writeHead(200, {"Content-Type": "text/html"});

そして、htmlファイルを読み込ませる。

htmlファイルを読み込ませるにはfsというモジュールが必要になる。
fsモジュールを読み込んでreadFileSync()という関数で非同期処理でindex.htmlのファイルの中身を読み取るという機能をインスタンス化する。

const html = require("fs").readFileSync("./index.html")

そして、HTMLをレスポンスとして返す処理をcreateServerの中に記述する。

//webサーバーを作ろう
const server = http.createServer((req, res) => {
    //ブラウザからアクセスが来たときの処理
    res.writeHead(200, {"Content-Type": "text/html"});
    res.write(html);
    res.end();
});

res.end();は終了の記述として必ずいる。

そして、サーバーがリクエストを待っている状態であることを指示するのがlisten()関数である。この場合、PORT番号を8000としている。

const http = require("http");
const html = require("fs").readFileSync("./index.html")

const PORT = 8000;

//webサーバーを作ろう
const server = http.createServer((req, res) => {
    //ブラウザからアクセスが来たときの処理
    res.writeHead(200, {"Content-Type": "text/html"});
    res.write(html);
    res.end();
});

server.listen(PORT, () => {
    console.log("server running!")
});

そして、nodemonをインストールして、package.jsonのscriptsの部分のnodeをnodemonと変更する。
すると、サーバーを再起動しなくても変更を反映させることが出来る。というか、変更を加えると勝手に再起動してくれるのがnodemon。

const server = http.createServer((req, res) => {
    //ブラウザからアクセスが来たときの処理
    res.writeHead(200, {"Content-Type": "text/html"});
    res.write(html);
    res.end();

    if (req.method == "GET"){

    }

    if (req.method == "POST"){
        
    }
});

静的なWebサイトをホスティングするサービスはたくさんあるが、クライアントからのリクエストがGETやPOSTなどであったらそれによって処理を変更できるのがサーバーから開発することのメリット。