전체 글
-
[Java] SpringBoot 프로젝트 : 리스트 페이징 처리(5) - PagingUtil 클래스프로젝트/기능 정리 2023. 6. 21. 15:37
목적 게시판 형식 웹사이트 개발 시 DB에서 글 리스트 불러오기 기능 구현 리스트 게시판 페이징 처리 받은 코드 리뷰 이제 마지막으로 PagingUtil 클래스 내부 코드를 보도록 하자. 이전 글에서 페이징 처리에 필요한 값들을 구하는 식을 봤으니, 이제 코드를 보면 쉽게 이해가 갈 것이다. [데이터 흐름도] 데이터 흐름도는 다음과 같다. [PagingUtil 클래스] 우선 클래스 내부 코드를 보기 전 어떤 인자를 넘겨줬었는지 다시 보자. 아래는 컨트롤러에서 PagingUtil 객체를 생성하는 부분이다. PagingUtil page = new PagingUtil(keyfield, null, currentPage, count, 5, 5, "pointList.do"); 각 인자들이 무엇인지 앞에서 설명했지만..
-
[Java] SpringBoot 프로젝트 : 리스트 페이징 처리(4) - 페이징 처리 수식 유도프로젝트/기능 정리 2023. 6. 20. 22:45
목적 게시판 형식 웹사이트 개발 시 DB에서 글 리스트 불러오기 기능 구현 리스트 게시판 페이징 처리 받은 코드 리뷰 우선 PagingUtil 클래스의 코드를 보기 전에 어떤식으로 동작하는지 알아야 한다. 이를 위해 이번 글에서는 페이징 처리에 필요한 수식을 유도해보자. [데이터 흐름도] 데이터 흐름도는 다음과 같다. [페이징 처리] 우선 페이징 처리를 위해 어떤 값들이 필요한지 보자. 아래 계산들을 위해서 다음 값들은 필수적으로 가지고 있어야 한다. 현재 페이지 전체 게시물 개수 한 화면에 보여줄 게시물 수 한 화면에 보여줄 페이지 번호 수 [전체 페이지 수] 먼저 전체 게시물의 개수를 알고 있고, 한 페이지에 몇 개의 게시물씩 보여줄지 정했다면 전체 페이지 수를 구할 수 있다. 예를 들어, 전체 게시..
-
[Java] SpringBoot 프로젝트 : 리스트 페이징 처리(3) - DB에서 리스트 불러오기(Mapper.xml, Generics, ROWNUM)프로젝트/기능 정리 2023. 6. 17. 23:17
목적 게시판 형식 웹사이트 개발 시 DB에서 글 리스트 불러오기 기능 구현 리스트 게시판 페이징 처리 받은 코드 리뷰 지난 글에서는 요청 받은 컨트롤러가 DB 내 테이블에서 페이징을 위해 원하는 행의 개수를 가져오는 과정을 살펴봤다. 이번에는 이어서 리스트를 불러오는 과정을 살펴보자. [데이터 흐름도] 데이터 흐름도는 다음과 같다. 컨트롤러의 코드를 다시 보자. [Controller - pointList.do] @RequestMapping("/mypage/pointList.do") public ModelAndView pointList(@RequestParam(value = "pageNum", defaultValue = "1") int currentPage, @RequestParam(value = "key..
-
[Java] SpringBoot 프로젝트 : 리스트 페이징 처리(2) - DB 리스트 개수 가져오기(@RequestParam, ModelAndView, xml)프로젝트/기능 정리 2023. 6. 16. 14:34
목적 게시판 형식 웹사이트 개발 시 DB에서 글 리스트 불러오기 기능 구현 리스트 게시판 페이징 처리 받은 코드 리뷰 지난 글에서는 jsp가 컨트롤러에 어떤식으로 요청을 보내고, 받은 데이터는 어떻게 화면에 표시하는지 살펴봤다. 이번엔 요청 받은 컨트롤러가 데이터를 어떻게 처리하는지 알아보자. [데이터 흐름도] 데이터 흐름은 다음과 같다. 처음 포인트 페이지에 접근할 때 경로는 다음과 같았다. [Controller - pointList.do] 해당 경로로 매핑된 코드는 다음과 같다. 포인트 리스트를 표시하는데 필요한 코드들만 보도록 하겠다. @RequestMapping("/mypage/pointList.do") public ModelAndView pointList(@RequestParam(value = ..
-
[Java] SpringBoot 프로젝트 : 리스트 페이징 처리(1) - 페이징 화면에 보여주기프로젝트/기능 정리 2023. 6. 15. 16:07
목적 게시판 형식 웹사이트 개발 시 DB에서 글 리스트 불러오기 기능 구현 리스트 게시판 페이징 처리 받은 코드 리뷰 어떤 프로젝트를 진행하든 게시판 형태를 기반으로 하는 웹페이지가 대부분이다. 가장 기본적인 게시판 CRUD 중 read에 해당하는 코드들을 정리하고, DB에서 읽어온 데이터들을 페이징 처리하는 과정까지 알아보자. 마이페이지 개발 당시 회원이 이용권을 결제하면 일정 비율을 포인트로 전환해 사용할 수 있게 했다. 마이페이지 내에서 결제 내역과 적립 포인트 내역을 확인할 수 있는 페이지를 예로 처리과정을 알아보자. [데이터 흐름도] 데이터 흐름도는 다음과 같다. 설명하자면, jsp에서 페이징 버튼이 클릭되면, 클릭된 페이지와 검색필드가 GET방식으로 컨트롤러에 전달된다. 컨트롤러는 전달받은 검..
-
[Java] SpringBoot 프로젝트 : 프로필 사진 기능 구현(6) - 이미지 Ajax 전송 데이터 처리(@ResponseBody, @ModelAttribute)프로젝트/기능 정리 2023. 6. 12. 13:19
목적 회원제 웹사이트 개발시 거의 필수적으로 사용되는 프로필 사진 등록 및 수정 기능 구현 프로필 이미지 등록 관련 DB, Java, JS 처리 총 정리 일부 받아서 쓴 코드 리뷰 지난 글에서는 JS에서 FormData 객체를 통해 Ajax 방식으로 데이터를 컨트롤러에 전송하는 방법을 알아봤다. 이번 글은 마지막 과정인 컨트롤러에서 전달 받은 데이터를 처리하고 DB에 저장하는 코드를 보자. 데이터 흐름도는 다음과 같다. [데이터 흐름도] 이전 글에서 Ajax를 이용해 컨트롤러에 이미지 데이터를 넘겨줬다. [JavaScript - Ajax처리] 상기를 위해 코드를 다시 보면 다음과 같다. //파일 전송 let form_data = new FormData(); form_data.append('upload',..
-
[JavaScript] SpringBoot 프로젝트 : 프로필 사진 기능 구현(5) - 이미지 Ajax전송(FormData, Ajax parameter)프로젝트/기능 정리 2023. 6. 11. 21:50
목적 회원제 웹사이트 개발시 거의 필수적으로 사용되는 프로필 사진 등록 및 수정 기능 구현 프로필 이미지 등록 관련 DB, Java, JS 처리 총 정리 일부 받아서 쓴 코드 리뷰 지난 글에서는 JS로 회원이 업로드한 이미지 미리보기 기능까지 알아봤다. 이번엔 업로드한 이미지를 Ajax 방식으로 컨트롤러에 전송하는 방법과 이미지 등록 취소시 코드를 보자. 데이터 흐름도는 다음과 같다. [데이터 흐름도] 이전 글에 이어 JavaScript 코드를 보자. 먼저 기억해야할 태그들은 다음과 같았다. 닫기 변경 [JavaScript] JS로는 총 세 가지 기능을 구현했다고 했다. 내용은 다음과 같다. 회원이 input 태그를 통해 이미지 파일을 선택했을 때, 파일 크기 확인 및 화면에 선택한 이미지 미리보기 이미..
-
[JavaScript] SpringBoot 프로젝트 : 프로필 사진 기능 구현(4) - 이미지 미리보기(input type = "file", FileReader)프로젝트/기능 정리 2023. 6. 11. 14:52
목적 회원제 웹사이트 개발시 거의 필수적으로 사용되는 프로필 사진 등록 및 수정 기능 구현 프로필 이미지 등록 관련 DB, Java, JS 처리 총 정리 일부 받아서 쓴 코드 리뷰 지난 글까지는 기본이미지 또는 DB에 저장되어 있는 이미지를 가져와 JSP에 표시하는 과정을 살펴봤다. 그 과정에서 I/O Stream, VO, Mybatis, Tiles, AbstractView, Base64 encoding 등의 개념들도 짧게나마 정리했다. 이번 글 이후부터는 회원이 프로필 이미지를 등록하거나 수정할 때 처리과정을 알아보겠다. 데이터 흐름도는 다음과 같다. [데이터 흐름도] 일단 JSP쪽 코드부터 보자. [JSP] JSP의 코드는 아래와 같은데, 프로필 이미지와 관련된 태그들만 적었다. 프로필 사진 변경 닫..