body-parser
데이터를 쉽게 처리할 수 있도록 도와주는 미들웨어
요청의 body를 해석해 req.body 객체로 받을 수 있게 함
Form 속성
action: 폼을 전송할 서버 주소
name: 폼을 식별하기 위한 이름
method: 폼을 서버에 전송할 http 메소드 지정
Get vs. Post
Get
정보를 가져오거나 검색할 때 쓰임
url 쿼리 문자열에 데이터를 실어 전송
서버의 값이나 상태를 변경하지 않을 때
데이터는 req.query에 있음
Post
무언가를 생성하거나 어떤 정보를 보낼 때
데이터는 req.body에 실어 전송
url보다 많은 데이터를 body에 실어 전송 가능
input 속성 중 name
name: 이름 지정. name으로 key가 생성되므로 중요!!
GET, POST 실습
a href
- 헷갈렸던 점:
html 작성 형식과 같이 상대경로를 통해 각 페이지를 연결했는데 접근이 되지 않았다.
<a href="./getInfo.ejs">GET으로 정보 받기</a>
<a href="./postInfo.ejs">POST로 정보 받기</a>그러나 상대 경로로 작성하게 되면
GET | POST localhost:PORT/postInfo.ejs 하이퍼링크가 다음과 같은 요청으로 변하게 돼서
1)
<a href="/getInfo">GET으로 정보 받기</a>
<a href="/postInfo">POST로 정보 받기</a>으로 바꾸고
2) app.js에서 get을 통해 요청을 날려야 한다.
app.get("/getInfo", (req, res) => {
res.render("getInfo", { title: "get 실습" });
});
app.get("/postInfo", (req, res) => {
res.render("postInfo", { title: "post 실습" });
});Truthy & Falsy
// truthy와 falsy
console.log(Boolean('hello')); // true -> truthy (true 같은 것..)
console.log(Boolean('')); // false -> falsy (false 같은 것..)Truthy
truthy_MDN
boolean 으로 사용하게 될 때 true 값으로 간주되는 값
false, 0, -0, 0n, "", null, undefined, NaN을 제외한 모든 값
// truthy ex
console.log(!3);
console.log(!'hello');
console.log(!['a', 'b']);
console.log(![]);
console.log(!{ one: 1 });
console.log(!{});Falsy
boolean 으로 사용하게 될 때 true 값으로 간주되는 값
false, 0, -0, 0n, "", null, undefined, NaN 값
- document.all(JS의 유일한 falsy 객체)
// falsy ex
console.log(!undefined); // true
console.log(!null); // true
console.log(!0); // true
console.log(!''); // true
console.log(!NaN); // true