ㅎㅇ

일단 티스토리 글쓰기 << ㅈㄴ 이상합니다 .

원래 지원하던 다음블로그 ? 에디터가 좋았는데 Flash 가 2021년에 지원중단되면서 티스토리가 지원하는 신 에디터로 글을 써야하거든요

신 에디터 사진넣는거, 이건 좋ㄷ ㅏ이말이야. 근데 글자 폰트조절을 못하겠다는거 >> 화난다 .

 

ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

글 목록 보기를 구현해봅시다.

'글 목록' 을 볼려면 글이 저장되어있는 데이터베이스를 Select 해야할것입니다.

데이터베이스가 어떻게 생겼었는지 다시 면상이나 한 번 보죠 ~

사실 제가 글쓰는 텀이 너무 길어서 까먹었습니다.

 

MySQL

 

create user 'bloguser'@'%' identified by '비밀번호';
GRANT ALL PRIVILEGES ON *.* TO 'bloguser'@'%';
create database blog; 
use blog;


drop table user;
drop table board;
drop table reply;

CREATE TABLE user(
	id int primary key auto_increment,
    username varchar(100) not null unique,
    password varchar(100) not null,
    email varchar(100) not null,
    address varchar(100),
    userRole varchar(20),
    createDate timestamp
) ;

CREATE TABLE board(
	id int primary key auto_increment,
    userId int,
    title varchar(100) not null,
    content longtext,
    readCount int default 0,
    createDate timestamp,
    foreign key (userId) references user (id)
);

CREATE TABLE reply(
	id int primary key auto_increment,
    userId int,
    boardId int,
    content varchar(300) not null,
    createDate timestamp,
    foreign key (userId) references user (id) on delete set null,
    foreign key (boardId) references board (id) on delete cascade
);

우리가 봐야할 데이터는 Board .

 

 

BoardDao.java

public List<Board> findAll(){
		String sql = "SELECT * FROM  board ORDER BY id DESC";
		Connection conn = DB.getConnection();
		PreparedStatement pstmt = null;
		ResultSet rs  = null;
		List<Board> boards = new ArrayList<>();
		try {
			pstmt = conn.prepareStatement(sql);
			rs =  pstmt.executeQuery();

			// Persistence API
			while(rs.next()) { // 커서를 이동하는 함수
				Board board = Board.builder()
						.id(rs.getInt("id"))
						.title(rs.getString("title"))
						.content(rs.getString("content"))
						.readCount(rs.getInt("readCount"))
						.userId(rs.getInt("userId"))
						.createDate(rs.getTimestamp("createDate"))
						.build();
				boards.add(board);	
			}
			return boards;
		} catch (Exception e) {
			e.printStackTrace();
		} finally { // 무조건 실행
			DB.close(conn, pstmt, rs);
		}

		return null;
	}

BoardDao에 findAll() 함수 추가.

DB에서 Board를 SELECT 해서 싸ㅡ악 가져오네요

 

BoardService.java

public List<Board> 글목록보기(){
		return boardDao.findAll();
	}

BoardService에 글목록보기() 함수 추가. ( List 를 반환합니다 ~ )

 

BoardController.java

else if (cmd.equals("list")) {
			List<Board> boards = boardService.글목록보기();
			request.setAttribute("boards", boards);
			RequestDispatcher dis = request.getRequestDispatcher("board/list.jsp");
			dis.forward(request, response);
		}

BoardController에 cmd.equlas("list") 코드 추가.

글목록보기 함수의 결과값을 boards  List변수에 담습니다.

jsp에서 boards 데이터를 쓸 수 있도록 하기위해서 request.setAttribute(key , value) 를 해줍니다.

 

 

 

List.jsp

 저 부분에 DB에서 가져온 Board 데이터를 뿌려보겠습니다. 

 

<div class="container">

	<div class="m-2">
		<form class="form-inline d-flex justify-content-end" action="/blog/board">
			<input type="hidden" name="cmd" value="search" />
			<input type="hidden" name="page" value="0" />

			<input type="text" name="keyword" class="form-control mr-sm-2" placeholder="Search">			
			<button class="btn btn-primary m-1">검색</button>

		</form>
	</div>

	<div class="progress col-md-12 m-2">
		<div class="progress-bar" style="width: 70%"></div>
	</div>

		<!-- JSTL foreach문을 써서 뿌리세요. el표현식과 함께 -->

	<c:forEach var="board" items="${boards}">
		<div class="card col-md-12 m-2">
			<div class="card-body">
				<h4 class="card-title">${board.title}</h4>
				<a href="/blog/board?cmd=detail&id=${board.id}" class="btn btn-primary">상세보기</a>
			</div>
            <div>글 번호 : ${board.id }</div>
		</div>
	</c:forEach>

	<br />
	<ul class="pagination justify-content-center">
		<li class="page-item disabled"><a class="page-link" href="#">Previous</a></li>
		<li class="page-item"><a class="page-link" href="#">Next</a></li>
	</ul>
</div>

</body>
</html>

Controller 에서 jsp에서 사용하기위해서 setAttribute를 사용했다고 했었죠?

boards 라는 key 로 반복문(forEach) 을 사용하고있네요. 그리고 중간중간 ${board.title} 으로 

데이터를 get 쓰듯이 불러오고 있어요.

 

 

index.jsp에 sendRedirect를 dispatcher 로 고치셨나요 ??

<%
	RequestDispatcher dis = 
		request.getRequestDispatcher("board?cmd=list"); 
	dis.forward(request, response); // 톰켓이 생성하는 request와 response를 재사용한다. 다시 접근하는게 아니라 내부적으로 움직인다는 뜻.
%> 

 

 

 

 

 

결과

+ Recent posts