[Spring] To Do List 웹페이지 만들기(spring legacy) - 4. 일기장(diary)_페이지네이션

HodooHa·2024년 7월 1일
post-thumbnail




페이지네이션은 이전에 개인프로젝트할 때 몇번 해봤었는데 할때마다 헷갈리고 어려운 것 같다.

일단 프론트엔드쪽 페이지네이션을 구현할 때
1. 총 게시글 수 (totalCount)
2. 페이지 당 게시글 수 (pageSize)
3. 페이지그룹 수 (GroupSize)
4. 현재 페이지 (currentPage)
를 우선적으로 알아야 한다.

이번 [일기장] 속에서는 하기와 같다.

  • 총 게시글 수 (totalCount) : 19 (가변적, *해당 값을 가져오는 메소드 필요)
  • 페이지 당 게시글 수 (pageSize) : 5 (고정)
  • 페이지그룹 수 (groupSize) : 3 (고정)
  • 현재 페이지 (currentPage) : 처음엔 1로 세팅
  • 현재 페이지 그룹 (group) : currentPage % groupSize == 0 ? currentPage / groupSize : currentPage / groupSize+1
  • 마지막페이지 (전체페이지) : totalCount % 5 == 0 ? totalCount / 5 : totalCount / 5 + 1
  • 그룹 내 마지막페이지 (endPage) : group * groupSize
  • 그룹 내 첫페이지 (startPage) : endPage - pageGroup + 1

백엔드쪽에서는
1. 현재 페이지 (currentPage)
2. 해당 페이지의 첫번째 글 No
3. 해당 페이지의 마지막 글 No

호두스케쥴러의 [일기장]은 로그인한 유저의 아이디도 필요하기에,

  • 현재 페이지 (currentPage)
  • 페이지 내 첫 게시글 no (start)
  • 페이지 내 마지막 게시글 no (end)
  • 작성자 (userId)
    이렇게 4가지 필드를 가진 PageDTO를 만들었다.

자세한 내용은 아래 소스코드를 참고하면 되겠다.

[소스코드]

[pageDTO.java]

public class PageDTO {
	private int start; // 페이지 내 첫번째 게시글
	private int end; // 페이지 내 마지막 게시글
	private int page; // 현재 페이지
	private String userId; // 작성자 id

	public String getUserId() {
		return userId;
	}

	public void setUserId(String userId) {
		this.userId = userId;
	}

	public void setStartEnd(int page) { // 페이지별 첫글, 마지막글 구하는 메소드
		//page별로 start, end값만 구해주면 됨.
		start = 1 + (page - 1) * 5; 

		end = page * 5;

	}

	public int getPage() {
		return page;
	}

	public void setPage(int page) {
		this.page = page;
	}

	public int getStart() {
		return start;
	}

	public void setStart(int start) {
		this.start = start;
	}

	public int getEnd() {
		return end;
	}

	public void setEnd(int end) {
		this.end = end;
	}
	
	
}

[DiaryController.java 일부]

@SessionAttributes("loginUser")
@Controller
@RequestMapping("/diary")
public class DiaryController {
public class DiaryController {

	private DiaryService diaryService;

	@Autowired
	public DiaryController(DiaryService diaryService) {
		super();
		this.diaryService = diaryService;
	}

	@GetMapping("/list")
	public String diaryList(Model model, HttpSession session, PageDTO pageDTO) {
		 // 클라에서 요청하는 페이지(currentPage)를 pageDTO에 담아 보낸다.
		try {
			UserDTO loginUser = (UserDTO) session.getAttribute("loginUser");
			String userId = loginUser.getUserId();
			pageDTO.setUserId(loginUser.getUserId());
			int groupSize = 3;
			int pageSize = 5;           	
			int currentPage = pageDTO.getPage(); // 현재 페이지 정보를 받는다.
			pageDTO.setStartEnd(currentPage); // 현재 페이지로 첫 게시글 번호와 마지막 게시글 번호를 구한다. 
			int totalCount = diaryService.selectCount(userId); 
            // 작성자가 작성한 일기의 총 개수를 구한다.
			int group =  currentPage % groupSize == 0 ? currentPage / groupSize : currentPage / groupSize + 1;
			int totalPage = totalCount % pageSize == 0 ? totalCount / pageSize : totalCount / pageSize + 1;
			int endPage = group * groupSize;

			ArrayList<DiaryDTO> list = diaryService.diaryList(pageDTO);
            // 일기를 list에 담는다.

			// 클라쪽으로 일기 list와 정보들을 보낸다.
			model.addAttribute("list", list); 
			model.addAttribute("currentPage", currentPage);
			model.addAttribute("startPage", endPage - groupSize + 1);
			model.addAttribute("endPage", totalPage < endPage ? totalPage : endPage);
			model.addAttribute("lastPage", totalPage);

		} catch (Exception e) {
			e.printStackTrace();
		}
		return "diary/diaryMain";
	}

	@GetMapping("/one") 
	public void selectOne(DiaryDTO diaryDTO, Model model) { // 작성글 상세 보기
		
		try {
			DiaryDTO selectDiary = diaryService.selectOne(diaryDTO);
			model.addAttribute("diary", selectDiary);
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}

	}

[DiaryServiceImpl.java 일부]

@Service
public class DiaryServiceImpl implements DiaryService {

	private DiaryDAO diaryDAO;
	private SqlSessionTemplate sqlSession;

	@Autowired
	public DiaryServiceImpl(DiaryDAO diaryDAO, SqlSessionTemplate sqlSession) {
		super();
		this.diaryDAO = diaryDAO;
		this.sqlSession = sqlSession;
	}
    
	@Override // 일기list 조회
	public ArrayList<DiaryDTO> diaryList(PageDTO pageDTO) throws Exception {

		ArrayList<DiaryDTO> list = diaryDAO.diaryList(sqlSession, pageDTO);

		return list;
	}

	@Override // 작성자의 전체 일기 개수 조회
	public int selectCount(String userId) throws Exception {

		int result = diaryDAO.selectCount(sqlSession, userId);
		return result;
	}

	@Override // 일기 상세 조회
	public DiaryDTO selectOne(DiaryDTO diaryDTO) throws Exception {

		DiaryDTO selectDiary = diaryDAO.selectOne(sqlSession, diaryDTO);
		return selectDiary;
	}

}

[DiaryMapper.xml 일부]

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd" >
<mapper namespace="diaryMapper">
	<resultMap type="diaryDTO" id="diaryResultSet">
		<result property="dno" column="dno" />
		<result property="userId" column="user_id" />
		<result property="title" column="title" />
		<result property="content" column="content" />
		<result property="img" column="img" />
		<result property="createdDate" column="create_date" />
		<!-- <result property="rownum" column="rownum" /> -->
	</resultMap>

	<select id="diaryList" parameterType="pageDTO"
		resultMap="diaryResultSet">
		SELECT dno, rownum, create_date, title, content, img
		FROM 
		(SELECT 
		ROW_NUMBER() OVER(ORDER BY create_date DESC) AS ROWNUM, D.*
		FROM DIARY D
		WHERE user_id = #{userId}) DIARY2
		WHERE
		diary2.rownum between
		${start} and ${end}
	</select>

	<select id="selectCount" parameterType="String"
		resultType="_int">
		select count(*) from
		diary
		where user_id = #{userId}
	</select>

	<select id="selectOne" parameterType="diaryDTO"
		resultMap="diaryResultSet">
		select * from
		diary
		where dno = #{dno}
	</select>
</mapper>

이로써 일기장의 작성, 조회 기능이 끝났다! 뿌듯!

본 포스팅은 멀티캠퍼스의 멀티잇 백엔드 개발(Java)의 교육을 수강하고 작성되었습니다.

profile
성장하는 개발자, 하지은입니다.

0개의 댓글