728x90
* 학습목표
수정 페이지의 데이터를 DB로 갱신하고, 이를 확인하시오.
데이터의 수정 흐름 3단계
1. 데이터를 받고 /articles/update
- Form 데이터가 DTO에 담겨서 Controller로 전달이되면
2. 이를 가공해서 DB에 저장한 데이터를
- 이를 Entity로 가공해서 Repository를 통해 DB로 갱신 save() 한다.
- 단 기존데이터가 있는경우에만 수정되어야 함.
- 여기서 서버와의 역활 분담은 MVC가
- DB와의 소통은 JPA가 한다.
- DB의 관리는 SQL 언어를 통해 이루어진다.
3. show 페이지에 출력 한다.
- 데이터가 서버에 이동되는 과정(HTTP) 간단히 알아봅시다.
데이터가 서버로 전송되는 과정
클라이언트에서 서버로 데이터 전송은
다양한 통신규약은 Protocol에 의해 이루어진다.
친구한테 카톡, 이메일, 쪽지 등 다양한 방식으로 연락을 하면
여기서 Protocol의 종류는
FTP(File Transfer Protocol) : 파일 전송을 위한 프로토콜
SMTP(Simple Mail Transfer Protocol) : 이메일 전송을 위한 프로토콜
SSH(Secure Shell) : 원격지 호스트 컴퓨터에 접속하기 위해 사용되는 인터넷 프로토콜
기기와 목적에 따라 다양함.
웹 서비스에서 사용하는 프로토콜이 HTTP(Hyper Text Transfer Protorol)
다양한 요청을 메소드르 보냄.
대표적인 메소드로는
GET -> (Read)
POST -> (Create)
PATCH/PUT (Update)
DELETE (Delete)
데이터 관리에 가장 기본되는 동작인데 이것을 -> CRUD라고 표현한다.
HTTP SQL
Create POST insert
Read GET select
Update PATCH(PUT) update
Delete DELETE delete
SQL에서 다양한 쿼리문으로도 사용한다.
실습 개요
- 수정 페이지에서 데이터 변경 시 수정된 데이터 페이지가 나올 수 있도록 구현.
더미 데이터 설정
- 계속 데이터 추가하기 귀찮으니깐 resources 디렉터리에
data.sql 파일 생성한다.
INSERT INTO article(id, title, content) VALUES (1, '가가가가', '1111');
INSERT INTO article(id, title, content) VALUES (2, '나나나나', '2222');
INSERT INTO article(id, title, content) VALUES (3, '다다다다', '3333');
내용 입력. 서버 실행 시 데이터 자동 삽입.
수정 페이지 변경
form 태그에서 중요한거(Review)
<form class="container" action="/articles/update" method="post">
//어디로 보낼지 //어떻게 보낼지(임시)
- form 태그는 GET과 POST 메소드만을 지원
게시물 대표값이 담겨있는 id 정보를 넣어준다.
<input name="id" type="hidden" value="{{id}}" />
id 값을 hidden 숨겨서 던진다.
수정 폼 받기
controller에서 메소드를 받아올수 있게 메소드를 받아오면 됨.
controller/ArticleController에 메소드 추가
@PostMapping("/articles/update")
1. 데이터를 받아옴
public String update(ArticleForm form){
2. form 데이터를 뭘로 받는다? -> DTO
return "";
}
DTO 변경
<input name="id" type="hidden" value="{{id}}" /> 수정 페이지에
id값을 받아와야 하니, DTO를 수정해야한다.
dto/ArticleForm 에가서
private Long id; 추가하고
public Article toEntity() {
log.info(form.toString());
// 잘 받아와 지는지 확인.
return new Article(id(추가), title, content);
//반환해줌 뭐를? Article entity 객체
}
log.info(form.toString()); 로그가 잘 받아지는 것 확인.
2022-05-04 14:40:39.434 INFO 14932 --- [nio-8080-exec-3] c.e.f.controller.ArticleController : id = 1
2022-05-04 14:40:42.606 INFO 14932 --- [nio-8080-exec-5] c.e.f.controller.ArticleController : ArticleForm(id=1, title=가가가가123214124, content=11111231414)
컨트롤러 처리 개요
1: DTO를 엔티티로 변환한다!
2: 엔티티를 DB로 저장한다!
2-1: DB에 기존 데이터를 가져온다!
2-2: 기존 데이터에 값을 갱신한다!
3: 수정 결과 페이지로 리다이렉트 한다!
DTO를 엔티티로 변경
1: DTO를 엔티티로 변환한다!
Article articleEntity = form.toEntity();
dto/ArticleForm이 뭘하는 .java 파일이였지?
ArticleForm 객체를 가지고.
private Long id;
private String title;
private String content;
public Article toEntity() {
return new Article(id, title, content);
//반환해줌 뭐를? Article entity 객체
}
Article 객체를 return 해주는 파일.
기존 엔티티를 수정
2: 엔티티를 DB로 저장한다!
2-1: DB에서 기존 데이터를 가져온다!
articleRepository.findById(articleEntity.getId())
//위에서 가져온 articleEntity에.getid() 호출해서 id 값을 집어넣음.
Optional<Article> target = articleRepository.findById(articleEntity.getId());
이렇게도 받을 수 있는데 익숙하지 않아서 간단하게 받아오겠다~
Article target = articleRepository.findById(articleEntity.getId()).orElse(null)
//articleRepository가 id 값을 통해서 데이터를 가져오는데, 만약에 데이터가 없다면 null을 리턴하라.
2-2: 기존 데이터에 값을 갱신한다!
if(target != null){
//기존 데이터가 있다면
articleRepository.save(articleEntity); // 엔티티가 DB로 갱신!
}
수정 데이터 확인(DB에서 데이터가 정상적으로 변경되었는지 확인)
결과화면으로 리다이렉트
3: 수정 결과 페이지로 리다이렉트 한다!
return "redirect:/articles/" + articleEntity.getId();
//id값을 가져옴.
SQL로 데이터를 수정하기.
UPDATE article
SET
title = 'KKKK'
content = 'AAAA';
대상을 바꾸고 싶을때 WHERE 절 추가.
UPDATE article
SET
title = 'KKKK'
content = 'AAAA';
WHERE
id = 2;
요약
- 수정 페이지 데이터를 DB에 저장하는거 까지, 이걸 확인해보는거 까지.
- 수정 폼에 있는 데이터를 서버로 던지는건데
- form태그는 PATCH 메소드를 지원하지 않아서 임시로 POST를 사용함.
- ArticleController에 해당 메소드가 바껴진 데이터를 DTO (ArticleForm form)이라는 DTO로 받을 수 있었고
- 받아온걸 Entity로 변환하고.
- 변환 된걸 가지고 DB에서 찾은 다음에 데이터가 있으면.
- 갱신한다.
- 바뀐 페이지로 리다이렉트 한다.
https://github.com/Giltaehyeong/firstproject/commit/72ad32b417a5cdd52888b5524d1bcf2138728421
[스프링 부트 입문 15]데이터 수정하기 · Giltaehyeong/firstproject@72ad32b
* 학습목표 수정 페이지의 데이터를 DB로 갱신하고, 이를 확인하시오. 데이터의 수정 흐름 3단계 1. 데이터를 받고 /articles/update - Form 데이터가 DTO에 담겨서 Controller로 전달이되면 2. 이를 가공해서
github.com
소스코드참고.
728x90
'Study > SpringBoot' 카테고리의 다른 글
[스프링 부트 입문 17]CRUD와 SQL 쿼리 (0) | 2022.05.05 |
---|---|
[스프링 부트 입문 16]데이터 삭제하기 (0) | 2022.05.04 |
[스프링 부트 입문 14]수정 폼 만들기 (0) | 2022.05.04 |
[스프링 부트 입문 13]링크와 리다이렉트 (0) | 2022.05.03 |
[스프링 부트 입문 12]데이터 목록조회 (0) | 2022.05.03 |