sugang
sugang'study
sugang
전체 방문자
오늘
어제
  • 분류 전체보기
    • [OS]
    • [취업정보]
    • [Server]
    • [Algorithm]
    • [Database]
    • [MyTravel]
    • [Network]

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • n

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
sugang

sugang'study

스프링입문 - 데이터 조회하기 with JPA, 페이지 이동하기, 수정, 삭제
[Server]

스프링입문 - 데이터 조회하기 with JPA, 페이지 이동하기, 수정, 삭제

2022. 9. 8. 01:53

스프링에서의 데이터 조회 흐름


 

 

Article controller 에 조회 메소드 추가 

1. 데이터 가져오는 과정 코드

2. 모델 등록 코드 (파라미터에 모델 추가 ) & 3. view 페이지로 리턴 

 

뷰페이지 생성 : resources->templates->article -> show.mustache 생성

show.mustache :
bootstrap 에 table 검색 & 카피  -> html 적용

 

모델에서 던져진 엔티티 뷰 페이지에서 사용하기 

엔티티 기본 생성자 추가 (Article 파일)

 

전체 목록 조회

article controller 에 index 메소드 작성 

 

이때, 리파지토리의 타입을 리스트로 가져오기 위해, 리파지토리 인터페이스 코드를 수정한다. 

메소드 타입 오버라이드. (재정의) 

2.

마지막으로 인덱스 파일을 생성한다 . end

 

링크와 리다이렉트로 페이지간 이동을 연결

랑크: 편리한 요청 

리다이렉트: 클라이언트에게 재요청, 편리한 응답

 

1. a 태그로 링크 추가 

index.mustache에 링크 추가  <a href="/articles/new"></a> : 생성 페이지로 이동 

new.mustache에 링크 추가 <a href="/article"?</a> : 뒤로가기

 

2. 리다이렉트

새로운 목록을 생성했을때, 해당 아이디의 페이지로 넘어가게 하려고 함.(상세보기 페이지 ) 

Post 메소드의 리턴으로 작성함

( 이때 article의 getId 라는 getter 메소드가 필요한데, 이는 Article.java에 @Getter 를 추가하여 해결한다. ) 

자바 코드를 바꿀 시 서버 재시작 필요! 

 

상세보기 페이지 -> 목록으로 돌아가기 

id를 받는 메소드의 return 파일을 확인하여, 해당 파일에 a 태그 삽입 -> show.mustache 

<a href="/articles">Go To Article List</a>

 

목록에서 특정 타이틀을 클릭했을 때 상세페이지로 이동하기 

index.mustache 에

<td> <a href ="articles/{{id}}">{{title}}</a></td>

## 이슈.

추가가 안되길래 무슨 문젠가 했더니, form 에서 받아온 데이터가 article객체로 저장이 안되었었다. 

이는 form 에서 파라미터로 전송하는 null 타입 때문. id에 null 을 전송-> article 에서 autoincrease로 값 증가시켜 저장 

히는데 이때, article의 id 타입을 long id 로 했었다. long 은 널값을 허용하지 않으므로 널 값을 허용하는 Long 타입으로 써줘야한다.

 

수정 폼 만들기

 

1. show.mustache 에 edit 버튼( a 태그) 를 추가한다. 

<a href="/articles/{{article.id}}/edit" class = "btn btn-primary">Edit</a>

2. 해당 url 을 받아오는 컨트롤러를 작성한다.

3. edit.mustache 작성

 

수정 데이터 갱신

1. 더미 데이터 생성(서버 껐다 킬 때 자동으로 생성) 

resources -> data.sql file 에 insert 로 더미데이터 생성 

 

2. Edit.mustache action (폼 전송 시 이동되는 url) 과 hidden input 으로 id 를 받음 

 

3. 수정 폼 컨트롤러 

- DTO 에 private Long id 추가 

 

 

데이터 삭제하기

RedirectAttributes.addFlashAttributes("msg","deleted!") 

: 리다이렉트된 페이지에서 일회성으로 사용할 데이터 등록 시켜줌  

 

 

 

'[Server]' 카테고리의 다른 글

[Server] ec2 vscode ssh : Operation timed out, Permission denied (PublicKey) 오류 해결  (0) 2023.04.13
[Node] 다중 파일 올리기  (0) 2022.09.23
[server] Docker 로 Node.JS & Nginx개발환경 구축  (0) 2022.07.03
[server] Docker 시작하기  (0) 2022.07.01
local 서버에 개발환경 구축하기  (0) 2021.10.02
    '[Server]' 카테고리의 다른 글
    • [Server] ec2 vscode ssh : Operation timed out, Permission denied (PublicKey) 오류 해결
    • [Node] 다중 파일 올리기
    • [server] Docker 로 Node.JS & Nginx개발환경 구축
    • [server] Docker 시작하기
    sugang
    sugang

    티스토리툴바