# 수정 폼 만들기
## 미션
데이터 수정을 위한 폼을 만드시오.
![홍팍-스프링-부트-입문--미션](http://drive.google.com/thumbnail?export=view&sz=w960&id=1e-Sn3RWb6yp_hn1C6FGnkeAILjX_-6wN)
## 01:34 링크 걸기 - a 태그
#### ../articles/show.mustache
```
{{>layouts/header}}
<table class="table">
...
</table>
<!-- 수정 링크 추가 -->
<a href="/articles/{{article.id}}/edit" class="btn btn-primary">Edit</a>
<a href="/articles">Go to Article List</a>
{{>layouts/footer}}
```
## 03:38 요청 받기 - 컨트롤러, GetMapping
#### ../controller/ArticleController
```
...
@Controller
@Slf4j
public class ArticleController {
...
@GetMapping("/articles/{id}/edit")
public String edit(@PathVariable Long id, Model model) {
// 수정할 데이터 가져오기
Article articleEntity = articleRepository.findById(id).orElse(null);
// 모델에 데이터 등록
model.addAttribute("article", articleEntity);
// 뷰 페이지 설정
return "articles/edit";
}
}
```
## 07:33 수정 페이지 작성
#### ../articles/edit.mustache
```
{{>layouts/header}}
{{#article}}
<form class="container" action="" method="post">
<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">Submit</button>
<a href="/articles/{{id}}">Back</a>
</form>
{{/article}}
{{>layouts/footer}}
```
## 🔥 구글링 훈련하기
- bootstrap btn primary
- HTML input name 속성