본문 바로가기
개발 공부 Today I Learned

[국비 28일차 TIL] 게시판 만들기 1 (게시글 작성 페이지, 삭제 등)

by 개발자신입 2023. 12. 29.
반응형

 

JSP

게시판 만들기

 

index 페이지

 

<%@page import="com.coffee.dao.BoardDAO"%>
<%@page import="java.util.HashMap"%>
<%@page import="java.util.Map"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
table{
	width: 800px;
	border-collapse: collapse;
}
td {
	text-align: center;
	border-bottom: dotted gray 1px;
}
tbody tr:hover {
	background-color: #A77EEB;
}

.w1 {
	width: 10%;
}
.w2 {
	width: 15%;
}
.w5 {
	width: 25%;
	text-align: left;
}
</style>



</head>
<body>
	<h1>index</h1>
	<!-- 게시판 내용 보기 -->
	<%
	BoardDAO dao = new BoardDAO();
	List<Map<String, Object>> list = dao.boardList();
	%>

	<table>
		<thead>
			<tr>
				<th>번호</th>
				<th>제목</th>
				<th>내용</th>
				<th>글쓴이</th>
				<th>작성일</th>
				<th>조회수</th>
			</tr>
		</thead>
		<tbody>
		<%
		
		// servlet 서블릿 : 자바 코드 속에 html이 있음.
		// jsp java server page : html코드 속에 java가 있음.
		for(Map<String, Object> map : list) {
		%>
			<tr>
				<td class="w1"><%= map.get("board_no")%></td>
				<td class="w5">
					<a href="./detail.jsp?no=<%= map.get("board_no")%>">
					<%= map.get("board_title")%></a>
				</td>
				<td class="w5"><%= map.get("board_content")%></td>
				<td class="w1"><%= map.get("board_write")%></td>
				<td class="w2"><%= map.get("board_date")%></td>
				<td class="w1"><%= map.get("board_count")%></td>
			</tr>
		<% 
		} 
		%>		
		</tbody>
	
	</table>
	
	<button onclick="write1()">글쓰기</button>
	
<script type="text/javascript">
function write1() {
	 if(confirm("글 작성하러 오셨어요?")){
		 alert("멋진 글 기대할게요");
		 location.href="./write.jsp";
	 } else {
		 alert("글쓰기 취소?")
	 }
}
</script>
	
	<br><br>
	연습 <a href="./test">>>여기<<</a> TEST로 넘어가기 눌러주세요. <br><br>
	리스트 <a href="./detail.jsp">>>여기<<</a> 리스트로 넘어가기 눌러주세요.
	
	<!-- 
	자바 코드를 여러 줄 작성 < % % >
	자바의 값 하나 출력 < % = % >
	 -->
	
</body>
</html>

 

detail

 

리스트에서 글을 눌렀을 때 나오는 페이지

 

<%@page import="java.util.Map"%>
<%@page import="com.coffee.dao.BoardDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<h1>톺아보기</h1>
	<%
	String no = request.getParameter("no"); // "3" 
	
	// DAO
	BoardDAO dao = new BoardDAO();
	Map<String, Object> detail = dao.detail(no);
	
	%>
	<!-- 삭제 이미지를 누르면 삭제되는 기능 추가 --> 
	<a href="./delete.jsp?no=">
	<img alt ="삭제" src="./img/delete1.png" title="버튼 누르면 삭제됨."> <br>
	</a>
	
	<img onclick="del(<%=detail.get("board_no") %>)" alt="삭제" src="./img/delete1.png" title="버튼 누르면 삭제됨."> <br>
	
	제목 :<%=detail.get("board_title")%><br>
	글쓴이 : <%=detail.get("board_write")%><br>
	날짜 : <%=detail.get("board_date")%><br>
	번호 : <%=detail.get("board_no") %><br>
	조회수 : <%=detail.get("board_count")%><br>
	<hr>
	<%=detail.get("board_content")%><br><br>
	
	<button onclick="what()">눌러보세요.</button>
	
	<script type="text/javascript">
	function what(){	// 함수
		for(var i = 0; i <10; i++) {
		alert("오늘은 23년의 마지막 평일입니다.");
		}
		
	}
	function del(no) {
		if(confirm("삭제 ㄱ?")){
			location.href="./delete?no="+no;
			// .jsp 제거 -> 서블릿으로 변경
		}
	}
	</script>
</body>
</html>

 

 

BoardDAO

 

게시판 Data Access Object

 

  • 글 삭제
  • 톺아보기
  • 게시판

 

package com.coffee.dao;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import com.coffee.db.DBConnection;

public class BoardDAO {
	DBConnection dbCon = new DBConnection();
	
	// 글 삭제하기
	
	public void delete(String no) {
		Connection conn = dbCon.getConn();
		PreparedStatement pstmt = null;
		String sql = "DELETE FROM board WHERE board_no = ?";
		
		try {
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, no);
			pstmt.execute();	// boolean값, excuteQuery() = rs가 필요함.
		} catch (SQLException e) {
			e.printStackTrace();
		} finally {
			close(null, pstmt, conn); // rs가 없어서 null 처리함. 메소드를 공유하므로..
		}
	}
	
	

	// 톺아보기

	public Map<String, Object> detail(String no) {
		Map<String, Object> detail = new HashMap<String, Object>(); // 한 줄만

		Connection conn = dbCon.getConn(); // 접속 정보 얻어오기
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		String sql = "SELECT * FROM board WHERE board_NO = ?"; // 값 ? 적어주면 밑에서 추가 가능

		try {
			pstmt = conn.prepareStatement(sql);
			// 위의 sql문의 물음표 처리
			pstmt.setString(1, no); // DB관련 인덱스는 1부터 시작
			rs = pstmt.executeQuery();

			if (rs.next()) {
				Map<String, Object> e = new HashMap<String, Object>();
				detail.put("board_no", rs.getInt("board_no"));
				detail.put("board_title", rs.getString("board_title"));
				detail.put("board_content", rs.getString("board_content"));
				detail.put("board_write", rs.getString("board_write"));
				detail.put("board_date", rs.getString("board_date"));
				detail.put("board_count", rs.getInt("board_count"));

			}

		} catch (SQLException e) {
			e.printStackTrace();
		} finally {
			close(rs, pstmt, conn);
		}

		return detail;
	}

	// 게시판

	public List<Map<String, Object>> boardList() {
		List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();
		Connection conn = dbCon.getConn();
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		String sql = "SELECT * FROM board";

		try {
			pstmt = conn.prepareStatement(sql);
			rs = pstmt.executeQuery();

			while (rs.next()) {
				Map<String, Object> e = new HashMap<String, Object>();
				e.put("board_no", rs.getInt("board_no"));
				e.put("board_title", rs.getString("board_title"));
				e.put("board_content", rs.getString("board_content"));
				e.put("board_write", rs.getString("board_write"));
				e.put("board_date", rs.getString("board_date"));
				e.put("board_count", rs.getInt("board_count"));
				list.add(e);
			}
		} catch (SQLException e) {
			e.printStackTrace();
		} finally {
			close(rs, pstmt, conn);
		}
		return list;
	}

	private void close(ResultSet rs, PreparedStatement pstmt, Connection conn) {
		try {
			if (rs != null) {
				rs.close();
			}
			if (pstmt != null) {
				pstmt.close();
			}
			if (conn != null) {
				conn.close();
			}
		} catch (SQLException e) {
			e.printStackTrace();
		}
	}
}

 

 

delete

<%@page import="com.coffee.dao.BoardDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> 삭제 페이지 </title>
</head>
<body>
	<!-- 삭제 기능만 수행하고 페이지 이동 후 끝! -->
	<%
	String no = request.getParameter("no");
	BoardDAO dao = new BoardDAO();
	dao.delete(no);
	
	// 페이지 이동
	response.sendRedirect("./index.jsp");
	
	%>

</body>
</html>

 

 

서블렛

package com.coffee.web;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.coffee.dao.BoardDAO;

 
@WebServlet("/delete")
public class Delete extends HttpServlet {
	private static final long serialVersionUID = 1L;
 
    public Delete() {
        super();
    }
 
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//		response.getWriter().append("Served at: ").append(request.getContextPath());
		String no = request.getParameter("no");
		BoardDAO dao = new BoardDAO();
		dao.delete(no);
		
		// 페이지 이동
		response.sendRedirect("./index.jsp");
		
	}
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doGet(request, response);
	}

}

 

 

write

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> 글쓰기 </title>

<link rel="stylesheet" type="text/css" href="./css/write.css">

</head>
<body>
	<h1>글을 작성하는 페이지</h1>
	<!-- form 글 제목, 글 내용 -->
	<form action="./writeAction.jsp">
		<input type="text" name="title"><br>
		<textarea name="content"></textarea><br>
		<button type="submit">글쓰기</button>
	</form>

</body>
</html>

 

write CSS

@charset "UTF-8";

input {
	width: 100%;
	height: 30px;
	margin-bottom: 5px;
	background-color: #B188F5;
}

textarea {
	width: 100%;
	height: 300px;
	font-size: large;
	margin: 5px 10px 5px 10px;
	
}
	/* 
	margin : 5px 10px 15px 20px; // 4개의 경우 시계방향
	margin : 10px 20px; // 2개의 경우,  위 아래 10px  양옆 20px
	*/

button{
	width: 100%;
}

 

 

writeAction  글을 작성하는 페이지

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<!-- 데이터베이스에 값 전달 후 끝! -->
	<%
	String title = request.getParameter("title");
	String content = request.getParameter("content");
	%>
	
	타이틀 : <%=title %> <br>
	내용 : <%=content %><br>
	
	<!-- 페이지 이동  -->

</body>
</html>
반응형
저작자표시 비영리 변경금지

'개발 공부 Today I Learned' 카테고리의 다른 글

[국비 30일차 TIL] 스레드, 중첩 클래스, 입출력 스트림,  (1) 2024.01.03
[국비 29일차 TIL] 게시판 만들기 2 (글 저장, 글 수정)  (0) 2024.01.02
[국비 27일차 TIL] 자바 데이터베이스 연결, html, css, jsp  (1) 2023.12.28
[국비 26일차 TIL] JSP 프로젝트 생성, 데이터베이스 연결  (0) 2023.12.27
[국비 25일차 TIL] JAVA 예외 처리, try catch finally  (1) 2023.12.27

관련글

댓글

티스토리툴바