[Express] input태그에 name을 적는 이유

1. 데이터 전송

name속성은 해당 input요소의 이름을 정의하는 역할을 한다.

웹 페이지에서 사용자가 입력한 데이터를 서버로 전송하면 입력필드의 이름과 값이 함께 전송된다.

서버는 이러한 이름-값 쌍을 기반으로 처리하기 때문에 name이 필요하다.

2. 서버 처리

Express에서 POST 요청을 처리할 때, 클라이언트가 전송한 데이터는 req.body 객체에 저장된다.

이때 req.body 객체의 속성 이름은 HTML입력 필드의 name속성 값과 일치한다.

예시

<form action="/signup" method="POST">
  <input type="text" name="username" placeholder="Username" />
  <input type="password" name="password" placeholder="Password" />
  <button type="submit">Sign up</button>
</form>

위와 같은 회원가임 템플릿이 있다면

Express에서 POST 요청을 처리할 때, 다음과 같이 데이터에 접근 할 수 있다.

app.post('/signup', (req, res) => {
  const username = req.body.username;
  const password = req.body.password;
});