카테고리 없음

for 루프로 table 추가하기

Blue_bull 2025. 2. 5. 14:06

for(Board bean: boardList){ } 루프를 실행할 때마다 새로운 <tr>(테이블 행)이 추가되는 코드.

동작 방식:

  1. boardListBoard 객체들의 리스트입니다.
  2. for 루프는 리스트에 있는 각 Board 객체를 bean으로 가져옵니다.
  3. bean의 데이터를 <td> 태그에 삽입하여 <tr>을 생성합니다.
  4. boardList에 저장된 Board 객체 수만큼 <tr>이 반복적으로 추가됩니다.

즉, boardList에 10개의 Board 객체가 있다면 테이블에 10개의 <tr> 행이 생성됩니다.

추가 설명:

  • 만약 boardList가 비어 있다면, 테이블의 <tbody>는 아무 내용 없이 출력됩니다.
  • baseUrl을 활용해 각 게시글 제목을 클릭하면 boDetailView.jsp?no=<%=bean.getNo()%>로 이동하도록 설정되어 있습니다.

주어진 JSP 코드의 분석을 진행하겠습니다.


코드 개요

이 JSP 코드는 boardList라는 List<Board> 객체를 반복하면서, 각 게시글 정보를 <table> 태그로 출력하는 역할을 합니다.


코드 상세 분석

1. 테이블 구조

<table class="table table-hover table-border">
  • table 태그: 테이블을 만들기 위한 HTML 요소
  • class="table table-hover table-border":
    • table: Bootstrap 스타일 적용 (기본 테이블 스타일)
    • table-hover: 마우스를 올리면 행에 hover 효과 적용
    • table-border: 테이블 테두리를 표시

2. 테이블 헤더 (<thead>)

<thead>
    <tr>
        <th>글번호</th>
        <th>작성자</th>
        <th>비밀 번호</th>
        <th>글제목</th>
        <th>글내용</th>
        <th>조회수</th>
        <th>작성 일자</th>
    </tr>
</thead>
  • thead 태그: 테이블의 머리글을 정의
  • tr 태그: 한 줄(행)을 의미
  • th 태그: 컬럼(열)의 제목 (굵게 표시됨)

이 테이블은 총 7개의 컬럼을 가짐:

  1. 글번호 (No)
  2. 작성자 (Writer)
  3. 비밀번호 (Password)
  4. 글제목 (Subject)
  5. 글내용 (Content)
  6. 조회수 (Readhit)
  7. 작성 일자 (Date)

3. 테이블 바디 (<tbody>) - 게시글 데이터 출력

<tbody>
    <% for(Board bean: boardList){ %>
    <tr>
        <td align="center"><%=bean.getNo()%></td>
        <td><%=bean.getWriter()%></td>
        <td><%=bean.getPassword()%></td>
        <td>
            <a href="<%=baseUrl%>board/boDetailView.jsp?no=<%=bean.getNo()%>">
                <%=bean.getSubject()%>
            </a>
        </td>
        <td><%=bean.getContent()%></td>
        <td><span class="badge rounded-pill bg-primary"><%=bean.getReadhit()%></span></td>
        <td>2022/10/10</td>
    </tr>
    <% } %>
</tbody>

1) for 루프 실행

<% for(Board bean: boardList){ %>
  • boardListList<Board> 형태이며, 여러 개의 Board 객체를 포함한 리스트
  • for 루프를 실행할 때마다 bean 객체를 가져와 Board 클래스의 데이터를 출력

2) 행(<tr>) 추가

<tr>
    <td align="center"><%=bean.getNo()%></td>
    <td><%=bean.getWriter()%></td>
    <td><%=bean.getPassword()%></td>
    <td>
        <a href="<%=baseUrl%>board/boDetailView.jsp?no=<%=bean.getNo()%>">
            <%=bean.getSubject()%>
        </a>
    </td>
    <td><%=bean.getContent()%></td>
    <td><span class="badge rounded-pill bg-primary"><%=bean.getReadhit()%></span></td>
    <td>2022/10/10</td>
</tr>

<td> 태그는 bean 객체의 데이터를 출력함:

  1. <%=bean.getNo()%> → 게시글 번호 출력

  2. <%=bean.getWriter()%> → 작성자 출력

  3. <%=bean.getPassword()%> → 비밀번호 출력

  4. 제목 클릭 시 상세 페이지 이동

    <a href="<%=baseUrl%>board/boDetailView.jsp?no=<%=bean.getNo()%>">
        <%=bean.getSubject()%>
    </a>
    • baseUrl 변수를 사용해 boDetailView.jsp로 이동
    • no=<%=bean.getNo()%>를 전달하여 해당 글의 상세 보기 페이지로 연결
  5. <%=bean.getContent()%> → 게시글 내용 출력

  6. 조회수 표시 (readhit)

    <td><span class="badge rounded-pill bg-primary"><%=bean.getReadhit()%></span></td>
    • bean.getReadhit() 값을 가져와 조회수(readhit) 출력
    • Bootstrap badge 스타일을 사용하여 강조
  7. 작성 일자

    <td>2022/10/10</td>
    • 고정된 날짜(2022/10/10)로 되어있음
    • 실제 날짜 데이터를 출력하려면 bean.getDate() 같은 메서드를 사용해야 함

코드 실행 흐름

  1. boardList에서 데이터를 가져와 for 루프 실행
  2. boardList의 크기만큼 <tr> 태그가 추가됨 (게시글 개수만큼 행이 늘어남)
  3. Board 객체의 정보를 td 태그 안에 출력
  4. 제목 클릭 시 boDetailView.jsp?no=게시글번호로 이동

개선할 수 있는 부분

1. 날짜 데이터 동적으로 변경

현재 날짜가 고정(2022/10/10)되어 있는데, 동적으로 Board 객체의 날짜를 가져오도록 수정하는 것이 좋음.

<td><%=bean.getDate()%></td>

단, Board 클래스에 getDate() 메서드가 존재해야 함.

2. 비밀번호 보안 문제

비밀번호(bean.getPassword())를 화면에 그대로 노출하는 것은 보안상 위험함. 이를 아예 숨기거나 **** 같은 마스킹 처리하는 것이 좋음.

<td>****</td>

3. 조회수 증가 처리

현재 readhit 값이 표시되지만, 클릭할 때 증가하는 로직이 없음.
게시글을 클릭할 때 boDetailView.jsp에서 조회수를 증가시키는 UPDATE 문을 실행해야 함.

예시 (boDetailView.jsp)

<% 
    int no = Integer.parseInt(request.getParameter("no"));
    Connection conn = getConnection();
    String sql = "UPDATE board SET readhit = readhit + 1 WHERE no = ?";
    PreparedStatement pstmt = conn.prepareStatement(sql);
    pstmt.setInt(1, no);
    pstmt.executeUpdate();
%>

결론

  • 이 JSP 코드는 boardList를 가져와 테이블 형식으로 게시글 목록을 출력하는 기능을 수행
  • for 루프를 사용하여 게시글 수만큼 <tr>이 반복해서 생성됨
  • readhit 값은 조회수를 나타내지만 증가 처리는 boDetailView.jsp에서 추가해야 함
  • 작성 일자를 동적으로 변경하면 더 좋음

이제 코드가 어떻게 동작하는지 잘 이해되었을 거야. 추가로 궁금한 점 있으면 질문해 줘! 😊