Start

cd Desktop
데스크탑으로 이동

mkdir Calculator
Calculator라는 폴더를 생성

cd Calculator
Calculator폴더로 이동

touch calculator.js
calculator.js파일 생성

touch index.html
index.html파일 생성

npm init
npm생성

npm install express
express 설치

javascript

const express =  require("express");
const app = express();

app.listen(3000, function(){
   console.log("Server started on port 3000") 
});


app.get("/", function(req, res){
    res.sendFile(__dirname + "/index.html")
});

npm install -g nodemon
nodemon 설치

nodemon calculator.js
서버 시작

html

  <h1>Calculator</h1>
    <form action="index.html" method="post">
        <input type="text" name="num1" placeholder="First Number">
        <input type="text" name="num2" placeholder="Second Number">
        <button type="submit" name="submit">Calculate</button>

sendFile (외부 index.html 경로 불러오기)

app.get("/", function(req, res){
    res.sendFile(__dirname + "/index.html")
});

body Parser

body-parser는 미들웨어이다. 즉, 요청(request)과 응답(response) 사이에서 공통적인 기능을 수행하는 소프트웨어이다. 그렇다면 역할은 무엇일까? 바로 요청의 본문을 지정한 형태로 파싱해주는 미들웨어이다.
Node.js의 웹프레임워크인 Express는 요청을 처리할 때 기본적으로 body를 undefined로 처리하고 있는 것이다.

body Parser installing

npm install body-parser

const bodyParser = require("body-parser");
app.use(bodyParser.urlencoded({extended: true})); //여기까지 필수로 적어야함

app.post("/", function(req,res){ //post는 html파일에 method:"post"를 뜻함
    
    var num1 = Number(req.body.num1) //Number를 넣어야 숫자로 인식 없으면 문장으로인식
    var num2 = Number(req.body.num2)//Number를 넣어야 숫자로 인식 없으면 문장으로인식

    var result = num1 + num2;
    res.send("The result of the calculation is" + result)
});

result

const express =  require("express");
const bodyParser = require("body-parser");

const app = express();

app.use(bodyParser.urlencoded({extended: true}));

app.listen(3000, function(){
   console.log("Server started on port 3000") 
});

app.post("/", function(req,res){
    
    var num1 = Number(req.body.num1)
    var num2 = Number(req.body.num2)

    var result = num1 + num2;
    res.send("The result of the calculation is" + result)
});

app.get("/", function(req, res){
    res.sendFile(__dirname + "/index.html")
});