HTML Tag - Forms

form 태그는 사용자와의 커뮤니케이션을 위한 태그이다. 사용자가 입력한 데이터를 수집하기 위해 사용되며 input, textarea, button, select, checkbox, radio button, submit button 등의 입력 양식 태그를 포함할 수 있다.

 

GET과 POST는 HTTP 프로토콜을 이용해서 사용자 입력 데이터를 서버에 전달하는 방식을 나타내며 http request method라고 한다.

 

GET

• 전송 url에 입력 데이터를 쿼리스트링으로 보낸다
• url에 전송 데이터가 노출되기 때문에 보안에 문제가 있으며 전송할 수 있는 데이터에 한계가 있다.
• REST API에서 GET메소드는 특정 리소스의 조회를 요청한다.

POST

• POST방식은 request body에 담아 보내는 방식
• url에 전송 데이터가 노출되지 않지만 GET에 비교하면 속도가 느리다
• rest api에서 post메소드는 특정 리소스의 생성을 요청한다.

---

input tag - 사용자로부터 데이터를 입력받기 위해 사용

태그에는 다양한 종류가 있는데, type attribute에 의해서 구분된다.

form 태그 내에 존재해야 데이터를 전송할 수 있으나, ajax를 사용할 시에는 태그 내에 존재하지 않아도 괜찮다.

type은 button, checkbox, color, date, datetime 등등 여러가지가 있다.

 

button tag

유의해야할 점 : input type="button"과 유사하지만 input 태그는 빈 태그인 반면 button은 그렇지 않다.

: button 요소는 텍스트나 이미지 같은 콘텐츠를 사용할 수 있다.

---

fieldset / legend 

fieldset 태그는 관련된 입력 양식들을 그룹화할 때 사용한다.

legend 태그는 fieldset 태그 내에서 사용되야 하며 그룹화된 fieldset의 제목을 정의한다.

 

<fieldset>
        <legend>Login</legend>
        Myname <input type="text" name="username">
        Password <input type="text" name="password">
</fieldset>