button과 form의 관계에 대해 설명

# button과 form의 관계에 대해서 알아보자.

아래는 코드정보이다.

{{>layouts/header}}

{{#article}}
    <form class="container" action="/articles/update" method="post">
        <input name="id" type="hidden" value="{{id}}"/>
        <div class="mb-3">
            <label class="form-label">제목</label>
            <input type="text" class="form-control" name="title" value="{{title}}">
        </div>
        <div class="mb-3">
            <label class="form-label">내용</label>
            <textarea class="form-control" rows="3" name="content">{{content}}</textarea>
        </div>
        <button type="submit" class="btn btn-primary">제출</button>
        <button type="submit" href="/hi" class="btn btn-primary">button → action api 호출</button>
        <a href="/hi" class="btn btn-primary">안녕하세요...</a>
        <a href="/articles/{{id}}" class="btn btn-primary">Back</a>
    </form>
{{/article}}

{{>layouts/footer}}

코드에 대한 화면정보이다.

결론은 form태그에서 버튼은 action 로케이션의 api로 정보를 던진다고 보면된다.

헷갈리지 말자...!