[DAY 3] 게시판 CRUD : Create

3.1 폼 데이터

<form> 태그에 실려 전송되는 데이터 <form> 태그에 실어 보낸 데이터는 서버의 컨트롤러가 DTO를 통해 받고, 최종적으로 DB에 저장된다.

<form> : 웹 페이지에서의 입력 양식에 쓰이는 태그
태그 속성
action : 폼 데이터가 전송되는 서버 url
name : 폼 식별 이름
accpt-charset : 폼 전송에 사용할 문자 인코딩 지정
target : action에서 지정한 url을 현재 창이 아닌 다른 위치에서 열도록 지정
method: 폼을 서버에 전송할 http 메소드(GET, POST)

3.2 폼 데이터를 DTO로 받기

이미 git에 실습한 코드는 업로드 중이니 따로 블로그에 쓰지 않겠지만 흐름만 적고 넘어간다.

3.2.1 입력 폼 만들기

1. 입력 폼 페이지 생성(templates/new.mustache 추가, form 태그 입력)

2. 컨트롤러 만들기 (controller/ArticleController 추가, newArticleForm() 추가 후 경로 articles/new 입력)

3. 부트스트랩 적용

3.2.3 폼 데이터 전송하기

form 태그에 속성 추가 (action="/articles/create", method="post")

3.2.4 폼 데이터 받기

1. 컨트롤러에 createArticle() 추가, @getmapping이 아닌 @Postmapping 이용해야함 -> post로 전송하였기 때문.

2. @Postmapping("articles/create") 로 작성 -> form 태그 경로 그대로 작성

3.2.5 DTO 만들기

1. DTO 패키지 생성

2. ArticleForm 자바 파일 DTO에 생성 -> create에서 받은 데이터를 받는 dto 객체가 됨

3. title, content 필드 선언, 생성자, toString() 추가

3.2.6 폼 데이터를 DTO에 담기

controller 에서 createArticle() dto로 담아오도록 수정

3.2.7 입력 폼과 DTO 필드 연결하기

1. new.mustache에 필드명 설정 안했음 -> input, textarea 태그에 각각 name 속성으로 필드명 추가하여 DTO필드와 연결

2. 서버 재시작하여 확인

결과

1. 뷰 페이지 생성
2. 컨트롤러 생성
3. DTO 생성
4. 폼 데이터 전송 받아 DTO 객체에 담기 (폼과 DTO 객체 연결)

3.3 DTO를 데이터 베이스에 저장하기

받은 데이터를 DB에 저장하는 과정 실습.

JPA (Java Persistence API)

- java에서 ORM 기술 표준으로 사용하는 인터페이스 모음

- 자바 어플리케이션에서 RDB를 사용하는 방식을 정의한 인터페이스

- 엔티티와 리파지터리를 이용한다

엔티티: 자바 객체를 DB가 이해할 수 있게 만든 것, 테이블이 됨

리파지터리 : 엔티티가 DB 안의 테이블에 저장 및 관리될 수 있게 하는 인터페이스

흐름

1. DTO 엔티티로 변환(toEntity() 호출, 반환값을Article class의 article 엔티티에 저장, article 엔티티 클래스 생성)

2. 리파지터리를 이용해 엔티티를 DB에 저장 (articleRepository.save() 호출하여 엔티티 저장, 필드 선언부에 articleRepository 선언한 후 리파지터리 만들어야 함 -> JPA에서 제공하는 CrudRepository<T, id> 이용하여 리파지터리 인터페이스 생성)

사소한 Trouble Shooting

Inferred type 'S' for type parameter 'S' is not within its bound; should extend 'Article’

ArticleRepository에서 계속 Article 엔티티를 못 잡아서 오류가 발생했다. 오탈자 확인해도 안되길래 extend 구문 다시 작성해서 엔티티 import 하도록 잡아줬더니 됐다.