웹페이지 페이징 및 파일 다운로드 구현 미니 프로젝트 (빅데이터 부트캠프 98~99일차)

프로젝트 주제

- Spring boot와 React를 사용하여 웹페이지에 페이징과 파일 다운로드를 구현

 

맡은 역할

- MySQL을 사용하여 함께 DB 세팅 

- 기본적인 MVC패턴 구현 및 Diary Entity를 이용하여 diary_no를 통해 Diary Entity와 외래키 관계에 있는 File Entity의 데이터를 참고하여 웹페이지에서의 파일 다운로드 구현

- 웹페이지 게시판의 페이징 구현

 

프로젝트 진행시 막혔거나 새로 알게된 점

1 . @Query를 이용하여 메소드 위에 정적 쿼리를 작성하여 메소드를 정의하였는데 해당 쿼리문을 인식하지 못함

=> 알고보니 쿼리문 작성시 DB에 테이블명이 file이어도 첫글자가 대문자인 File로 입력했어야 하는데 file로 입력한 것이 원인인 것을 발견하여 테이블명을 file → File로 수정후 문제를 해결

 

2. 게시판에서 파일 다운로드를 시도할 때 지정한 경로에 파일이 없는데도 자동으로 download라는 이름의 빈 파일로 다운로드가 실행되는 문제

=> 조건문을 이용하여 파일이 없을 경우 HttpHeaders 객체에는 null을 HttpStatus에는 NOT_FOUND를 적용한 ResponseEntity를 반환하여 파일이 없는데 다운로드를 실행하면 오류 페이지가 뜨도록 함으로써 해결

 

3. 페이지 번호 선택 버튼에서 1번이 아닌 버튼을 클릭한 후 다시 1번 버튼을 누르면 처음 순서가 아닌 2번째 순서 페이지가 출력되는 문제

=> 프론트에서 페이지가 1부터 백엔드에서는 0부터 시작하는 차이가 원인이었고 PageRequest.of을 통해 Pageable 객체 생성시 page인자에 page ⇒ page-1로 수정함으로써 해결

 

4. Github에 Spring boot 프로젝트 파일 커밋시 .maven 폴더와 .settings 폴더가 push 되지 않아 다른 팀원들이 pull 한 후에 프로젝트를 import를 시도했을때 import가 불가능한 문제가 발생

=> 해당 프로젝트의 .gitignore 파일에서 해당 부분을 지우고 commit+push를 하니 .maven 폴더와 .settings 폴더가 깃허브에 성공적으로 push되었고 import도 정상적으로 가능함을 확인함으로써 해결

 

결과물

관련 GitHub 주소

https://github.com/anydevil0812/mini_Project_Page

GitHub - anydevil0812/mini_Project_Page: 웹페이지 페이징 및 파일 다운로드 기능 구현 미니 프로젝트