페이징 게시판

학습 목표

⚠️ 글이 100 개가 되면

🛠️ 페이징 — 한 페이지에 N 개씩

① Mapper — 페이지 단위 조회

<select id="selectListPaging" parameterType="map"
        resultType="com.smhrd.domain.Board">
    SELECT num, title, writer, content, created_at
    FROM myboard
    ORDER BY num DESC
    LIMIT #{startRow}, #{pageSize}
</select>

<select id="count" resultType="int">
    SELECT COUNT(*) FROM myboard
</select>

② Paging 보조 클래스 (도메인 아님)

package com.smhrd.domain;

// 화면 페이징 계산 전용 — DB 와 1:1 매핑되는 도메인이 아님
public class Paging {
    private int pageNo;       // 현재 페이지 (1부터)
    private int pageSize;     // 한 페이지 행 수 (예: 10)
    private int totalCount;   // 전체 글 수

    public Paging(int pageNo, int pageSize, int totalCount) {
        this.pageNo = pageNo < 1 ? 1 : pageNo;
        this.pageSize = pageSize;
        this.totalCount = totalCount;
    }
    public int getStartRow() { return (pageNo - 1) * pageSize; }
    public int getTotalPages() {
        return (int) Math.ceil((double) totalCount / pageSize);
    }
    public int getPageNo()     { return pageNo; }
    public int getPageSize()   { return pageSize; }
    public int getTotalCount() { return totalCount; }
}

③ Service — 페이징 처리

@Service
public class BoardService {
    @Autowired private BoardMapper mapper;

    private static final int PAGE_SIZE = 10;

    public List<Board> selectListPaging(Paging paging) {
        Map<String, Integer> param = new HashMap<>();
        param.put("startRow", paging.getStartRow());
        param.put("pageSize", paging.getPageSize());
        return mapper.selectListPaging(param);
    }

    public Paging buildPaging(int pageNo) {
        int total = mapper.count();
        return new Paging(pageNo, PAGE_SIZE, total);
    }
}

④ Controller

@GetMapping("/board/list")
public String list(@RequestParam(defaultValue = "1") int page,
                    Model model) {
    Paging paging = service.buildPaging(page);
    List<Board> boards = service.selectListPaging(paging);

    model.addAttribute("boards", boards);
    model.addAttribute("paging", paging);
    return "board/list";
}

⑤ JSP — 목록과 이전/다음

<table>
    <c:forEach var="b" items="${boards}">
        <tr><td>${b.num}</td><td>${b.title}</td><td>${b.writer}</td></tr>
    </c:forEach>
</table>

<div class="pagination">
    <c:if test="${paging.pageNo > 1}">
        <a href="?page=${paging.pageNo - 1}">이전</a>
    </c:if>

    <c:if test="${paging.pageNo < paging.totalPages}">
        <a href="?page=${paging.pageNo + 1}">다음</a>
    </c:if>
</div>

⑤ JSP — 페이지 번호 출력

<c:forEach begin="1" end="${paging.totalPages}" var="p">
    <c:choose>
        <c:when test="${p == paging.pageNo}">
            <strong>${p}</strong>
        </c:when>
        <c:otherwise>
            <a href="?page=${p}">${p}</a>
        </c:otherwise>
    </c:choose>
</c:forEach>

실험 — 부하 직접 보기

-- 더미 데이터 100 개 (MySQL)
INSERT INTO myboard(title, writer, content)
SELECT CONCAT('테스트 글 ', seq), 'tester', '본문'
FROM (
    SELECT @row := @row + 1 AS seq
    FROM (SELECT 0 UNION SELECT 1 UNION SELECT 2) t1,
         (SELECT 0 UNION SELECT 1 UNION SELECT 2) t2,
         (SELECT 0 UNION SELECT 1 UNION SELECT 2 UNION SELECT 3) t3,
         (SELECT @row := 0) r
) numbers
LIMIT 100;

👉 100 개 INSERT 후 v6 list 와 v7 list 비교 — UI 차이 직접 확인.

흔한 실수

🔄 Before / After

정리